diff --git a/templates/block/block--local-actions-block.html.twig b/templates/block/block--local-actions-block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..97df94b66670796b1186a3349fb949ed7124e832 --- /dev/null +++ b/templates/block/block--local-actions-block.html.twig @@ -0,0 +1,12 @@ +{% extends "block.html.twig" %} +{# +/** + * @file + * Theme override for local actions (primary admin actions.) + */ +#} +{% block content %} + {% if content %} + <nav class="action-links">{{ content }}</nav> + {% endif %} +{% endblock %} diff --git a/templates/block/block--local-tasks-block.html.twig b/templates/block/block--local-tasks-block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..0f25f59d83131f120371ed25943903c48c3abe63 --- /dev/null +++ b/templates/block/block--local-tasks-block.html.twig @@ -0,0 +1,14 @@ +{% extends "block.html.twig" %} +{# +/** + * @file + * Theme override for tabs. + */ +#} +{% block content %} + {% if content %} + <nav class="tabs" role="navigation" aria-label="{{ 'Tabs'|t }}"> + {{ content }} + </nav> + {% endif %} +{% endblock %} diff --git a/templates/block/block--message-block.html.twig b/templates/block/block--message-block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..8035587b2335201fb6dc82be891d9cd6537f00fe --- /dev/null +++ b/templates/block/block--message-block.html.twig @@ -0,0 +1,45 @@ +{# +/** + * @file + * Theme override to display a block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values. + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: array of HTML attributes populated by modules, intended to + * be added to the main container tag of this template. + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * @see template_preprocess_block() + */ +#} +{% + set classes = [ + 'block', + 'block-' ~ configuration.provider|clean_class, + 'block-' ~ plugin_id|clean_class, + 'status--warning', + ] +%} +<div{{ attributes.addClass(classes) }}> + {{ title_prefix }} + {% if label %} + <h2{{ title_attributes }}>{{ label }}</h2> + {% endif %} + {{ title_suffix }} + {% block content %} + {{ content }} + {% endblock %} +</div> \ No newline at end of file diff --git a/templates/block/block--search-form-block.html.twig b/templates/block/block--search-form-block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..5ed0795d113ed75c2d001b5edda7296de64e643e --- /dev/null +++ b/templates/block/block--search-form-block.html.twig @@ -0,0 +1,48 @@ +{# +/** + * @file + * Theme override for the search form block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values, including: + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: A list HTML attributes populated by modules, intended to + * be added to the main container tag of this template. Includes: + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * @see template_preprocess_block() + * @see search_preprocess_block() + */ +#} +{% + set classes = [ + 'block', + 'block-search', + 'container-inline', + 'info-box' + ] +%} +<div{{ attributes.addClass(classes) }}> + {{ title_prefix }} + {% if label %} + <h2{{ title_attributes.addClass('block-title') }}>{{ label }}</h2> + {% endif %} + {{ title_suffix }} + {% block content %} + {{ content }} + {% endblock %} +</div> + + diff --git a/templates/block/block--system-menu-block--account.html.twig b/templates/block/block--system-menu-block--account.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..86d77748357ac141c6ab67750d72e5521ac4fbbd --- /dev/null +++ b/templates/block/block--system-menu-block--account.html.twig @@ -0,0 +1,46 @@ +{# +/** + * @file + * Theme override to display a block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values. + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: array of HTML attributes populated by modules, intended to + * be added to the main container tag of this template. + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * @see template_preprocess_block() + */ +#} +{% + set classes = [ + 'block', + 'block-' ~ configuration.provider|clean_class, + 'block-' ~ plugin_id|clean_class, + 'cell', + 'medium-4', + ] +%} +<div{{ attributes.addClass(classes) }}> + {{ title_prefix }} + {% if label %} + <h2{{ title_attributes }}>{{ label }}</h2> + {% endif %} + {{ title_suffix }} + {% block content %} + {{ content }} + {% endblock %} +</div> diff --git a/templates/block/block--system-menu-block--main.html.twig b/templates/block/block--system-menu-block--main.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..3ad7f9cf6a5f32feb765ba8d7c6093d88d15bc33 --- /dev/null +++ b/templates/block/block--system-menu-block--main.html.twig @@ -0,0 +1,45 @@ +{# +/** + * @file + * Theme override to display a block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values. + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: array of HTML attributes populated by modules, intended to + * be added to the main container tag of this template. + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * @see template_preprocess_block() + */ +#} +{% + set classes = [ + 'block', + 'block-' ~ configuration.provider|clean_class, + 'block-' ~ plugin_id|clean_class, + 'cell', + ] +%} +<div{{ attributes.addClass(classes) }}> + {{ title_prefix }} + {% if label %} + <h2{{ title_attributes }}>{{ label }}</h2> + {% endif %} + {{ title_suffix }} + {% block content %} + {{ content }} + {% endblock %} +</div> diff --git a/templates/block/block--system-menu-block.html.twig b/templates/block/block--system-menu-block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..24d11daa8444addf3c316f22ed3abda56fabc033 --- /dev/null +++ b/templates/block/block--system-menu-block.html.twig @@ -0,0 +1,62 @@ +{# +/** + * @file + * Theme override for a menu block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values. + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: HTML attributes for the containing element. + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: HTML attributes for the title element. + * - content_attributes: HTML attributes for the content element. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * Headings should be used on navigation menus that consistently appear on + * multiple pages. When this menu block's label is configured to not be + * displayed, it is automatically made invisible using the 'visually-hidden' CSS + * class, which still keeps it visible for screen-readers and assistive + * technology. Headings allow screen-reader and keyboard only users to navigate + * to or skip the links. + * See http://juicystudio.com/article/screen-readers-display-none.php and + * http://www.w3.org/TR/WCAG-TECHS/H42.html for more information. + */ +#} +{% + set classes = [ + 'block', + 'block-menu', + 'navigation', + 'menu--' ~ derivative_plugin_id|clean_class, + ] +%} +{% + set title_classes = [ + 'menu-title', + 'menu-title--' ~ derivative_plugin_id|clean_class, + ] +%} +{% set heading_id = attributes.id ~ '-menu'|clean_id %} +<nav role="navigation" aria-labelledby="{{ heading_id }}"{{ attributes.addClass(classes)|without('role', 'aria-labelledby') }}> + {# Label. If not displayed, we still provide it for screen readers. #} + {% if not configuration.label_display %} + {% set title_attributes = title_attributes.addClass('visually-hidden') %} + {% endif %} + {{ title_prefix }} + <h2{{ title_attributes.setAttribute('id', heading_id).addClass(title_classes) }}>{{ configuration.label }}</h2> + {{ title_suffix }} + + {# Menu. #} + {% block content %} + {{ content }} + {% endblock %} +</nav> diff --git a/templates/block/block.html.twig b/templates/block/block.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..fd3311be958b9de2fcd17108309c854fdc807217 --- /dev/null +++ b/templates/block/block.html.twig @@ -0,0 +1,44 @@ +{# +/** + * @file + * Theme override to display a block. + * + * Available variables: + * - plugin_id: The ID of the block implementation. + * - label: The configured label of the block if visible. + * - configuration: A list of the block's configuration values. + * - label: The configured label for the block. + * - label_display: The display settings for the label. + * - provider: The module or other provider that provided this block plugin. + * - Block plugin specific settings will also be stored here. + * - content: The content of this block. + * - attributes: array of HTML attributes populated by modules, intended to + * be added to the main container tag of this template. + * - id: A valid HTML ID and guaranteed unique. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * + * @see template_preprocess_block() + */ +#} +{% + set classes = [ + 'block', + 'block-' ~ configuration.provider|clean_class, + 'block-' ~ plugin_id|clean_class, + ] +%} +<div{{ attributes.addClass(classes) }}> + {{ title_prefix }} + {% if label %} + <h2{{ title_attributes }}>{{ label }}</h2> + {% endif %} + {{ title_suffix }} + {% block content %} + {{ content }} + {% endblock %} +</div> diff --git a/templates/content/node.html.twig b/templates/content/node.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..38ee20bce68de0b5ec0ab0efa3c05f2634802220 --- /dev/null +++ b/templates/content/node.html.twig @@ -0,0 +1,98 @@ +{# +/** + * @file + * Theme override to display a node. + * + * Available variables: + * - node: The node entity with limited access to object properties and methods. + * Only method names starting with "get", "has", or "is" and a few common + * methods such as "id", "label", and "bundle" are available. For example: + * - node.getCreatedTime() will return the node creation timestamp. + * - node.hasField('field_example') returns TRUE if the node bundle includes + * field_example. (This does not indicate the presence of a value in this + * field.) + * - node.isPublished() will return whether the node is published or not. + * Calling other methods, such as node.delete(), will result in an exception. + * See \Drupal\node\Entity\Node for a full list of public properties and + * methods for the node object. + * - label: (optional) The title of the node. + * - content: All node items. Use {{ content }} to print them all, + * or print a subset such as {{ content.field_example }}. Use + * {{ content|without('field_example') }} to temporarily suppress the printing + * of a given child element. + * - author_picture: The node author user entity, rendered using the "compact" + * view mode. + * - metadata: Metadata for this node. + * - date: (optional) Themed creation date field. + * - author_name: (optional) Themed author name field. + * - url: Direct URL of the current node. + * - display_submitted: Whether submission information should be displayed. + * - attributes: HTML attributes for the containing element. + * The attributes.class element may contain one or more of the following + * classes: + * - node: The current template type (also known as a "theming hook"). + * - node--type-[type]: The current node type. For example, if the node is an + * "Article" it would result in "node--type-article". Note that the machine + * name will often be in a short form of the human readable label. + * - node--view-mode-[view_mode]: The View Mode of the node; for example, a + * teaser would result in: "node--view-mode-teaser", and + * full: "node--view-mode-full". + * The following are controlled through the node publishing options. + * - node--promoted: Appears on nodes promoted to the front page. + * - node--sticky: Appears on nodes ordered above other non-sticky nodes in + * teaser listings. + * - node--unpublished: Appears on unpublished nodes visible only to site + * admins. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - content_attributes: Same as attributes, except applied to the main + * content tag that appears in the template. + * - author_attributes: Same as attributes, except applied to the author of + * the node tag that appears in the template. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * - view_mode: View mode; for example, "teaser" or "full". + * - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'. + * - page: Flag for the full page state. Will be true if view_mode is 'full'. + * - readmore: Flag for more state. Will be true if the teaser content of the + * node cannot hold the main body content. + * - logged_in: Flag for authenticated user status. Will be true when the + * current user is a logged-in member. + * - is_admin: Flag for admin user status. Will be true when the current user + * is an administrator. + * + * @see template_preprocess_node() + * + * @todo Remove the id attribute (or make it a class), because if that gets + * rendered twice on a page this is invalid CSS for example: two lists + * in different view modes. + */ +#} +{% + set classes = [ + 'node', + 'node--type-' ~ node.bundle|clean_class, + node.isPromoted() ? 'node--promoted', + node.isSticky() ? 'node--sticky', + not node.isPublished() ? 'node--unpublished', + view_mode ? 'node--view-mode-' ~ view_mode|clean_class, + ] +%} + +<article{{ attributes.addClass(classes) }}> + + {{ title_prefix }} + {% if label and not page %} + <h2{{ title_attributes }}> + <a href="{{ url }}" rel="bookmark">{{ label }}</a> + </h2> + {% endif %} + {{ title_suffix }} + + <div{{ content_attributes.addClass('node__content') }}> + {{ content }} + </div> + +</article> diff --git a/templates/content/page-title.html.twig b/templates/content/page-title.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..e1de7266074e092d5d5d99d1c0c12bc36955989b --- /dev/null +++ b/templates/content/page-title.html.twig @@ -0,0 +1,19 @@ +{# +/** + * @file + * Theme override for page titles. + * + * Available variables: + * - title_attributes: HTML attributes for the page title element. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title: The page title, for use in the actual content. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + */ +#} +{{ title_prefix }} +{% if title %} + <h1{{ title_attributes.addClass('page-title') }}>{{ title }}</h1> +{% endif %} +{{ title_suffix }} diff --git a/templates/details/details.html.twig b/templates/details/details.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..098e1038a3e0d868be8b80e398dcccc102cf7223 --- /dev/null +++ b/templates/details/details.html.twig @@ -0,0 +1,40 @@ +{# +/** + * @file + * Theme override for a details element. + * + * Available variables + * - attributes: A list of HTML attributes for the details element. + * - errors: (optional) Any errors for this details element, may not be set. + * - title: (optional) The title of the element, may not be set. + * - summary_attributes: A list of HTML attributes for the summary element. + * - description: (optional) The description of the element, may not be set. + * - children: (optional) The children of the element, may not be set. + * - value: (optional) The value of the element, may not be set. + * + * @see template_preprocess_details() + */ +#} +<details{{ attributes }}> + {% + set summary_classes = [ + required ? 'js-form-required', + required ? 'form-required', + ] + %} + {%- if title -%} + <summary{{ summary_attributes.addClass(summary_classes) }}>{{ title }}</summary> + {%- endif -%} + + {% if errors %} + <div> + {{ errors }} + </div> + {% endif %} + <div class="details__inner"> + {{ description }} + {{ children }} + {{ value }} + </div> +</details> + diff --git a/templates/field/field.html.twig b/templates/field/field.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..0b10969a874ab7ab0ea3e536365c14a6f98864c2 --- /dev/null +++ b/templates/field/field.html.twig @@ -0,0 +1,80 @@ +{# +/** + * @file + * Theme override for a field. + * + * To override output, copy the "field.html.twig" from the templates directory + * to your theme's directory and customize it, just like customizing other + * Drupal templates such as page.html.twig or node.html.twig. + * + * Instead of overriding the theming for all fields, you can also just override + * theming for a subset of fields using + * @link themeable Theme hook suggestions. @endlink For example, + * here are some theme hook suggestions that can be used for a field_foo field + * on an article node type: + * - field--node--field-foo--article.html.twig + * - field--node--field-foo.html.twig + * - field--node--article.html.twig + * - field--field-foo.html.twig + * - field--text-with-summary.html.twig + * - field.html.twig + * + * Available variables: + * - attributes: HTML attributes for the containing element. + * - label_hidden: Whether to show the field label or not. + * - title_attributes: HTML attributes for the title. + * - label: The label for the field. + * - multiple: TRUE if a field can contain multiple items. + * - items: List of all the field items. Each item contains: + * - attributes: List of HTML attributes for each item. + * - content: The field item's content. + * - entity_type: The entity type to which the field belongs. + * - field_name: The name of the field. + * - field_type: The type of the field. + * - label_display: The display settings for the label. + * + * + * @see template_preprocess_field() + */ +#} +{% + set classes = [ + 'field', + 'field--name-' ~ field_name|clean_class, + 'field--type-' ~ field_type|clean_class, + 'field--label-' ~ label_display, + ] +%} +{% + set title_classes = [ + 'field__label', + label_display == 'visually_hidden' ? 'visually-hidden', + ] +%} + +{% if label_hidden %} + {% if multiple %} + <div{{ attributes.addClass(classes, 'field__items') }}> + {% for item in items %} + <div{{ item.attributes.addClass('field__item') }}>{{ item.content }}</div> + {% endfor %} + </div> + {% else %} + {% for item in items %} + <div{{ attributes.addClass(classes, 'field__item') }}>{{ item.content }}</div> + {% endfor %} + {% endif %} +{% else %} + <div{{ attributes.addClass(classes) }}> + <div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div> + {% if multiple %} + <div class="field__items"> + {% endif %} + {% for item in items %} + <div{{ item.attributes.addClass('field__item') }}>{{ item.content }}</div> + {% endfor %} + {% if multiple %} + </div> + {% endif %} + </div> +{% endif %} diff --git a/templates/form/form--user-login-form.html.twig b/templates/form/form--user-login-form.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..52d6b9ff42150ef1d1fb839237392f9180d95f46 --- /dev/null +++ b/templates/form/form--user-login-form.html.twig @@ -0,0 +1,22 @@ +{# +/** + * @file + * Theme override for a 'form' element. + * + * Available variables + * - attributes: A list of HTML attributes for the wrapper element. + * - children: The child elements of the form. + * + * @see template_preprocess_form() + */ +#} +<form{{ attributes }}> + <div class="login-box login-box--osu"> + <h2 class="login-box__header login-box__header--osu">Ohio State Users</h2> + <a class="button" href="/saml_login">Log in with your Ohio State credentials</a> + </div> + <details class="login-box login-box--drupal"> + <summary class="login-box__collapsible"><h2 class="login-box__header login-box__header--drupal">Non-Ohio State Users</h2></summary> + <div class="login-form">{{ children }}</div> + </details> +</form> diff --git a/templates/form/form-element.html.twig b/templates/form/form-element.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..9e87a1b6da3d6f50ae9023d31f3d89ea4babb821 --- /dev/null +++ b/templates/form/form-element.html.twig @@ -0,0 +1,94 @@ +{# +/** + * @file + * Theme override for a form element. + * + * Available variables: + * - attributes: HTML attributes for the containing element. + * - errors: (optional) Any errors for this form element, may not be set. + * - prefix: (optional) The form element prefix, may not be set. + * - suffix: (optional) The form element suffix, may not be set. + * - required: The required marker, or empty if the associated form element is + * not required. + * - type: The type of the element. + * - name: The name of the element. + * - label: A rendered label element. + * - label_display: Label display setting. It can have these values: + * - before: The label is output before the element. This is the default. + * The label includes the #title and the required marker, if #required. + * - after: The label is output after the element. For example, this is used + * for radio and checkbox #type elements. If the #title is empty but the + * field is #required, the label will contain only the required marker. + * - invisible: Labels are critical for screen readers to enable them to + * properly navigate through forms but can be visually distracting. This + * property hides the label for everyone except screen readers. + * - attribute: Set the title attribute on the element to create a tooltip but + * output no label element. This is supported only for checkboxes and radios + * in \Drupal\Core\Render\Element\CompositeFormElementTrait::preRenderCompositeFormElement(). + * It is used where a visual label is not needed, such as a table of + * checkboxes where the row and column provide the context. The tooltip will + * include the title and required marker. + * - description: (optional) A list of description properties containing: + * - content: A description of the form element, may not be set. + * - attributes: (optional) A list of HTML attributes to apply to the + * description content wrapper. Will only be set when description is set. + * - description_display: Description display setting. It can have these values: + * - before: The description is output before the element. + * - after: The description is output after the element. This is the default + * value. + * - invisible: The description is output after the element, hidden visually + * but available to screen readers. + * - disabled: True if the element is disabled. + * - title_display: Title display setting. + * + * @see template_preprocess_form_element() + */ +#} +{% + set classes = [ + 'js-form-item', + 'form-item', + 'js-form-type-' ~ type|clean_class, + 'form-item-' ~ name|clean_class, + 'js-form-item-' ~ name|clean_class, + title_display not in ['after', 'before'] ? 'form-no-label', + disabled == 'disabled' ? 'form-disabled', + errors ? 'form-item--error', + ] +%} +{% + set description_classes = [ + 'description', + description_display == 'invisible' ? 'visually-hidden', + ] +%} +<div{{ attributes.addClass(classes) }}> + {% if label_display in ['before', 'invisible'] %} + {{ label }} + {% endif %} + {% if prefix is not empty %} + <span class="field-prefix">{{ prefix }}</span> + {% endif %} + {% if description_display == 'before' and description.content %} + <div{{ description.attributes }}> + {{ description.content }} + </div> + {% endif %} + {{ children }} + {% if suffix is not empty %} + <span class="field-suffix">{{ suffix }}</span> + {% endif %} + {% if label_display == 'after' %} + {{ label }} + {% endif %} + {% if errors %} + <div class="form-item--error-message"> + {{ errors }} + </div> + {% endif %} + {% if description_display in ['after', 'invisible'] and description.content %} + <div{{ description.attributes.addClass(description_classes) }}> + {{ description.content }} + </div> + {% endif %} +</div> diff --git a/templates/form/form.html.twig b/templates/form/form.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..97b4b7a3de207fc82d768ad3ce77da4379d4ff76 --- /dev/null +++ b/templates/form/form.html.twig @@ -0,0 +1,15 @@ +{# +/** + * @file + * Theme override for a 'form' element. + * + * Available variables + * - attributes: A list of HTML attributes for the wrapper element. + * - children: The child elements of the form. + * + * @see template_preprocess_form() + */ +#} +<form{{ attributes }}> + {{ children }} +</form> diff --git a/templates/media/media--inline-image--default.html.twig b/templates/media/media--inline-image--default.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..e1893d998f163ef61b6070f5e58273a89176d56f --- /dev/null +++ b/templates/media/media--inline-image--default.html.twig @@ -0,0 +1,27 @@ +{# +/** + * @file + * Theme override to display a media item. + * + * Available variables: + * - name: Name of the media. + * - content: Media content. + * + * @see template_preprocess_media() + * + * @ingroup themeable + */ +#} +{% + set classes = [ + 'media', + 'media--type-' ~ media.bundle()|clean_class, + view_mode ? 'media--view-mode-' ~ view_mode|clean_class, + ] +%} +<span{{ attributes.addClass(classes) }}> + {{ title_suffix.contextual_links }} + {% if content %} + {{ content }} + {% endif %} +</span> diff --git a/templates/media/media.html.twig b/templates/media/media.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..422030e9d027b79f2b77d252f09bad1fb7821bdd --- /dev/null +++ b/templates/media/media.html.twig @@ -0,0 +1,28 @@ +{# +/** + * @file + * Theme override to display a media item. + * + * Available variables: + * - name: Name of the media. + * - content: Media content. + * + * @see template_preprocess_media() + * + * @ingroup themeable + */ +#} +{% + set classes = [ + 'media', + 'media--type-' ~ media.bundle()|clean_class, + not media.isPublished() ? 'media--unpublished', + view_mode ? 'media--view-mode-' ~ view_mode|clean_class, + ] +%} +<article{{ attributes.addClass(classes) }}> + {{ title_suffix.contextual_links }} + {% if content %} + {{ content }} + {% endif %} +</article> diff --git a/templates/misc/status-messages.html.twig b/templates/misc/status-messages.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..8143a1b6f4e020126e50c815bbd55d4d1fdc4bb9 --- /dev/null +++ b/templates/misc/status-messages.html.twig @@ -0,0 +1,24 @@ +{# +/** + * @file + * Theme override for status messages. + * + * Displays status, error, and warning messages, grouped by type. + * + * An invisible heading identifies the messages for assistive technology. + * Sighted users see a colored box. See http://www.w3.org/TR/WCAG-TECHS/H69.html + * for info. + * + * Add an ARIA label to the contentinfo area so that assistive technology + * user agents will better describe this landmark. + * + * Available variables: + * - message_list: List of messages to be displayed, grouped by type. + * - status_headings: List of all status types. + * - display: (optional) May have a value of 'status' or 'error' when only + * displaying messages of that specific type. + * - attributes: HTML attributes for the element, including: + * - class: HTML classes. + */ +#} +{% include "@molecules/status-message/status-message.twig" %} diff --git a/templates/navigation/breadcrumb.html.twig b/templates/navigation/breadcrumb.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..09cb0f342b549784db112a3dbd9b70880adf098d --- /dev/null +++ b/templates/navigation/breadcrumb.html.twig @@ -0,0 +1,11 @@ +{# +/** + * @file + * Theme override for a breadcrumb trail. + * + * Available variables: + * - breadcrumb: Breadcrumb trail items. + */ +#} + +{% include "@molecules/menus/breadcrumbs/breadcrumbs.twig" %} \ No newline at end of file diff --git a/templates/navigation/menu-local-action.html.twig b/templates/navigation/menu-local-action.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..27872837abdca839f016b791feb731656f653108 --- /dev/null +++ b/templates/navigation/menu-local-action.html.twig @@ -0,0 +1,13 @@ +{# +/** + * @file + * Theme override for a single local action link. + * + * Available variables: + * - attributes: HTML attributes for the wrapper element. + * - link: A rendered link element. + * + * @see template_preprocess_menu_local_action() + */ +#} +<li{{ attributes }}>{{ link }}</li> diff --git a/templates/navigation/menu-local-task.html.twig b/templates/navigation/menu-local-task.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..b8559815b9e937120f8fd4f87bcfe27e7a30c0b0 --- /dev/null +++ b/templates/navigation/menu-local-task.html.twig @@ -0,0 +1,17 @@ +{# +/** + * @file + * Theme override for a local task link. + * + * Available variables: + * - attributes: HTML attributes for the wrapper element. + * - is_active: Whether the task item is an active tab. + * - link: A rendered link element. + * + * Note: This template renders the content for each task item in + * menu-local-tasks.html.twig. + * + * @see template_preprocess_menu_local_task() + */ +#} +<li{{ attributes.addClass(is_active ? 'is-active') }}>{{ link }}</li> diff --git a/templates/navigation/menu-local-tasks.html.twig b/templates/navigation/menu-local-tasks.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..bb8c790be297dbe3a47f2cfb98be69326eb0f803 --- /dev/null +++ b/templates/navigation/menu-local-tasks.html.twig @@ -0,0 +1,22 @@ +{# +/** + * @file + * Theme override to display primary and secondary local tasks. + * + * Available variables: + * - primary: HTML list items representing primary tasks. + * - secondary: HTML list items representing primary tasks. + * + * Each item in these variables (primary and secondary) can be individually + * themed in menu-local-task.html.twig. + */ +#} + +{% if primary %} + <h2 class="visually-hidden">{{ 'Primary tabs'|t }}</h2> + <ul class="menu menu--tabs menu--tabs--primary">{{ primary }}</ul> +{% endif %} +{% if secondary %} + <h2 class="visually-hidden">{{ 'Secondary tabs'|t }}</h2> + <ul class="menu menu--tabs menu--tabs--secondary">{{ secondary }}</ul> +{% endif %} diff --git a/templates/navigation/menu.html.twig b/templates/navigation/menu.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..b437f8760e978d34f8ce6945969e17abf29f5e6a --- /dev/null +++ b/templates/navigation/menu.html.twig @@ -0,0 +1,55 @@ +{# +/** + * @file + * Theme override to display a menu. + * + * Available variables: + * - menu_name: The machine name of the menu. + * - items: A nested list of menu items. Each menu item contains: + * - attributes: HTML attributes for the menu item. + * - below: The menu item child items. + * - title: The menu link title. + * - url: The menu link url, instance of \Drupal\Core\Url + * - localized_options: Menu link localized options. + * - is_expanded: TRUE if the link has visible children within the current + * menu tree. + * - is_collapsed: TRUE if the link has children within the current menu tree + * that are not currently visible. + * - in_active_trail: TRUE if the link is in the active trail. + */ +#} +{% import _self as menus %} + +{# + We call a macro which calls itself to render the full tree. + @see https://twig.symfony.com/doc/1.x/tags/macro.html +#} +{{ menus.menu_links(items, attributes, 0) }} + +{% macro menu_links(items, attributes, menu_level) %} + {% import _self as menus %} + {% if items %} + {% if menu_level == 0 %} + <ul{{ attributes.addClass('menu') }}> + {% else %} + <ul class="menu"> + {% endif %} + {% for item in items %} + {% + set classes = [ + 'menu-item', + item.is_expanded ? 'menu-item--expanded', + item.is_collapsed ? 'menu-item--collapsed', + item.in_active_trail ? 'menu-item--active-trail', + ] + %} + <li{{ item.attributes.addClass(classes) }}> + {{ link(item.title, item.url) }} + {% if item.below %} + {{ menus.menu_links(item.below, attributes, menu_level + 1) }} + {% endif %} + </li> + {% endfor %} + </ul> + {% endif %} +{% endmacro %} diff --git a/templates/paragraphs/paragraph--accordion-group.html.twig b/templates/paragraphs/paragraph--accordion-group.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..9b3ee721d1112dda4f09cc1fa7196788e89c242a --- /dev/null +++ b/templates/paragraphs/paragraph--accordion-group.html.twig @@ -0,0 +1,10 @@ +{% +set classes = [ + 'paragraph-entity', + 'paragraph-entity--accordion-group' +] +%} + +<div{{ attributes.addClass(classes) }}> + {{ content }} +</div> diff --git a/templates/paragraphs/paragraph--accordion-item.html.twig b/templates/paragraphs/paragraph--accordion-item.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..67cd671a167e74977a72cf5f1a09a4c378a81ded --- /dev/null +++ b/templates/paragraphs/paragraph--accordion-item.html.twig @@ -0,0 +1,47 @@ +{# +/** + * @file + * Default theme implementation to display a paragraph. + * + * Available variables: + * - paragraph: Full paragraph entity. + * - id: The paragraph ID. + * - bundle: The type of the paragraph, for example, "image" or "text". + * - authorid: The user ID of the paragraph author. + * - createdtime: Formatted creation date. Preprocess functions can + * reformat it by calling format_date() with the desired parameters on + * $variables['paragraph']->getCreatedTime(). + * - content: All paragraph items. Use {{ content }} to print them all, + * or print a subset such as {{ content.field_example }}. Use + * {{ content|without('field_example') }} to temporarily suppress the printing + * of a given child element. + * - attributes: HTML attributes for the containing element. + * The attributes.class element may contain one or more of the following + * classes: + * - paragraphs: The current template type (also known as a "theming hook"). + * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an + * "Image" it would result in "paragraphs--type--image". Note that the machine + * name will often be in a short form of the human readable label. + * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a + * preview would result in: "paragraphs--view-mode--preview", and + * default: "paragraphs--view-mode--default". + * - view_mode: View mode; for example, "preview" or "full". + * - logged_in: Flag for authenticated user status. Will be true when the + * current user is a logged-in member. + * - is_admin: Flag for admin user status. Will be true when the current user + * is an administrator. + * + * @see template_preprocess_paragraph() + * + * @ingroup themeable + */ +#} + +<details{{ attributes.addClass('form-wrapper') }}> + <summary> + {{ content.field_accordion_term }} + </summary> + <div class="details__inner"> + {{ content.field_accordion_definition }} + </div> +</details> \ No newline at end of file diff --git a/templates/paragraphs/paragraph--callout.html.twig b/templates/paragraphs/paragraph--callout.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..c55547c89ee7307540e1deb772de43d2c5f9680b --- /dev/null +++ b/templates/paragraphs/paragraph--callout.html.twig @@ -0,0 +1,43 @@ +{# +/** + * @file + * Default theme implementation to display a paragraph. + * + * Available variables: + * - paragraph: Full paragraph entity. + * - id: The paragraph ID. + * - bundle: The type of the paragraph, for example, "image" or "text". + * - authorid: The user ID of the paragraph author. + * - createdtime: Formatted creation date. Preprocess functions can + * reformat it by calling format_date() with the desired parameters on + * $variables['paragraph']->getCreatedTime(). + * - content: All paragraph items. Use {{ content }} to print them all, + * or print a subset such as {{ content.field_example }}. Use + * {{ content|without('field_example') }} to temporarily suppress the printing + * of a given child element. + * - attributes: HTML attributes for the containing element. + * The attributes.class element may contain one or more of the following + * classes: + * - paragraphs: The current template type (also known as a "theming hook"). + * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an + * "Image" it would result in "paragraphs--type--image". Note that the machine + * name will often be in a short form of the human readable label. + * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a + * preview would result in: "paragraphs--view-mode--preview", and + * default: "paragraphs--view-mode--default". + * - view_mode: View mode; for example, "preview" or "full". + * - logged_in: Flag for authenticated user status. Will be true when the + * current user is a logged-in member. + * - is_admin: Flag for admin user status. Will be true when the current user + * is an administrator. + * + * @see template_preprocess_paragraph() + * + * @ingroup themeable + */ +#} + + +{% include "@molecules/callout/_callout.twig" with { + "content": content.field_callout_body +} %} diff --git a/templates/paragraphs/paragraph.html.twig b/templates/paragraphs/paragraph.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..0be6ac5fa177b1b097b69613e1a89abc2ee51410 --- /dev/null +++ b/templates/paragraphs/paragraph.html.twig @@ -0,0 +1,49 @@ +{# +/** + * @file + * Default theme implementation to display a paragraph. + * + * Available variables: + * - paragraph: Full paragraph entity. + * - id: The paragraph ID. + * - bundle: The type of the paragraph, for example, "image" or "text". + * - authorid: The user ID of the paragraph author. + * - createdtime: Formatted creation date. Preprocess functions can + * reformat it by calling format_date() with the desired parameters on + * $variables['paragraph']->getCreatedTime(). + * - content: All paragraph items. Use {{ content }} to print them all, + * or print a subset such as {{ content.field_example }}. Use + * {{ content|without('field_example') }} to temporarily suppress the printing + * of a given child element. + * - attributes: HTML attributes for the containing element. + * The attributes.class element may contain one or more of the following + * classes: + * - paragraphs: The current template type (also known as a "theming hook"). + * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an + * "Image" it would result in "paragraphs--type--image". Note that the machine + * name will often be in a short form of the human readable label. + * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a + * preview would result in: "paragraphs--view-mode--preview", and + * default: "paragraphs--view-mode--default". + * - view_mode: View mode; for example, "preview" or "full". + * - logged_in: Flag for authenticated user status. Will be true when the + * current user is a logged-in member. + * - is_admin: Flag for admin user status. Will be true when the current user + * is an administrator. + * + * @see template_preprocess_paragraph() + * + * @ingroup themeable + */ +#} + +{% +set classes = [ + 'paragraph-entity', + 'paragraph-entity--' ~ paragraph_type +] +%} + +<div{{ attributes.addClass(classes) }}> + {{ content }} +</div> diff --git a/templates/region/region--primary-menu.html.twig b/templates/region/region--primary-menu.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..11fa05b0586d39faf562127614bd93a9e300000e --- /dev/null +++ b/templates/region/region--primary-menu.html.twig @@ -0,0 +1,26 @@ +{# +/** + * @file + * Theme override to display a region. + * + * Available variables: + * - content: The content for this region, typically blocks. + * - attributes: HTML attributes for the region <div>. + * - region: The name of the region variable as defined in the theme's + * .info.yml file. + * + * @see template_preprocess_region() + */ +#} +{% + set classes = [ + 'region', + 'region-' ~ region|clean_class, + 'grid-x' + ] +%} +{% if content %} + <div{{ attributes.addClass(classes) }}> + {{ content }} + </div> +{% endif %} diff --git a/templates/region/region.html.twig b/templates/region/region.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..95e71cec37e409bdfab1d8d90e0a192bede54e9c --- /dev/null +++ b/templates/region/region.html.twig @@ -0,0 +1,25 @@ +{# +/** + * @file + * Theme override to display a region. + * + * Available variables: + * - content: The content for this region, typically blocks. + * - attributes: HTML attributes for the region <div>. + * - region: The name of the region variable as defined in the theme's + * .info.yml file. + * + * @see template_preprocess_region() + */ +#} +{% + set classes = [ + 'region', + 'region-' ~ region|clean_class, + ] +%} +{% if content %} + <div{{ attributes.addClass(classes) }}> + {{ content }} + </div> +{% endif %} diff --git a/templates/system/html.html.twig b/templates/system/html.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..ae0f7d84198edc7d590c0d298d405c33d6fdfb73 --- /dev/null +++ b/templates/system/html.html.twig @@ -0,0 +1,56 @@ +{# +/** + * @file + * Theme override for the basic structure of a single Drupal page. + * + * Variables: + * - logged_in: A flag indicating if user is logged in. + * - root_path: The root path of the current page (e.g., node, admin, user). + * - node_type: The content type for the current node, if the page is a node. + * - head_title: List of text elements that make up the head_title variable. + * May contain one or more of the following: + * - title: The title of the page. + * - name: The name of the site. + * - slogan: The slogan of the site. + * - page_top: Initial rendered markup. This should be printed before 'page'. + * - page: The rendered page markup. + * - page_bottom: Closing rendered markup. This variable should be printed after + * 'page'. + * - db_offline: A flag indicating if the database is offline. + * - placeholder_token: The token for generating head, css, js and js-bottom + * placeholders. + * + * @see template_preprocess_html() + */ +#} + +{% + set body_classes = [ + logged_in ? 'logged-in', + not root_path ? 'path-frontpage' : 'path--' ~ root_path|clean_class, + user.getRoles()|join(' role--'), + ] +%} + +<!DOCTYPE html> +<html{{ html_attributes }}> + <head> + <head-placeholder token="{{ placeholder_token|raw }}"> + <title>{{ head_title|safe_join(' | ') }}</title> + <css-placeholder token="{{ placeholder_token|raw }}"> + <js-placeholder token="{{ placeholder_token|raw }}"> + </head> + <body{{ attributes.addClass(body_classes) }}> + {# + Keyboard navigation/accessibility link to main content section in + page.html.twig. + #} + <a href="#main-content" class="visually-hidden focusable"> + {{ 'Skip to main content'|t }} + </a> + {{ page_top }} + {{ page }} + {{ page_bottom }} + <js-bottom-placeholder token="{{ placeholder_token|raw }}"> + </body> +</html> diff --git a/templates/system/page.html.twig b/templates/system/page.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..c77082af09a543823a60eab249f9c0bdf53c38a9 --- /dev/null +++ b/templates/system/page.html.twig @@ -0,0 +1,105 @@ +{# +/** +* @file +* Theme override to display a single page. +* +* The doctype, html, head and body tags are not in this template. Instead they +* can be found in the html.html.twig template in this directory. +* +* Available variables: +* +* General utility variables: +* - base_path: The base URL path of the Drupal installation. Will usually be +* "/" unless you have installed Drupal in a sub-directory. +* - is_front: A flag indicating if the current page is the front page. +* - logged_in: A flag indicating if the user is registered and signed in. +* - is_admin: A flag indicating if the user has permission to access +* administration pages. +* +* Site identity: +* - front_page: The URL of the front page. Use this instead of base_path when +* linking to the front page. This includes the language domain or prefix. +* +* Page content (in order of occurrence in the default page.html.twig): +* - messages: Status and error messages. Should be displayed prominently. +* - node: Fully loaded node, if there is an automatically-loaded node +* associated with the page and the node ID is the second argument in the +* page's path (e.g. node/12345 and node/12345/revisions, but not +* comment/reply/12345). +* +* Regions: +* - page.header: Items for the header region. +* - page.primary_menu: Items for the primary menu region. +* - page.secondary_menu: Items for the secondary menu region. +* - page.highlighted: Items for the highlighted content region. +* - page.help: Dynamic help text, mostly for admin pages. +* - page.content: The main content of the current page. +* - page.sidebar_first: Items for the first sidebar. +* - page.sidebar_second: Items for the second sidebar. +* - page.footer: Items for the footer region. +* - page.breadcrumb: Items for the breadcrumb region. +* +* @see template_preprocess_page() +* @see html.html.twig +*/ +#} + +<header role="banner"> + {% include "@organisms/osu-navbar/_osu-navbar.twig" %} + {% include "@organisms/masthead/_masthead.twig" %} +</header> + +<div class="layout__wrapper layout__wrapper--primary-menu"> + <div class="layout__inner layout__inner--primary-menu grid-container"> + {{ page.primary_menu }} + </div> +</div> + +<div class="layout__wrapper layout__wrapper--hero clearfix"> + <div class="layout__inner layout__inner--hero grid-container"> + {{ page.hero }} + </div> +</div> + +<div class="layout__wrapper layout__wrapper--breadcrumb clearfix"> + <div class="layout__inner layout__inner--breadcrumb grid-container"> + {{ page.breadcrumb }} + </div> +</div> + +<div class="layout__wrapper layout__wrapper--system clearfix"> + <div class="layout__inner layout__inner--system grid-container"> + {{ page.system }} + </div> +</div> + +<div class="layout__wrapper layout__wrapper--main clearfix"> + <main role="main"> + <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #} + + <div class="grid-container"> + <div class="main__inner grid-x"> + + <div class="content cell auto"> + {{ page.tabs }} + {{ page.content }} + </div> + + {% if page.sidebar %} + <aside class="sidebar cell auto medium-3" role="complementary"> + {{ page.sidebar }} + </aside> + {% endif %} + + </div> + </div> + + {{ page.content_after }} + + </main> +</div> + +<footer role="contentinfo"> + {% include "@organisms/site-footer/_site-footer.twig" %} +</footer> + diff --git a/templates/views/views-view-unformatted.html.twig b/templates/views/views-view-unformatted.html.twig new file mode 100644 index 0000000000000000000000000000000000000000..68f0feb4997a549a26ed278badc680ff34d1a0f1 --- /dev/null +++ b/templates/views/views-view-unformatted.html.twig @@ -0,0 +1,30 @@ +{# +/** + * @file + * Theme override to display a view of unformatted rows. + * + * Available variables: + * - title: The title of this group of rows. May be empty. + * - rows: A list of the view's row items. + * - attributes: The row's HTML attributes. + * - content: The row's content. + * - view: The view object. + * - default_row_class: A flag indicating whether default classes should be + * used on rows. + * + * @see template_preprocess_views_view_unformatted() + */ +#} +{% if title %} + <div>{{ title }}</div> +{% endif %} +{% for row in rows %} + {% + set row_classes = [ + default_row_class ? 'views-row', + ] + %} + <div{{ row.attributes.addClass(row_classes) }}> + {{- row.content -}} + </div> +{% endfor %}