Initial Drupal 11 with DDEV setup
This commit is contained in:
@ -0,0 +1,48 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's implementation to display a block.
|
||||
*
|
||||
* Available variables:
|
||||
* - layout: String that will determine the layout of the block.
|
||||
* - 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.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - 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.
|
||||
* - content_attributes: Same as attributes, except applied to the main content
|
||||
* 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()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-' ~ configuration.provider|clean_class,
|
||||
'block-' ~ plugin_id|clean_class,
|
||||
layout ? 'layout--' ~ layout|clean_class,
|
||||
]
|
||||
%}
|
||||
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{{ content }}
|
||||
{{ title_suffix }}
|
||||
</div>
|
||||
@ -0,0 +1,48 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for a search form block in the Primary Menu region.
|
||||
*
|
||||
* 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.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - content: The content of this block.
|
||||
* - content_attributes: A list of HTML attributes applied to the main content
|
||||
* - 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-narrow',
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
<div{{ content_attributes.addClass('content') }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
@ -0,0 +1,34 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for a search form block.
|
||||
*
|
||||
* Available variables:
|
||||
* - content: The content of this block.
|
||||
* - content_attributes: A list of HTML attributes applied to the main content
|
||||
* tag that appears in the template.
|
||||
*
|
||||
* @see template_preprocess_block()
|
||||
* @see search_preprocess_block()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-search',
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
<div{{ content_attributes.addClass('content', 'container-inline') }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
@ -0,0 +1,56 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme implementation for a search form block in the Secondary Menu region.
|
||||
*
|
||||
* Available variables:
|
||||
* - content: The content of this block.
|
||||
* - content_attributes: A list of HTML attributes applied to the main content
|
||||
* tag that appears in the template.
|
||||
* - label: The configured label of the block if visible.
|
||||
* - attributes: HTML attributes for the wrapper.
|
||||
* - 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()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-search-wide',
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
<button class="block-search-wide__button" aria-label="{{ 'Search Form'|t }}" data-drupal-selector="block-search-wide-button">
|
||||
{% include "@olivero/../images/search.svg" %}
|
||||
<span class="block-search-wide__button-close"></span>
|
||||
</button>
|
||||
|
||||
{#
|
||||
Add tabindex=“-1” to prevent Safari from closing search bar when the submit button is clicked with a mouse.
|
||||
@see https://www.drupal.org/project/drupal/issues/3269716
|
||||
@see https://bugs.webkit.org/show_bug.cgi?id=229895
|
||||
#}
|
||||
<div{{ content_attributes.addClass('block-search-wide__wrapper').setAttribute('data-drupal-selector', 'block-search-wide-wrapper').setAttribute('tabindex', '-1') }}>
|
||||
<div class="block-search-wide__container">
|
||||
<div class="block-search-wide__grid">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
@ -0,0 +1,57 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's override for the User Account Menu navigation 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.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - 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 https://juicystudio.com/article/screen-readers-display-none.php and
|
||||
* https://www.w3.org/TR/WCAG-TECHS/H42.html for more information.
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-menu',
|
||||
'navigation',
|
||||
'menu--' ~ derivative_plugin_id|clean_class,
|
||||
'secondary-nav',
|
||||
]
|
||||
%}
|
||||
{% set heading_id = attributes.id ~ '-menu'|clean_id %}
|
||||
<nav {{ attributes.addClass(classes).setAttribute('aria-labelledby', heading_id).setAttribute('role', 'navigation') }}>
|
||||
{# 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 }}
|
||||
<span{{ title_attributes.setAttribute('id', heading_id) }}>{{ configuration.label }}</span>
|
||||
{{ title_suffix }}
|
||||
{# Menu. #}
|
||||
{% block content %}
|
||||
{{ content }}
|
||||
{% endblock %}
|
||||
</nav>
|
||||
@ -0,0 +1,37 @@
|
||||
{% extends "block.html.twig" %}
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for a branding block.
|
||||
*
|
||||
* Each branding element variable (logo, name, slogan) is only available if
|
||||
* enabled in the block configuration.
|
||||
*
|
||||
* Available variables:
|
||||
* - site_logo: Logo for site as defined in Appearance or theme settings.
|
||||
* - site_name: Name for site as defined in Site information settings.
|
||||
* - site_slogan: Slogan for site as defined in Site information settings.
|
||||
*/
|
||||
#}
|
||||
{% set attributes = attributes.addClass('site-branding') %}
|
||||
{% block content %}
|
||||
<div class="site-branding__inner">
|
||||
{% if site_logo %}
|
||||
<a href="{{ path('<front>') }}" rel="home" class="site-branding__logo">
|
||||
<img src="{{ site_logo }}" alt="{{ 'Home'|t }}" fetchpriority="high"/>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if site_name or site_slogan %}
|
||||
<div class="site-branding__text">
|
||||
{% if site_name %}
|
||||
<div class="site-branding__name">
|
||||
<a href="{{ path('<front>') }}" rel="home" title="{{ 'Home'|t }}">{{ site_name }}</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if site_slogan %}
|
||||
<div class="site-branding__slogan">{{ site_slogan }}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
@ -0,0 +1,56 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's override for the main menu navigation 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.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - 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 https://juicystudio.com/article/screen-readers-display-none.php and
|
||||
* https://www.w3.org/TR/WCAG-TECHS/H42.html for more information.
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-menu',
|
||||
'navigation',
|
||||
'menu--' ~ derivative_plugin_id|clean_class,
|
||||
]
|
||||
%}
|
||||
{% set heading_id = attributes.id ~ '-menu'|clean_id %}
|
||||
<nav {{ attributes.addClass(classes).setAttribute('aria-labelledby', heading_id).setAttribute('role', 'navigation') }}>
|
||||
{# 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.addClass('block__title').setAttribute('id', heading_id) }}>{{ configuration.label }}</h2>
|
||||
{{ title_suffix }}
|
||||
{# Menu. #}
|
||||
{% block content %}
|
||||
{{ content }}
|
||||
{% endblock %}
|
||||
</nav>
|
||||
@ -0,0 +1,21 @@
|
||||
{% extends "block.html.twig" %}
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for Powered by Drupal block.
|
||||
*
|
||||
* The Powered by Drupal block is an optional link to the home page of the
|
||||
* Drupal project.
|
||||
*
|
||||
*/
|
||||
#}
|
||||
{% block content %}
|
||||
{{ attach_library('olivero/powered-by-block') }}
|
||||
<span>
|
||||
{% trans %}Powered by{% endtrans %}
|
||||
<a href="https://www.drupal.org">{% trans %}Drupal{% endtrans %}</a>
|
||||
<span class="drupal-logo" role="img" aria-label="{{ 'Drupal Logo'|t }}">
|
||||
{% include "@olivero/../images/drupal.svg" %}
|
||||
</span>
|
||||
</span>
|
||||
{% endblock %}
|
||||
55
web/core/themes/olivero/templates/block/block.html.twig
Normal file
55
web/core/themes/olivero/templates/block/block.html.twig
Normal file
@ -0,0 +1,55 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's implementation to display a block.
|
||||
*
|
||||
* Available variables:
|
||||
* - layout: String that will determine the layout of the block.
|
||||
* - 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.
|
||||
* - in_preview: Whether the plugin is being rendered in preview mode.
|
||||
* - 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.
|
||||
* - content_attributes: Same as attributes, except applied to the main content
|
||||
* 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()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{%
|
||||
set classes = [
|
||||
'block',
|
||||
'block-' ~ configuration.provider|clean_class,
|
||||
'block-' ~ plugin_id|clean_class,
|
||||
layout ? 'layout--' ~ layout|clean_class,
|
||||
]
|
||||
%}
|
||||
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label %}
|
||||
<h2{{ title_attributes.addClass('block__title') }}>{{ label }}</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% block content %}
|
||||
<div{{ content_attributes.addClass('block__content') }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endblock %}
|
||||
</div>
|
||||
119
web/core/themes/olivero/templates/content/comment.html.twig
Normal file
119
web/core/themes/olivero/templates/content/comment.html.twig
Normal file
@ -0,0 +1,119 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for comments.
|
||||
*
|
||||
* Available variables:
|
||||
* - author: (optional) Comment author. Can be a link or plain text.
|
||||
* - content: The content-related items for the comment display. Use
|
||||
* {{ content }} to print them all, or print a subset such as
|
||||
* {{ content.field_example }}. Use the following code to temporarily suppress
|
||||
* the printing of a given child element:
|
||||
* @code
|
||||
* {{ content|without('field_example') }}
|
||||
* @endcode
|
||||
* - created: (optional) Formatted date and time for when the comment was
|
||||
* created. Preprocess functions can reformat it by calling
|
||||
* DateFormatter::format() with the desired parameters on the
|
||||
* 'comment.created' variable.
|
||||
* - changed: (optional) Formatted date and time for when the comment was last
|
||||
* changed. Preprocess functions can reformat it by calling
|
||||
* DateFormatter::format() with the desired parameters on the
|
||||
* 'comment.changed' variable.
|
||||
* - permalink: Comment permalink.
|
||||
* - submitted: (optional) Submission information created from author and
|
||||
* created during template_preprocess_comment().
|
||||
* - user_picture: (optional) The comment author's profile picture.
|
||||
* - status: Comment status. Possible values are:
|
||||
* unpublished, published, or preview.
|
||||
* - title: (optional) Comment title, linked to the comment.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* The attributes.class may contain one or more of the following classes:
|
||||
* - comment: The current template type; for instance, 'theming hook'.
|
||||
* - by-anonymous: Comment by an unregistered user.
|
||||
* - by-{entity-type}-author: Comment by the author of the parent entity,
|
||||
* eg. by-node-author.
|
||||
* - preview: When previewing a new or edited comment.
|
||||
* The following applies only to viewers who are registered users:
|
||||
* - unpublished: An unpublished comment visible only to administrators.
|
||||
* - 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.
|
||||
* - content_attributes: List of classes for the styling of the comment content.
|
||||
* - title_attributes: Same as attributes, except applied to the main title
|
||||
* tag that appears in the template.
|
||||
* - threaded: A flag indicating whether the comments are threaded or not.
|
||||
*
|
||||
* These variables are provided to give context about the parent comment (if
|
||||
* any, optional):
|
||||
* - parent_comment: Full parent comment entity (if any).
|
||||
* - parent_author: Equivalent to author for the parent comment.
|
||||
* - parent_created: Equivalent to created for the parent comment.
|
||||
* - parent_changed: Equivalent to changed for the parent comment.
|
||||
* - parent_title: Equivalent to title for the parent comment.
|
||||
* - parent_permalink: Equivalent to permalink for the parent comment.
|
||||
* - parent: A text string of parent comment submission information created from
|
||||
* 'parent_author' and 'parent_created' during template_preprocess_comment().
|
||||
* This information is presented to help screen readers follow lengthy
|
||||
* discussion threads. You can hide this from sighted users using the class
|
||||
* visually-hidden.
|
||||
*
|
||||
* These two variables are provided for context:
|
||||
* - comment: Full comment object.
|
||||
* - commented_entity: Entity the comments are attached to.
|
||||
*
|
||||
* @see template_preprocess_comment()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'comment',
|
||||
'js-comment',
|
||||
not parent_comment ? 'comment--level-1',
|
||||
status != 'published' ? 'comment--' ~ status,
|
||||
comment.owner.anonymous ? 'by-anonymous',
|
||||
author_id and author_id == commented_entity.getOwnerId() ? 'by-' ~ commented_entity.getEntityTypeId() ~ '-author',
|
||||
]
|
||||
%}
|
||||
{{ attach_library('olivero/comments') }}
|
||||
<article {{ attributes.addClass(classes).setAttribute('role', 'article').setAttribute('data-drupal-selector', 'comment') }}>
|
||||
{#
|
||||
Hide the "new" indicator by default, let a piece of JavaScript ask the
|
||||
server which comments are new for the user. Rendering the final "new"
|
||||
indicator here would break the render cache.
|
||||
#}
|
||||
<span class="hidden" data-comment-timestamp="{{ new_indicator_timestamp }}"></span>
|
||||
|
||||
{% if submitted %}
|
||||
<div class="comment__picture-wrapper">
|
||||
<div class="comment__picture">
|
||||
{{ user_picture }}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="comment__text-wrapper">
|
||||
{% if submitted %}
|
||||
<footer class="comment__meta">
|
||||
<p class="comment__author">{{ author }}</p>
|
||||
<p class="comment__time">{{ created }}</p>
|
||||
{#
|
||||
Indicate the semantic relationship between parent and child comments
|
||||
for accessibility. The list is difficult to navigate in a screen
|
||||
reader without this information.
|
||||
#}
|
||||
{% if parent %}
|
||||
<p class="visually-hidden">{{ parent }}</p>
|
||||
{% endif %}
|
||||
</footer>
|
||||
{% endif %}
|
||||
<div{{ content_attributes.addClass('comment__content') }}>
|
||||
{% if title %}
|
||||
{{ title_prefix }}
|
||||
<h3{{ title_attributes }}>{{ title }}</h3>
|
||||
{{ title_suffix }}
|
||||
{% endif %}
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
30
web/core/themes/olivero/templates/content/media.html.twig
Normal file
30
web/core/themes/olivero/templates/content/media.html.twig
Normal file
@ -0,0 +1,30 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override to display a media item.
|
||||
*
|
||||
* Available variables:
|
||||
* - media: The media item, with limited access to object properties and
|
||||
* methods.
|
||||
* - 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,
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_suffix.contextual_links }}
|
||||
{% if content %}
|
||||
{{ content }}
|
||||
{% endif %}
|
||||
</div>
|
||||
115
web/core/themes/olivero/templates/content/node--teaser.html.twig
Normal file
115
web/core/themes/olivero/templates/content/node--teaser.html.twig
Normal file
@ -0,0 +1,115 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation to display a node teaser.
|
||||
*
|
||||
* 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.
|
||||
* - 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'.
|
||||
*
|
||||
* @see template_preprocess_node()
|
||||
*/
|
||||
#}
|
||||
|
||||
{%
|
||||
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,
|
||||
]
|
||||
%}
|
||||
|
||||
|
||||
{% embed "olivero:teaser" with {
|
||||
attributes: attributes.addClass(classes),
|
||||
author_attributes,
|
||||
author_name,
|
||||
content,
|
||||
date,
|
||||
display_submitted,
|
||||
label,
|
||||
metadata,
|
||||
title_attributes,
|
||||
title_prefix,
|
||||
title_suffix,
|
||||
read_more,
|
||||
url,
|
||||
} only %}
|
||||
{% block prefix %}
|
||||
{{ title_prefix }}
|
||||
{{ title_suffix }}
|
||||
{% endblock %}
|
||||
{% block meta %}
|
||||
{% if display_submitted %}
|
||||
<div class="node__meta">
|
||||
<span{{ author_attributes }}>
|
||||
{{ 'By'|t }} <span class="node__author">{{- author_name -}}</span>, {{ date }}
|
||||
</span>
|
||||
{{ metadata }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block image %}{{~ content.field_image ~}}{% endblock %}
|
||||
{% block title %}
|
||||
{% if label and not page %}
|
||||
<h2{{ title_attributes.addClass('node__title', 'teaser__title') }}>
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
|
||||
</h2>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
{{ content|without('field_image', 'links') }}
|
||||
{% endblock %}
|
||||
{% endembed %}
|
||||
108
web/core/themes/olivero/templates/content/node.html.twig
Normal file
108
web/core/themes/olivero/templates/content/node.html.twig
Normal file
@ -0,0 +1,108 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation 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.
|
||||
* - 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'.
|
||||
*
|
||||
* @see template_preprocess_node()
|
||||
*/
|
||||
#}
|
||||
|
||||
{% set layout = layout ? 'layout--' ~ layout|clean_class %}
|
||||
|
||||
{%
|
||||
set classes = [
|
||||
'node',
|
||||
'node--type-' ~ node.bundle|clean_class,
|
||||
layout ? 'grid-full',
|
||||
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) }}>
|
||||
<header class="{{ layout }}">
|
||||
{{ title_prefix }}
|
||||
{% if label and not page %}
|
||||
<h2{{ title_attributes.addClass('node__title') }}>
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
|
||||
</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% if display_submitted %}
|
||||
<div class="node__meta">
|
||||
{% if author_picture %}
|
||||
<div class="node__author-image">
|
||||
{{ author_picture }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<span{{ author_attributes }}>
|
||||
{{ 'By'|t }} <span class="node__author">{{- author_name -}}</span>, {{ date }}
|
||||
</span>
|
||||
{{ metadata }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</header>
|
||||
<div{{ content_attributes.addClass('node__content', layout) }}>
|
||||
{# Comments not part of content, so they won't inherit .text-content styles. #}
|
||||
{{ content|without('comment') }}
|
||||
</div>
|
||||
{% if content.comment %}
|
||||
<div id="comments" class="{{ layout }}">
|
||||
{{ content.comment }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</article>
|
||||
@ -0,0 +1,26 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for a page title.
|
||||
*
|
||||
* 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.
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'title',
|
||||
'page-title',
|
||||
]
|
||||
%}
|
||||
|
||||
{{ title_prefix }}
|
||||
{% if (title|render|striptags|trim is not empty) %}
|
||||
<h1{{ title_attributes.addClass(classes) }}>{{ title }}</h1>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
@ -0,0 +1,80 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for displaying a single search result.
|
||||
*
|
||||
* This template renders a single search result. The list of results is
|
||||
* rendered using '#theme' => 'item_list', with suggestions of:
|
||||
* - item_list__search_results__(plugin_id)
|
||||
* - item_list__search_results
|
||||
*
|
||||
* Available variables:
|
||||
* - url: URL of the result.
|
||||
* - title: Title of the result.
|
||||
* - snippet: A small preview of the result. Does not apply to user searches.
|
||||
* - info: String of all the meta information ready for print. Does not apply
|
||||
* to user searches.
|
||||
* - plugin_id: The machine-readable name of the plugin being executed,such
|
||||
* as "node_search" or "user_search".
|
||||
* - 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.
|
||||
* - info_split: Contains same data as info, but split into separate parts.
|
||||
* - info_split.type: Node type (or item type string supplied by module).
|
||||
* - info_split.user: Author of the node linked to users profile. Depends
|
||||
* on permission.
|
||||
* - info_split.date: Last update of the node. Short formatted.
|
||||
* - info_split.comment: Number of comments output as "% comments", %
|
||||
* being the count. (Depends on comment.module).
|
||||
* items should instead be within info and renamed info.foo, info.bar, etc.
|
||||
*
|
||||
* Other variables:
|
||||
* - title_attributes: HTML attributes for the title.
|
||||
* - content_attributes: HTML attributes for the content.
|
||||
*
|
||||
* Since info_split is keyed, a direct print of the item is possible.
|
||||
* This array does not apply to user searches so it is recommended to check
|
||||
* for its existence before printing. The default keys of 'type', 'user' and
|
||||
* 'date' always exist for node searches. Modules may provide other data.
|
||||
* @code
|
||||
* {% if (info_split.comment) %}
|
||||
* <span class="info-comment">
|
||||
* {{ info_split.comment }}
|
||||
* </span>
|
||||
* {% endif %}
|
||||
* @endcode
|
||||
*
|
||||
* To check for all available data within info_split, use the code below.
|
||||
* @code
|
||||
* <pre>
|
||||
* {{ dump(info_split) }}
|
||||
* </pre>
|
||||
* @endcode
|
||||
*
|
||||
* @see template_preprocess_search_result()
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/search-results') }}
|
||||
{% if info_split %}
|
||||
<div class="search-result__meta">
|
||||
{% if info_split.user %}
|
||||
<span>
|
||||
{{ 'By'|t }} <span class="search-result__author">{{- info_split.user -}}</span>
|
||||
</span>
|
||||
{% endif %}
|
||||
{% if info_date %}
|
||||
<span class="search-result__date">, {{ info_date }}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if title %}
|
||||
{{ title_prefix }}
|
||||
<h3{{ title_attributes.addClass('search-result__title') }}>
|
||||
<a href="{{ url }}">{{ title }}</a>
|
||||
</h3>
|
||||
{{ title_suffix }}
|
||||
{% endif %}
|
||||
{% if snippet %}
|
||||
<div{{ content_attributes.addClass('search-result__snippet', layout, 'text-content') }}>{{ snippet }}</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,34 @@
|
||||
{% extends "item-list.html.twig" %}
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for an item list of search results.
|
||||
*
|
||||
* Available variables:
|
||||
* - items: A list of items. Each item contains:
|
||||
* - attributes: HTML attributes to be applied to each list item.
|
||||
* - value: The content of the list element.
|
||||
* - title: The title of the list.
|
||||
* - list_type: The tag for list element ("ul" or "ol").
|
||||
* - attributes: HTML attributes to be applied to the list.
|
||||
* - empty: A message to display when there are no items. Allowed value is a
|
||||
* string or render array.
|
||||
* - context: An list of contextual data associated with the list. For search
|
||||
* results, the following data is set:
|
||||
* - plugin: The search plugin ID, for example "node_search".
|
||||
*
|
||||
* @see template_preprocess_item_list()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'search-results',
|
||||
context.plugin ~ '-results',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set listClasses = [
|
||||
'search-results__item',
|
||||
]
|
||||
%}
|
||||
{% set attributes = attributes.addClass(classes) %}
|
||||
@ -0,0 +1,38 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for an item list.
|
||||
*
|
||||
* Available variables:
|
||||
* - items: A list of items. Each item contains:
|
||||
* - attributes: HTML attributes to be applied to each list item.
|
||||
* - value: The content of the list element.
|
||||
* - title: The title of the list.
|
||||
* - list_type: The tag for list element ("ul" or "ol").
|
||||
* - wrapper_attributes: HTML attributes to be applied to the list wrapper.
|
||||
* - attributes: HTML attributes to be applied to the list.
|
||||
* - empty: A message to display when there are no items. Allowed value is a
|
||||
* string or render array.
|
||||
* - context: A list of contextual data associated with the list. May contain:
|
||||
* - list_style: The custom list style.
|
||||
*
|
||||
* @see template_preprocess_item_list()
|
||||
*/
|
||||
#}
|
||||
{% if context.list_style %}
|
||||
{%- set attributes = attributes.addClass('item-list__' ~ context.list_style) %}
|
||||
{% endif %}
|
||||
{% if items or empty %}
|
||||
{%- if title is not empty -%}
|
||||
<h3>{{ title }}</h3>
|
||||
{%- endif -%}
|
||||
{%- if items -%}
|
||||
<{{ list_type }}{{ attributes }}>
|
||||
{%- for item in items -%}
|
||||
<li{{ item.attributes.addClass(listClasses) }}>{{ item.value }}</li>
|
||||
{%- endfor -%}
|
||||
</{{ list_type }}>
|
||||
{%- else -%}
|
||||
{{- empty -}}
|
||||
{%- endif -%}
|
||||
{%- endif %}
|
||||
15
web/core/themes/olivero/templates/datetime-form.html.twig
Normal file
15
web/core/themes/olivero/templates/datetime-form.html.twig
Normal file
@ -0,0 +1,15 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override of a datetime form element.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: HTML attributes for the datetime form element.
|
||||
* - content: The datelist form element to be output.
|
||||
*
|
||||
* @see \Drupal\Core\Datetime\DatePreprocess::preprocessDatetimeForm()
|
||||
*/
|
||||
#}
|
||||
<div{{ attributes.addClass('form-items-inline') }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
31
web/core/themes/olivero/templates/datetime-wrapper.html.twig
Normal file
31
web/core/themes/olivero/templates/datetime-wrapper.html.twig
Normal file
@ -0,0 +1,31 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override of a datetime form wrapper.
|
||||
*
|
||||
* @see template_preprocess_form_element()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set title_classes = [
|
||||
'form-item__label',
|
||||
required ? 'js-form-required',
|
||||
required ? 'form-required',
|
||||
]
|
||||
%}
|
||||
<div class="form-item form-datetime-wrapper">
|
||||
{% if title %}
|
||||
<h4{{ title_attributes.addClass(title_classes) }}>{{ title }}</h4>
|
||||
{% endif %}
|
||||
{{ content }}
|
||||
{% if errors %}
|
||||
<div class="form-item__error-message">
|
||||
{{ errors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if description %}
|
||||
<div{{ description_attributes.addClass('form-item__description') }}>
|
||||
{{ description }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -0,0 +1,70 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override for comment body field.
|
||||
*
|
||||
* 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,
|
||||
label_display == 'inline' ? 'clearfix',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set title_classes = [
|
||||
'field__label',
|
||||
label_display == 'visually_hidden' ? 'visually-hidden',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set item_classes = [
|
||||
'field__item',
|
||||
'comment__text-content',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if label_hidden %}
|
||||
{% if multiple %}
|
||||
<div{{ attributes.addClass(classes, 'field__items') }}>
|
||||
{% for item in items %}
|
||||
<div{{ item.attributes.addClass(item_classes) }}>{{ item.content }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% for item in items %}
|
||||
<div{{ attributes.addClass(classes, item_classes) }}>{{ 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(item_classes) }}>{{ item.content }}</div>
|
||||
{% endfor %}
|
||||
{% if multiple %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,62 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for comment fields.
|
||||
*
|
||||
* 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.
|
||||
* - 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 title output populated by modules, intended to
|
||||
* be displayed after the main title tag that appears in the template.
|
||||
* - comments: List of comments rendered through comment.html.twig.
|
||||
* - comment_count: Count of comments rendered through comment.html.twig.
|
||||
* - content_attributes: HTML attributes for the form title.
|
||||
* - comment_form: The 'Add new comment' form.
|
||||
* - comment_display_mode: Is the comments are threaded.
|
||||
* - comment_type: The comment type bundle ID for the comment field.
|
||||
* - 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()
|
||||
* @see comment_preprocess_field()
|
||||
*/
|
||||
#}
|
||||
|
||||
{{ attach_library('olivero/comments') }}
|
||||
<section{{ attributes.setAttribute('data-drupal-selector', 'comments').addClass('comments') }}>
|
||||
|
||||
{% if not label_hidden %}
|
||||
{{ title_prefix }}
|
||||
<h2{{ title_attributes.addClass('comments__title') }}>
|
||||
{{- label -}}
|
||||
{%- if comments -%}
|
||||
<span class="comments__count">{{ comment_count }}</span>
|
||||
{%- endif -%}
|
||||
</h2>
|
||||
{{ title_suffix }}
|
||||
{% endif %}
|
||||
|
||||
{% if comment_form %}
|
||||
<div class="add-comment">
|
||||
{% if user_picture %}
|
||||
<div class="add-comment__picture-wrapper">
|
||||
<div class="add-comment__picture">
|
||||
{{ user_picture }}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="add-comment__form">
|
||||
{{ comment_form }}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{{ comments }}
|
||||
|
||||
</section>
|
||||
@ -0,0 +1,50 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero theme override for tags field.
|
||||
*
|
||||
* 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 label.
|
||||
* - label: The label for the field.
|
||||
* - content_attributes: HTML attributes for the content.
|
||||
* - 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,
|
||||
'field--tags',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set title_classes = [
|
||||
'field__label',
|
||||
'field--tags__label',
|
||||
label_display == 'visually_hidden' ? 'visually-hidden',
|
||||
]
|
||||
%}
|
||||
|
||||
{{ attach_library('olivero/tags') }}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{% if not label_hidden %}
|
||||
<h3{{ title_attributes.addClass(title_classes) }}>{{ label }}</h3>
|
||||
{% endif %}
|
||||
<ul class="links field__items field--tags__items">
|
||||
{% for item in items %}
|
||||
<li{{ item.attributes.addClass('field--tags__item') }}>{{ item.content }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
@ -0,0 +1 @@
|
||||
{% extends "field--text.html.twig" %}
|
||||
@ -0,0 +1 @@
|
||||
{% extends "field--text.html.twig" %}
|
||||
@ -0,0 +1,20 @@
|
||||
{% extends "field.html.twig" %}
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a text field.
|
||||
*
|
||||
* A 'clearfix' class is added, because 'text' fields have a 'format' property
|
||||
* that allows a Text Format to be associated with the entered text, which then
|
||||
* applies filtering on output. A common use case is to align images to the left
|
||||
* or right, and without this 'clearfix' class, such aligned images may be
|
||||
* rendered outside of the 'text' field formatter's boundaries, and hence
|
||||
* overlap with other fields. By setting the 'clearfix' class on all 'text'
|
||||
* fields, we prevent that.
|
||||
*
|
||||
* @see https://www.drupal.org/node/2358529
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{% set attributes = attributes.addClass('clearfix') %}
|
||||
81
web/core/themes/olivero/templates/field/field.html.twig
Normal file
81
web/core/themes/olivero/templates/field/field.html.twig
Normal file
@ -0,0 +1,81 @@
|
||||
{#
|
||||
/**
|
||||
* @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,
|
||||
label_display == 'inline' ? 'clearfix',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
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 %}
|
||||
@ -0,0 +1,30 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for guidelines for a text format.
|
||||
*
|
||||
* Available variables:
|
||||
* - format: Contains information about the current text format, including the
|
||||
* following:
|
||||
* - name: The name of the text format, potentially unsafe and needs to be
|
||||
* escaped.
|
||||
* - format: The machine name of the text format, e.g. 'basic_html'.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* - tips: Descriptions and a CSS ID in the form of 'module-name/filter-id'
|
||||
* (only used when 'long' is TRUE) for each filter in one or more text
|
||||
* formats.
|
||||
*
|
||||
* @see template_preprocess_filter_tips()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'filter-guidelines__item',
|
||||
'filter-guidelines__item--' ~ format.id|clean_class,
|
||||
]
|
||||
%}
|
||||
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
<h4 class="label">{{ format.label }}</h4>
|
||||
{{ tips }}
|
||||
</div>
|
||||
@ -0,0 +1,66 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a set of filter tips.
|
||||
*
|
||||
* Available variables:
|
||||
* - tips: Descriptions and a CSS ID in the form of 'module-name/filter-id'
|
||||
* (only used when 'long' is TRUE) for each filter in one or more text
|
||||
* formats.
|
||||
* - long: A flag indicating whether the passed-in filter tips contain extended
|
||||
* explanations, i.e. intended to be output on the path 'filter/tips'
|
||||
* (TRUE), or are in a short format, i.e. suitable to be displayed below a
|
||||
* form element. Defaults to FALSE.
|
||||
* - multiple: A flag indicating there is more than one filter tip.
|
||||
*
|
||||
* @see template_preprocess_filter_tips()
|
||||
* @see claro_preprocess_filter_tips()
|
||||
*/
|
||||
#}
|
||||
{% if multiple %}
|
||||
<h2>{{ 'Text Formats'|t }}</h2>
|
||||
{% endif %}
|
||||
|
||||
{% if tips|length %}
|
||||
{% if multiple %}
|
||||
<div class="compose-tips">
|
||||
{% endif %}
|
||||
|
||||
{% for name, tip in tips %}
|
||||
{% if multiple %}
|
||||
{%
|
||||
set tip_classes = [
|
||||
'compose-tips__item',
|
||||
'compose-tips__item--name-' ~ name|clean_class,
|
||||
]
|
||||
%}
|
||||
<div{{ tip.attributes.addClass(tip_classes) }}>
|
||||
{% endif %}
|
||||
{% if multiple or long %}
|
||||
<h3>{{ tip.name }}</h3>
|
||||
{% endif %}
|
||||
|
||||
{% if tip.list|length %}
|
||||
<ul class="filter-tips {{ long ? 'filter-tips--long' : 'filter-tips--short' }}">
|
||||
{% for item in tip.list %}
|
||||
{%
|
||||
set item_classes = [
|
||||
'filter-tips__item',
|
||||
long ? 'filter-tips__item--long' : 'filter-tips__item--short',
|
||||
long ? 'filter-tips__item--id-' ~ item.id|clean_class,
|
||||
]
|
||||
%}
|
||||
<li{{ item.attributes.addClass(item_classes) }}>{{ item.tip }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
|
||||
{% if multiple %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if multiple %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
@ -0,0 +1,21 @@
|
||||
{#
|
||||
/**
|
||||
* @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()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'search-form',
|
||||
'search-block-form',
|
||||
]
|
||||
%}
|
||||
<form{{ attributes.addClass(classes) }}>
|
||||
{{ children }}
|
||||
</form>
|
||||
62
web/core/themes/olivero/templates/form/details.html.twig
Normal file
62
web/core/themes/olivero/templates/form/details.html.twig
Normal file
@ -0,0 +1,62 @@
|
||||
{#
|
||||
/**
|
||||
* @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()
|
||||
* @see olivero_preprocess_details()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'olivero-details',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set content_wrapper_classes = [
|
||||
'olivero-details__wrapper',
|
||||
'details-wrapper',
|
||||
]
|
||||
%}
|
||||
<details{{ attributes.addClass(classes) }}>
|
||||
{%- if title -%}
|
||||
{%
|
||||
set summary_classes = [
|
||||
'olivero-details__summary',
|
||||
required ? 'js-form-required',
|
||||
required ? 'form-required',
|
||||
]
|
||||
%}
|
||||
<summary{{ summary_attributes.addClass(summary_classes) }}>
|
||||
{{- title -}}
|
||||
{%- if required -%}
|
||||
<span class="required-mark"></span>
|
||||
{%- endif -%}
|
||||
</summary>
|
||||
{%- endif -%}
|
||||
<div{{ content_attributes.addClass(content_wrapper_classes) }}>
|
||||
{% if errors %}
|
||||
<div class="form-item form-item--error-message">
|
||||
{{ errors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{%- if description -%}
|
||||
<div class="olivero-details__description">{{ description }}</div>
|
||||
{%- endif -%}
|
||||
{%- if children -%}
|
||||
{{ children }}
|
||||
{%- endif -%}
|
||||
{%- if value -%}
|
||||
{{ value }}
|
||||
{%- endif -%}
|
||||
</div>
|
||||
</details>
|
||||
@ -0,0 +1,50 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for an individual form element.
|
||||
*
|
||||
* Available variables for all fields:
|
||||
* - multiple: Whether there are multiple instances of the field.
|
||||
*
|
||||
* Available variables for single cardinality fields:
|
||||
* - elements: Form elements to be rendered.
|
||||
*
|
||||
* Available variables when there are multiple fields.
|
||||
* - table: Table of field items.
|
||||
* - description: The description element containing the following properties:
|
||||
* - content: The description content of the form element.
|
||||
* - attributes: HTML attributes to apply to the description container.
|
||||
* - button: "Add another item" button.
|
||||
*
|
||||
* @see template_preprocess_field_multiple_value_form()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{% if multiple %}
|
||||
{%
|
||||
set classes = [
|
||||
'js-form-item',
|
||||
'form-item'
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set description_classes = [
|
||||
'form-item__description',
|
||||
disabled ? 'is-disabled',
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ table }}
|
||||
{% if description.content %}
|
||||
<div{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</div>
|
||||
{% endif %}
|
||||
{% if button %}
|
||||
<div class="form-actions">{{ button }}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% for element in elements %}
|
||||
{{ element }}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
106
web/core/themes/olivero/templates/form/fieldset.html.twig
Normal file
106
web/core/themes/olivero/templates/form/fieldset.html.twig
Normal file
@ -0,0 +1,106 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a fieldset element and its children.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: HTML attributes for the <fieldset> element.
|
||||
* - errors: (optional) Any errors for this <fieldset> element, may not be set.
|
||||
* - required: Boolean indicating whether the <fieldset> element is required.
|
||||
* - legend: The <legend> element containing the following properties:
|
||||
* - title: Title of the <fieldset>, intended for use as the text
|
||||
of the <legend>.
|
||||
* - attributes: HTML attributes to apply to the <legend> element.
|
||||
* - description: The description element containing the following properties:
|
||||
* - content: The description content of the <fieldset>.
|
||||
* - attributes: HTML attributes to apply to the description container.
|
||||
* - 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 (default).
|
||||
* - invisible: The description is output after the element, hidden visually
|
||||
* but available to screen readers.
|
||||
* - children: The rendered child elements of the <fieldset>.
|
||||
* - prefix: The content to add before the <fieldset> children.
|
||||
* - suffix: The content to add after the <fieldset> children.
|
||||
* - title_display: Title display setting.
|
||||
* - inline_items: Boolean indicating whether the <fieldset> items are inline.
|
||||
*
|
||||
* @see template_preprocess_fieldset()
|
||||
* @see olivero_preprocess_fieldset()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'fieldset',
|
||||
attributes.hasClass('fieldgroup') ? 'fieldset--group',
|
||||
'js-form-item',
|
||||
'form-item',
|
||||
'js-form-wrapper',
|
||||
'form-wrapper',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set wrapper_classes = [
|
||||
'fieldset__wrapper',
|
||||
attributes.hasClass('fieldgroup') ? 'fieldset__wrapper--group',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set legend_span_classes = [
|
||||
'fieldset__label',
|
||||
attributes.hasClass('fieldgroup') ? 'fieldset__label--group',
|
||||
required ? 'js-form-required',
|
||||
required ? 'form-required',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set legend_classes = [
|
||||
'fieldset__legend',
|
||||
attributes.hasClass('fieldgroup') and not attributes.hasClass('form-composite') ? 'fieldset__legend--group',
|
||||
attributes.hasClass('form-composite') ? 'fieldset__legend--composite',
|
||||
title_display == 'invisible' ? 'fieldset__legend--invisible' : 'fieldset__legend--visible',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set description_classes = [
|
||||
'fieldset__description',
|
||||
]
|
||||
%}
|
||||
|
||||
<fieldset{{ attributes.addClass(classes) }}>
|
||||
{# Always wrap fieldset legends in a <span> for CSS positioning. #}
|
||||
{% if legend.title %}
|
||||
<legend{{ legend.attributes.addClass(legend_classes) }}>
|
||||
<span{{ legend_span.attributes.addClass(legend_span_classes) }}>{{ legend.title }}</span>
|
||||
</legend>
|
||||
{% endif %}
|
||||
|
||||
<div{{ content_attributes.addClass(wrapper_classes) }}>
|
||||
{% if inline_items %}
|
||||
<div class="container-inline">
|
||||
{% endif %}
|
||||
|
||||
{% if description_display == 'before' and description.content %}
|
||||
<div{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</div>
|
||||
{% endif %}
|
||||
{% if prefix %}
|
||||
<span class="fieldset__prefix">{{ prefix }}</span>
|
||||
{% endif %}
|
||||
{{ children }}
|
||||
{% if suffix %}
|
||||
<span class="fieldset__suffix">{{ suffix }}</span>
|
||||
{% endif %}
|
||||
{% if errors %}
|
||||
<div class="fieldset__error-message">
|
||||
{{ errors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if description_display in ['after', 'invisible'] and description.content %}
|
||||
<div{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</div>
|
||||
{% endif %}
|
||||
|
||||
{% if inline_items %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</fieldset>
|
||||
@ -0,0 +1,17 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for the search form submit button.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: A list of HTML attributes for the input element.
|
||||
* - children: Optional additional rendered elements.
|
||||
*
|
||||
* @see template_preprocess_input()
|
||||
*/
|
||||
#}
|
||||
<button{{ attributes }}>
|
||||
<span class="icon--search"></span>
|
||||
<span class="visually-hidden">{{ attributes.value }}</span>
|
||||
</button>
|
||||
{{ children }}
|
||||
@ -0,0 +1,45 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme Get Started section.
|
||||
*
|
||||
* This section is enabled when no front page content has been populated.
|
||||
*
|
||||
* TODO:
|
||||
* - Move this markup into Drupal's core Frontpage Views.
|
||||
* - Translate/localize this page for different languages.
|
||||
*/
|
||||
#}
|
||||
|
||||
{% set drupal_community = 'https://www.drupal.org/community' %}
|
||||
{% set drupal_values = 'https://www.drupal.org/about/values-and-principles' %}
|
||||
{% set drupal_user_guide = 'https://www.drupal.org/docs/user_guide/en/index.html' %}
|
||||
{% set create_content = path('node.add_page') %}
|
||||
{% set drupal_extend = 'https://www.drupal.org/docs/extending-drupal' %}
|
||||
{% set drupal_global_training_days = 'https://groups.drupal.org/global-training-days' %}
|
||||
{% set drupal_events = 'https://www.drupal.org/community/events' %}
|
||||
{% set drupal_slack = 'https://www.drupal.org/slack' %}
|
||||
{% set drupal_chat = 'https://www.drupal.org/drupalchat' %}
|
||||
{% set drupal_answers = 'https://drupal.stackexchange.com/' %}
|
||||
{% set drupal_support = 'https://www.drupal.org/support' %}
|
||||
|
||||
<div class="text-content">
|
||||
<p>{% trans %}<em>You haven’t created any frontpage content yet.</em>{% endtrans %}</p>
|
||||
<h2>{% trans %}Congratulations and welcome to the Drupal community.{% endtrans %}</h2>
|
||||
<p>{% trans %}Drupal is an open source platform for building amazing digital experiences. It’s made, used, taught, documented, and marketed by the <a href="{{ drupal_community }}">Drupal community</a>. Our community is made up of people from around the world with a shared set of <a href="{{ drupal_values }}">values</a>, collaborating together in a respectful manner. As we like to say:{% endtrans %}</p>
|
||||
<blockquote>{% trans %}Come for the code, stay for the community.{% endtrans %}</blockquote>
|
||||
<h2>{% trans %}Get Started{% endtrans %}</h2>
|
||||
<p>{% trans %}There are a few ways to get started with Drupal:{% endtrans %}</p>
|
||||
<ol>
|
||||
<li>{% trans %}<a href="{{ drupal_user_guide }}">User Guide:</a> Includes installing, administering, site building, and maintaining the content of a Drupal website.{% endtrans %}</li>
|
||||
<li>{% trans %}<a href="{{ create_content }}">Create Content:</a> Want to get right to work? Start adding content. <strong>Note:</strong> the information on this page will go away once you add content to your site. Read on and bookmark resources of interest.{% endtrans %}</li>
|
||||
<li>{% trans %}<a href="{{ drupal_extend }}">Extend Drupal:</a> Drupal’s core software can be extended and customized in remarkable ways. Install additional functionality and change the look of your site using addons contributed by our community.{% endtrans %}</li>
|
||||
</ol>
|
||||
<h2>{% trans %}Next Steps{% endtrans %}</h2>
|
||||
<p>{% trans %}Bookmark these links to our active Drupal community groups and support resources.{% endtrans %}</p>
|
||||
<ul>
|
||||
<li>{% trans %}<a href="{{ drupal_events }}">Upcoming Events:</a> Learn and connect with others at conferences and events held around the world.{% endtrans %}</li>
|
||||
<li>{% trans %}<a href="{{ drupal_community }}">Community Page:</a> List of key Drupal community groups with their own content.{% endtrans %}</li>
|
||||
<li>{% trans %}Get support and chat with the Drupal community on <a href="{{ drupal_slack }}">Slack</a> or <a href="{{ drupal_chat }}">DrupalChat</a>. When you’re looking for a solution to a problem, go to <a href="{{ drupal_support }}">Drupal Support</a> or <a href="{{ drupal_answers }}">Drupal Answers on Stack Exchange</a>.{% endtrans %}</li>
|
||||
</ul>
|
||||
</div>
|
||||
14
web/core/themes/olivero/templates/includes/preload.twig
Normal file
14
web/core/themes/olivero/templates/includes/preload.twig
Normal file
@ -0,0 +1,14 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Preload the non-bold & non-italic fonts for the headings and the body copy.
|
||||
*
|
||||
* Available variables:
|
||||
* - olivero_path: Returns the path to the Olivero theme.
|
||||
*/
|
||||
#}
|
||||
|
||||
<link rel="preload" href="{{ olivero_path }}/fonts/metropolis/Metropolis-Regular.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="preload" href="{{ olivero_path }}/fonts/metropolis/Metropolis-SemiBold.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="preload" href="{{ olivero_path }}/fonts/metropolis/Metropolis-Bold.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="preload" href="{{ olivero_path }}/fonts/lora/lora-v14-latin-regular.woff2" as="font" type="font/woff2" crossorigin>
|
||||
59
web/core/themes/olivero/templates/layout/html.html.twig
Normal file
59
web/core/themes/olivero/templates/layout/html.html.twig
Normal file
@ -0,0 +1,59 @@
|
||||
{#
|
||||
/**
|
||||
* @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.
|
||||
* - olivero_path: Returns the path to an Olivero theme.
|
||||
* - noscript_styles: <noscript> content.
|
||||
*
|
||||
* @see \Drupal\Core\Theme\ThemePreprocess::preprocessHtml()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set body_classes = [
|
||||
logged_in ? 'user-logged-in',
|
||||
not root_path ? 'path-frontpage' : 'path-' ~ root_path|clean_class,
|
||||
node_type ? 'page-node-type-' ~ node_type|clean_class,
|
||||
db_offline ? 'db-offline',
|
||||
]
|
||||
%}
|
||||
<!DOCTYPE html>
|
||||
<html{{ html_attributes }}>
|
||||
<head>
|
||||
<head-placeholder token="{{ placeholder_token }}">
|
||||
<title>{{ head_title|safe_join(' | ') }}</title>
|
||||
<css-placeholder token="{{ placeholder_token }}">
|
||||
<js-placeholder token="{{ placeholder_token }}">
|
||||
{% include '@olivero/includes/preload.twig' with {olivero_path: olivero_path} only %}
|
||||
{{ noscript_styles }}
|
||||
</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-link">
|
||||
{{ 'Skip to main content'|t }}
|
||||
</a>
|
||||
{{ page_top }}
|
||||
{{ page }}
|
||||
{{ page_bottom }}
|
||||
<js-bottom-placeholder token="{{ placeholder_token }}">
|
||||
</body>
|
||||
</html>
|
||||
135
web/core/themes/olivero/templates/layout/page.html.twig
Normal file
135
web/core/themes/olivero/templates/layout/page.html.twig
Normal file
@ -0,0 +1,135 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation 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 normally located in the
|
||||
* core/modules/system 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):
|
||||
* - 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.highlighted: Items for the highlighted region.
|
||||
* - page.primary_menu: Items for the primary menu region.
|
||||
* - page.secondary_menu: Items for the secondary menu region.
|
||||
* - page.content: The main content of the current page.
|
||||
* - page.sidebar: Items for the first sidebar.
|
||||
* - page.featured_bottom_first: Items for the first featured bottom region.
|
||||
* - page.featured_bottom_second: Items for the second featured bottom region.
|
||||
* - page.footer_first: Items for the first footer column.
|
||||
* - page.footer_second: Items for the second footer column.
|
||||
* - page.breadcrumb: Items for the breadcrumb region.
|
||||
* - page.social: Items for the social region.
|
||||
*
|
||||
* @see \Drupal\Core\Theme\ThemePreprocess::preprocessPage()
|
||||
* @see html.html.twig
|
||||
*/
|
||||
#}
|
||||
|
||||
<div id="page-wrapper" class="page-wrapper">
|
||||
<div id="page">
|
||||
|
||||
{% if page.header or page.primary_menu or page.secondary_menu %}
|
||||
<header id="header" class="site-header" data-drupal-selector="site-header" role="banner">
|
||||
|
||||
{# Gets fixed by JavaScript at wide widths. #}
|
||||
<div class="site-header__fixable" data-drupal-selector="site-header-fixable">
|
||||
<div class="site-header__initial">
|
||||
<button class="sticky-header-toggle" data-drupal-selector="sticky-header-toggle" role="switch" aria-controls="site-header__inner" aria-label="{{ 'Sticky header'|t }}" aria-checked="false">
|
||||
<span class="sticky-header-toggle__icon">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{# Needs to extend full width so box shadow will also extend. #}
|
||||
<div id="site-header__inner" class="site-header__inner" data-drupal-selector="site-header-inner">
|
||||
<div class="container site-header__inner__container">
|
||||
|
||||
{{ page.header }}
|
||||
|
||||
{% if page.primary_menu or page.secondary_menu %}
|
||||
<div class="mobile-buttons" data-drupal-selector="mobile-buttons">
|
||||
<button class="mobile-nav-button" data-drupal-selector="mobile-nav-button" aria-label="{{ 'Main Menu'|t }}" aria-controls="header-nav" aria-expanded="false">
|
||||
<span class="mobile-nav-button__label">{{ 'Menu'|t }}</span>
|
||||
<span class="mobile-nav-button__icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="header-nav" class="header-nav" data-drupal-selector="header-nav">
|
||||
{{ page.primary_menu }}
|
||||
{{ page.secondary_menu }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
{% endif %}
|
||||
|
||||
<div id="main-wrapper" class="layout-main-wrapper layout-container">
|
||||
<div id="main" class="layout-main">
|
||||
<div class="main-content">
|
||||
<a id="main-content" tabindex="-1"></a>
|
||||
{{ page.hero }}
|
||||
<div class="main-content__container container">
|
||||
{{ page.highlighted }}
|
||||
{{ page.breadcrumb }}
|
||||
|
||||
{% if page.sidebar %}
|
||||
<div class="sidebar-grid grid-full">
|
||||
<main role="main" class="site-main">
|
||||
{{ page.content_above }}
|
||||
{{ page.content }}
|
||||
</main>
|
||||
|
||||
{{ page.sidebar }}
|
||||
</div>
|
||||
{% else %}
|
||||
<main role="main">
|
||||
{{ page.content_above }}
|
||||
{{ page.content }}
|
||||
</main>
|
||||
{% endif %}
|
||||
{{ page.content_below }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="social-bar">
|
||||
{{ page.social }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="site-footer">
|
||||
<div class="site-footer__inner container">
|
||||
{{ page.footer_top }}
|
||||
{{ page.footer_bottom }}
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div class="overlay" data-drupal-selector="overlay"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the breadcrumb 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the content above 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,28 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the content below 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,
|
||||
]
|
||||
%}
|
||||
|
||||
{{ attach_library('olivero/content-below') }}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the content 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }} id="content">
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the footer bottom 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,31 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the footer top 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
<div class="region--{{ region }}__inner">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,17 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the header 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()
|
||||
*/
|
||||
#}
|
||||
|
||||
{{ content }}
|
||||
<div class="header-nav-overlay" data-drupal-selector="header-nav-overlay"></div>
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the content 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-full',
|
||||
'layout--pass--content-medium',
|
||||
]
|
||||
%}
|
||||
|
||||
{% if content %}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,16 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the header 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()
|
||||
*/
|
||||
#}
|
||||
|
||||
{{ content }}
|
||||
@ -0,0 +1,27 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the header 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 %}
|
||||
@ -0,0 +1,28 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the sidebar 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,
|
||||
]
|
||||
%}
|
||||
|
||||
{{ attach_library('olivero/sidebar') }}
|
||||
|
||||
{% if content %}
|
||||
<aside{{ attributes.addClass(classes) }}>
|
||||
{{ content }}
|
||||
</aside>
|
||||
{% endif %}
|
||||
@ -0,0 +1,20 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override to display the social 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()
|
||||
*/
|
||||
#}
|
||||
|
||||
<div class="social-bar__inner fixable">
|
||||
<div class="rotate">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
26
web/core/themes/olivero/templates/layout/region.html.twig
Normal file
26
web/core/themes/olivero/templates/layout/region.html.twig
Normal file
@ -0,0 +1,26 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's 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 %}
|
||||
62
web/core/themes/olivero/templates/maintenance-page.html.twig
Normal file
62
web/core/themes/olivero/templates/maintenance-page.html.twig
Normal file
@ -0,0 +1,62 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation to display a single Drupal page while offline.
|
||||
*
|
||||
* All available variables are mirrored in page.html.twig.
|
||||
*
|
||||
* @see template_preprocess_maintenance_page()
|
||||
*/
|
||||
#}
|
||||
|
||||
<div id="page-wrapper" class="page-wrapper">
|
||||
<div id="page">
|
||||
|
||||
<header id="header" class="site-header" role="banner" data-once="navigation">
|
||||
<div class="site-header__fixable">
|
||||
<div class="site-header__initial">
|
||||
</div>
|
||||
<div id="site-header__inner" class="site-header__inner">
|
||||
<div class="container site-header__inner__container">
|
||||
<div class="site-branding block block-system block-system-branding-block">
|
||||
<div class="site-branding__inner">
|
||||
<div class="site-branding__text">
|
||||
<div class="site-branding__name">
|
||||
{{ site_name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="main-wrapper" class="layout-main-wrapper layout-container">
|
||||
<div id="main" class="layout-main">
|
||||
<div class="main-content">
|
||||
<a id="main-content" tabindex="-1"></a>
|
||||
<div class="main-content__container container">
|
||||
{{ page.highlighted }}
|
||||
<main role="main">
|
||||
<div class="region region--content-above grid-full layout--pass--content-medium">
|
||||
{% if title %}
|
||||
<h1 class="title" id="page-title">{{ title }}</h1>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="region region--content grid-full layout--pass--content-medium" id="content">
|
||||
<div id="block-olivero-content" class="block block-system block-system-main-block text-content">
|
||||
{{ page.content }}
|
||||
|
||||
{% include "@olivero/../images/site-under-maintenance-icon.svg" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<div class="social-bar">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,17 @@
|
||||
{#
|
||||
/**
|
||||
* @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()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/local-actions') }}
|
||||
|
||||
<li{{ attributes }} class="action-links-item">{{ link }}</li>
|
||||
24
web/core/themes/olivero/templates/misc/feed-icon.html.twig
Normal file
24
web/core/themes/olivero/templates/misc/feed-icon.html.twig
Normal file
@ -0,0 +1,24 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a feed icon.
|
||||
*
|
||||
* Available variables:
|
||||
* - url: An internal system path or a fully qualified external URL of the feed.
|
||||
* - title: Title of the feed for describing the feed on the subscribe link.
|
||||
* - attributes: Remaining HTML attributes for the feed link.
|
||||
* - title: A descriptive title of the feed link.
|
||||
* - class: HTML classes to be applied to the feed link.
|
||||
*/
|
||||
#}
|
||||
|
||||
{{ attach_library('olivero/feed') }}
|
||||
|
||||
<a href="{{ url }}"{{ attributes.addClass('feed-icon') }}>
|
||||
<span class="feed-icon__label">
|
||||
{{ title }}
|
||||
</span>
|
||||
<span class="feed-icon__icon" aria-hidden="true">
|
||||
{% include "@olivero/../images/rss.svg" %}
|
||||
</span>
|
||||
</a>
|
||||
@ -0,0 +1,75 @@
|
||||
{#
|
||||
/**
|
||||
* @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
|
||||
* https://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.
|
||||
* - attributes: HTML attributes for the element, including:
|
||||
* - class: HTML classes.
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/messages') }}
|
||||
|
||||
<div data-drupal-messages class="messages-list">
|
||||
<div class="messages__wrapper layout-container">
|
||||
{% for type, messages in message_list %}
|
||||
{%
|
||||
set classes = [
|
||||
'messages-list__item',
|
||||
'messages',
|
||||
'messages--' ~ type,
|
||||
]
|
||||
%}
|
||||
|
||||
<div{{ attributes
|
||||
.addClass(classes)
|
||||
.setAttribute('data-drupal-selector', 'messages')
|
||||
.setAttribute('role', 'contentinfo')
|
||||
.setAttribute('aria-label', status_headings[type])
|
||||
}}>
|
||||
<div class="messages__container" data-drupal-selector="messages-container"{% if type == 'error' %} role="alert"{% endif %}>
|
||||
{% if status_headings[type] %}
|
||||
<div class="messages__header">
|
||||
<h2 class="visually-hidden">{{ status_headings[type] }}</h2>
|
||||
<div class="messages__icon">
|
||||
{% if type == 'error' %}
|
||||
{% include "@olivero/../images/error.svg" %}
|
||||
{% elseif type == 'warning' %}
|
||||
{% include "@olivero/../images/warning.svg" %}
|
||||
{% elseif type == 'status' %}
|
||||
{% include "@olivero/../images/status.svg" %}
|
||||
{% elseif type == 'info' %}
|
||||
{% include "@olivero/../images/info.svg" %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="messages__content">
|
||||
{% if messages|length > 1 %}
|
||||
<ul class="messages__list">
|
||||
{% for message in messages %}
|
||||
<li class="messages__item">{{ message }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
{{ messages|first }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{# Remove type specific classes. #}
|
||||
{% set attributes = attributes.removeClass(classes) %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,27 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a breadcrumb trail.
|
||||
*
|
||||
* Available variables:
|
||||
* - breadcrumb: Breadcrumb trail items.
|
||||
*/
|
||||
#}
|
||||
{% if breadcrumb %}
|
||||
<nav class="breadcrumb" role="navigation" aria-labelledby="system-breadcrumb">
|
||||
<h2 id="system-breadcrumb" class="visually-hidden">{{ 'Breadcrumb'|t }}</h2>
|
||||
<div class="breadcrumb__content">
|
||||
<ol class="breadcrumb__list">
|
||||
{% for item in breadcrumb %}
|
||||
<li class="breadcrumb__item">
|
||||
{% if item.url %}
|
||||
<a href="{{ item.url }}" class="breadcrumb__link">{{ item.text }}</a>
|
||||
{% else %}
|
||||
{{ item.text }}
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</nav>
|
||||
{% endif %}
|
||||
@ -0,0 +1,60 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override for comment links.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: Attributes for the UL containing the list of links.
|
||||
* - links: Links to be output.
|
||||
* Each link will have the following elements:
|
||||
* - title: The link text.
|
||||
* - href: The link URL. If omitted, the 'title' is shown as a plain text
|
||||
* item in the links list. If 'href' is supplied, the entire link is passed
|
||||
* to l() as its $options parameter.
|
||||
* - attributes: (optional) HTML attributes for the anchor, or for the <span>
|
||||
* tag if no 'href' is supplied.
|
||||
* - heading: (optional) A heading to precede the links.
|
||||
* - text: The heading text.
|
||||
* - level: The heading level (e.g. 'h2', 'h3').
|
||||
* - attributes: (optional) A keyed list of attributes for the heading.
|
||||
* If the heading is a string, it will be used as the text of the heading and
|
||||
* the level will default to 'h2'.
|
||||
*
|
||||
* Headings should be used on navigation menus and any list of links that
|
||||
* consistently appears on multiple pages. To make the heading invisible use
|
||||
* the 'visually-hidden' CSS class. Do not use 'display:none', which
|
||||
* removes it from screen readers and assistive technology. Headings allow
|
||||
* screen reader and keyboard only users to navigate to or skip the links.
|
||||
* See https://juicystudio.com/article/screen-readers-display-none.php and
|
||||
* https://www.w3.org/TR/WCAG-TECHS/H42.html for more information.
|
||||
*
|
||||
* @see \Drupal\Core\Theme\ThemePreprocess::preprocessLinks()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'comment__links',
|
||||
]
|
||||
%}
|
||||
{% if links -%}
|
||||
{%- if heading -%}
|
||||
{%- if heading.level -%}
|
||||
<{{ heading.level }}{{ heading.attributes }}>{{ heading.text }}</{{ heading.level }}>
|
||||
{%- else -%}
|
||||
<h2{{ heading.attributes }}>{{ heading.text }}</h2>
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
<ul{{ attributes.addClass(classes) }}>
|
||||
{% for item in links %}
|
||||
<li{{ item.attributes.addClass('comment__links-item') }}>
|
||||
{%- if item.link -%}
|
||||
{{ item.link }}
|
||||
{%- elseif item.text_attributes -%}
|
||||
<span{{ item.text_attributes }}>{{ item.text }}</span>
|
||||
{%- else -%}
|
||||
{{ item.text }}
|
||||
{%- endif -%}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{%- endif %}
|
||||
55
web/core/themes/olivero/templates/navigation/links.html.twig
Normal file
55
web/core/themes/olivero/templates/navigation/links.html.twig
Normal file
@ -0,0 +1,55 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme override for a set of links.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: Attributes for the UL containing the list of links.
|
||||
* - links: Links to be output.
|
||||
* Each link will have the following elements:
|
||||
* - title: The link text.
|
||||
* - href: The link URL. If omitted, the 'title' is shown as a plain text
|
||||
* item in the links list. If 'href' is supplied, the entire link is passed
|
||||
* to l() as its $options parameter.
|
||||
* - attributes: (optional) HTML attributes for the anchor, or for the <span>
|
||||
* tag if no 'href' is supplied.
|
||||
* - heading: (optional) A heading to precede the links.
|
||||
* - text: The heading text.
|
||||
* - level: The heading level (e.g. 'h2', 'h3').
|
||||
* - attributes: (optional) A keyed list of attributes for the heading.
|
||||
* If the heading is a string, it will be used as the text of the heading and
|
||||
* the level will default to 'h2'.
|
||||
*
|
||||
* Headings should be used on navigation menus and any list of links that
|
||||
* consistently appears on multiple pages. To make the heading invisible use
|
||||
* the 'visually-hidden' CSS class. Do not use 'display:none', which
|
||||
* removes it from screen readers and assistive technology. Headings allow
|
||||
* screen reader and keyboard only users to navigate to or skip the links.
|
||||
* See https://juicystudio.com/article/screen-readers-display-none.php and
|
||||
* https://www.w3.org/TR/WCAG-TECHS/H42.html for more information.
|
||||
*
|
||||
* @see \Drupal\Core\Theme\ThemePreprocess::preprocessLinks()
|
||||
*/
|
||||
#}
|
||||
{% if links -%}
|
||||
{%- if heading -%}
|
||||
{%- if heading.level -%}
|
||||
<{{ heading.level }}{{ heading.attributes }}>{{ heading.text }}</{{ heading.level }}>
|
||||
{%- else -%}
|
||||
<h2{{ heading.attributes }}>{{ heading.text }}</h2>
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
<ul{{ attributes }}>
|
||||
{% for item in links %}
|
||||
<li{{ item.attributes }}>
|
||||
{%- if item.link -%}
|
||||
{{ item.link }}
|
||||
{%- elseif item.text_attributes -%}
|
||||
<span{{ item.text_attributes }}>{{ item.text }}</span>
|
||||
{%- else -%}
|
||||
{{ item.text }}
|
||||
{%- endif -%}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{%- endif %}
|
||||
@ -0,0 +1,139 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for the menus in the primary_menu region.
|
||||
*
|
||||
* 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.
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/navigation-primary') }}
|
||||
|
||||
{% import _self as menus %}
|
||||
|
||||
{#
|
||||
We call a macro which calls itself to render the full tree.
|
||||
@see https://twig.symfony.com/doc/3.x/tags/macro.html
|
||||
#}
|
||||
{% set attributes = attributes.addClass('menu') %}
|
||||
{{ menus.menu_links(items, attributes, 0, 'primary-menu-item-') }}
|
||||
|
||||
{% macro menu_links(items, attributes, menu_level, aria_id) %}
|
||||
{% set primary_nav_level = 'primary-nav__menu--level-' ~ (menu_level + 1) %}
|
||||
{% set drupal_selector_primary_nav_level = menu_level <= 1 ? 'primary-nav-menu--level-' ~ (menu_level + 1) : false %}
|
||||
{% set is_top_level_menu = menu_level == 0 %}
|
||||
{% import _self as menus %}
|
||||
{% if items %}
|
||||
|
||||
{#
|
||||
Place the menu arrow (caret) outside of the submenu because the submenu
|
||||
has the overflow:hidden CSS rule applied.
|
||||
#}
|
||||
{% if menu_level == 1 %}
|
||||
<span data-drupal-selector="primary-nav-menu-🥕" class="primary-nav__menu-🥕"></span>
|
||||
{% endif %}
|
||||
|
||||
<ul {{ attributes.addClass('primary-nav__menu', primary_nav_level).setAttribute('data-drupal-selector', drupal_selector_primary_nav_level) }}>
|
||||
{% set attributes = attributes.removeClass(primary_nav_level) %}
|
||||
{% for item in items %}
|
||||
|
||||
{% if item.url.isRouted and item.url.routeName == '<nolink>' %}
|
||||
{% set menu_item_type = 'nolink' %}
|
||||
{% elseif item.url.isRouted and item.url.routeName == '<button>' %}
|
||||
{% set menu_item_type = 'button' %}
|
||||
{% else %}
|
||||
{% set menu_item_type = 'link' %}
|
||||
{% endif %}
|
||||
|
||||
{% set item_classes = [
|
||||
'primary-nav__menu-item',
|
||||
'primary-nav__menu-item--' ~ menu_item_type,
|
||||
'primary-nav__menu-item--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'primary-nav__menu-item--active-trail',
|
||||
item.below ? 'primary-nav__menu-item--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
{% set link_classes = [
|
||||
'primary-nav__menu-link',
|
||||
'primary-nav__menu-link--' ~ menu_item_type,
|
||||
'primary-nav__menu-link--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'primary-nav__menu-link--active-trail',
|
||||
item.below ? 'primary-nav__menu-link--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
<li{{ item.attributes.addClass(item_classes).setAttribute('data-drupal-selector', is_top_level_menu and item.below ? 'primary-nav-menu-item-has-children' : false) }}>
|
||||
{#
|
||||
A unique HTML ID should be used, but that isn't available through
|
||||
Twig yet, so the |clean_id filter is used for now.
|
||||
@see https://www.drupal.org/project/drupal/issues/3115445
|
||||
#}
|
||||
{% set aria_id = (aria_id ~ loop.index)|clean_id %}
|
||||
{% set link_title %}
|
||||
<span class="primary-nav__menu-link-inner primary-nav__menu-link-inner--level-{{ menu_level + 1 }}">{{ item.title }}</span>
|
||||
{% endset %}
|
||||
|
||||
{% if menu_item_type == 'link' or menu_item_type == 'nolink' %}
|
||||
{{ link(menu_item_type == 'link' ? link_title : item.title, item.url, {
|
||||
'class': link_classes,
|
||||
'data-drupal-selector': is_top_level_menu ? 'primary-nav-menu-link-has-children' : false,
|
||||
})
|
||||
}}
|
||||
|
||||
{% if item.below %}
|
||||
{#
|
||||
Aria-hidden and tabindex attributes are removed via JS. Button is non-functional,
|
||||
but still visible in non-JS environments so that chevron can indicate presence of
|
||||
drop menu).
|
||||
#}
|
||||
{% if is_top_level_menu %}
|
||||
{% set toggle_button_attributes = create_attribute({
|
||||
'class': 'primary-nav__button-toggle',
|
||||
'data-drupal-selector': 'primary-nav-submenu-toggle-button',
|
||||
'aria-controls': aria_id,
|
||||
'aria-expanded': 'false',
|
||||
'aria-hidden': 'true',
|
||||
'tabindex': '-1',
|
||||
}) %}
|
||||
|
||||
<button{{ toggle_button_attributes }}>
|
||||
<span class="visually-hidden">{{ '@title sub-navigation'|t({'@title': item.title}) }}</span>
|
||||
<span class="icon--menu-toggle"></span>
|
||||
</button>
|
||||
{% endif %}
|
||||
|
||||
{% set attributes = attributes.setAttribute('id', aria_id) %}
|
||||
{{ menus.menu_links(item.below, attributes, menu_level + 1, aria_id) }}
|
||||
{% endif %}
|
||||
|
||||
{% elseif menu_item_type == 'button' %}
|
||||
|
||||
{{ link(link_title, item.url, {
|
||||
'class': link_classes,
|
||||
'aria-controls': is_top_level_menu and item.below ? aria_id : false,
|
||||
'aria-expanded': is_top_level_menu and item.below ? 'false' : false,
|
||||
'data-drupal-selector': is_top_level_menu and item.below ? 'primary-nav-submenu-toggle-button' : false,
|
||||
}) }}
|
||||
|
||||
{% set attributes = attributes.setAttribute('id', aria_id) %}
|
||||
{{ menus.menu_links(item.below, attributes, menu_level + 1, aria_id) }}
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
@ -0,0 +1,78 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for the menus in the secondary_menu region.
|
||||
*
|
||||
* 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.
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/navigation-secondary') }}
|
||||
|
||||
{% import _self as menus %}
|
||||
|
||||
{#
|
||||
We call a macro which calls itself to render the full tree.
|
||||
@see https://twig.symfony.com/doc/3.x/tags/macro.html
|
||||
#}
|
||||
{% set attributes = attributes.addClass('menu') %}
|
||||
{{ menus.menu_links(items, attributes, 0) }}
|
||||
|
||||
{% macro menu_links(items, attributes, menu_level) %}
|
||||
{% set secondary_nav_level = 'secondary-nav__menu--level-' ~ (menu_level + 1) %}
|
||||
{% import _self as menus %}
|
||||
{% if items %}
|
||||
<ul{{ attributes.addClass('secondary-nav__menu', secondary_nav_level) }}>
|
||||
{% set attributes = attributes.removeClass(secondary_nav_level) %}
|
||||
{% for item in items %}
|
||||
|
||||
{% if item.url.isRouted and item.url.routeName == '<nolink>' %}
|
||||
{% set menu_item_type = 'nolink' %}
|
||||
{% elseif item.url.isRouted and item.url.routeName == '<button>' %}
|
||||
{% set menu_item_type = 'button' %}
|
||||
{% else %}
|
||||
{% set menu_item_type = 'link' %}
|
||||
{% endif %}
|
||||
|
||||
{% set item_classes = [
|
||||
'secondary-nav__menu-item',
|
||||
'secondary-nav__menu-item--' ~ menu_item_type,
|
||||
'secondary-nav__menu-item--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'secondary-nav__menu-item--active-trail',
|
||||
item.below ? 'secondary-nav__menu-item--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
{% set link_classes = [
|
||||
'secondary-nav__menu-link',
|
||||
'secondary-nav__menu-link--' ~ menu_item_type,
|
||||
'secondary-nav__menu-link--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'secondary-nav__menu-link--active-trail',
|
||||
item.below ? 'secondary-nav__menu-link--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
<li{{ item.attributes.addClass(item_classes) }}>
|
||||
{{ link(item.title, item.url, {'class': link_classes}) }}
|
||||
|
||||
{% if item.below %}
|
||||
{{ menus.menu_links(item.below, attributes, menu_level + 1) }}
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
@ -0,0 +1,29 @@
|
||||
{#
|
||||
/**
|
||||
* @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.
|
||||
* - level: The menu level where the tab is rendered.
|
||||
*
|
||||
* 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('tabs__tab', is_active ? 'is-active') }}>
|
||||
{{ link }}
|
||||
{% if is_active and level == 'primary' %}
|
||||
<button class="tabs__trigger" aria-label="{{ 'Tabs display toggle'|t }}" aria-expanded="false">
|
||||
<span class="tabs__trigger-icon">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
</li>
|
||||
@ -0,0 +1,30 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero theme implementation to display primary and secondary local tasks.
|
||||
*
|
||||
* Available variables:
|
||||
* - primary: HTML list items representing primary tasks.
|
||||
* - secondary: HTML list items representing secondary tasks.
|
||||
*
|
||||
* Each item in these variables (primary and secondary) can be individually
|
||||
* themed in menu-local-task.html.twig.
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{{ attach_library('olivero/tabs') }}
|
||||
|
||||
{% if primary %}
|
||||
<h2 id="primary-tabs-title" class="visually-hidden">{{ 'Primary tabs'|t }}</h2>
|
||||
<nav role="navigation" class="tabs-wrapper" aria-labelledby="primary-tabs-title" data-drupal-nav-primary-tabs>
|
||||
<ul class="tabs tabs--primary">{{ primary }}</ul>
|
||||
</nav>
|
||||
{% endif %}
|
||||
{% if secondary %}
|
||||
<h2 id="secondary-tabs-title" class="visually-hidden">{{ 'Secondary tabs'|t }}</h2>
|
||||
<nav role="navigation" class="tabs-wrapper" aria-labelledby="secondary-tabs-title">
|
||||
<ul class="tabs tabs--secondary">{{ secondary }}</ul>
|
||||
</nav>
|
||||
{% endif %}
|
||||
84
web/core/themes/olivero/templates/navigation/menu.html.twig
Normal file
84
web/core/themes/olivero/templates/navigation/menu.html.twig
Normal file
@ -0,0 +1,84 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Olivero's theme implementation for the main 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.
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{% import _self as menus %}
|
||||
|
||||
{#
|
||||
We call a macro which calls itself to render the full tree.
|
||||
@see https://twig.symfony.com/doc/3.x/tags/macro.html
|
||||
#}
|
||||
{% set attributes = attributes.addClass('menu') %}
|
||||
{{ menus.menu_links(items, attributes, 0) }}
|
||||
|
||||
{% macro menu_links(items, attributes, menu_level) %}
|
||||
{% set primary_nav_level = 'menu--level-' ~ (menu_level + 1) %}
|
||||
{% import _self as menus %}
|
||||
{% if items %}
|
||||
<ul {{ attributes.addClass('menu', primary_nav_level) }}>
|
||||
{% set attributes = attributes.removeClass(primary_nav_level) %}
|
||||
{% for item in items %}
|
||||
|
||||
{% if item.url.isRouted and item.url.routeName == '<nolink>' %}
|
||||
{% set menu_item_type = 'nolink' %}
|
||||
{% elseif item.url.isRouted and item.url.routeName == '<button>' %}
|
||||
{% set menu_item_type = 'button' %}
|
||||
{% else %}
|
||||
{% set menu_item_type = 'link' %}
|
||||
{% endif %}
|
||||
|
||||
{% set item_classes = [
|
||||
'menu__item',
|
||||
'menu__item--' ~ menu_item_type,
|
||||
'menu__item--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'menu__item--active-trail',
|
||||
item.below ? 'menu__item--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
{% set link_classes = [
|
||||
'menu__link',
|
||||
'menu__link--' ~ menu_item_type,
|
||||
'menu__link--level-' ~ (menu_level + 1),
|
||||
item.in_active_trail ? 'menu__link--active-trail',
|
||||
item.below ? 'menu__link--has-children',
|
||||
]
|
||||
%}
|
||||
|
||||
<li{{ item.attributes.addClass(item_classes) }}>
|
||||
{#
|
||||
A unique HTML ID should be used, but that isn't available through
|
||||
Twig yet, so the |clean_id filter is used for now.
|
||||
@see https://www.drupal.org/project/drupal/issues/3115445
|
||||
#}
|
||||
{% set aria_id = (item.title ~ '-submenu-' ~ loop.index)|clean_id %}
|
||||
|
||||
{{ link(item.title, item.url, {'class': link_classes}) }}
|
||||
|
||||
{% if item.below %}
|
||||
{{ menus.menu_links(item.below, attributes, menu_level + 1) }}
|
||||
{% endif %}
|
||||
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
110
web/core/themes/olivero/templates/navigation/pager.html.twig
Normal file
110
web/core/themes/olivero/templates/navigation/pager.html.twig
Normal file
@ -0,0 +1,110 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override to display a pager.
|
||||
*
|
||||
* Available variables:
|
||||
* - heading_id: Pagination heading ID.
|
||||
* - pagination_heading_level: The heading level to use for the pager.
|
||||
* - items: List of pager items.
|
||||
* The list is keyed by the following elements:
|
||||
* - first: Item for the first page; not present on the first page of results.
|
||||
* - previous: Item for the previous page; not present on the first page
|
||||
* of results.
|
||||
* - next: Item for the next page; not present on the last page of results.
|
||||
* - last: Item for the last page; not present on the last page of results.
|
||||
* - pages: List of pages, keyed by page number.
|
||||
* Sub-sub elements:
|
||||
* items.first, items.previous, items.next, items.last, and each item inside
|
||||
* items.pages contain the following elements:
|
||||
* - href: URL with appropriate query parameters for the item.
|
||||
* - attributes: A keyed list of HTML attributes for the item.
|
||||
* - text: The visible text used for the item link, such as "‹ Previous"
|
||||
* or "Next ›".
|
||||
* - current: The page number of the current page.
|
||||
* - ellipses: If there are more pages than the quantity allows, then an
|
||||
* ellipsis before or after the listed pages may be present.
|
||||
* - previous: Present if the currently visible list of pages does not start
|
||||
* at the first page.
|
||||
* - next: Present if the visible list of pages ends before the last page.
|
||||
*
|
||||
* @see template_preprocess_pager()
|
||||
*/
|
||||
#}
|
||||
{% if items %}
|
||||
<nav class="pager" role="navigation" aria-labelledby="{{ heading_id }}">
|
||||
<{{ pagination_heading_level }} id="{{ heading_id }}" class="visually-hidden">{{ 'Pagination'|t }}</{{ pagination_heading_level }}>
|
||||
<ul class="pager__items js-pager__items">
|
||||
{# Print first item if we are not on the first page. #}
|
||||
{% if items.first %}
|
||||
<li class="pager__item pager__item--control pager__item--first">
|
||||
<a href="{{ items.first.href }}" title="{{ 'Go to first page'|t }}"{{ items.first.attributes|without('href', 'title').addClass('pager__link') }}>
|
||||
<span class="visually-hidden">{{ 'First page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-first.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{# Print previous item if we are not on the first page. #}
|
||||
{% if items.previous %}
|
||||
<li class="pager__item pager__item--control pager__item--previous">
|
||||
<a href="{{ items.previous.href }}" title="{{ 'Go to previous page'|t }}" rel="prev"{{ items.previous.attributes|without('href', 'title', 'rel').addClass('pager__link') }}>
|
||||
<span class="visually-hidden">{{ 'Previous page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-previous.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{# Add an ellipsis if there are further previous pages. #}
|
||||
{% if ellipses.previous %}
|
||||
<li class="pager__item pager__item--ellipsis" role="presentation">…</li>
|
||||
{% endif %}
|
||||
|
||||
{# Now generate the actual pager piece. #}
|
||||
{% for key, item in items.pages %}
|
||||
<li class="pager__item{{ current == key ? ' pager__item--active' : '' }} pager__item--number">
|
||||
{% if current == key %}
|
||||
{% set title = 'Current page'|t %}
|
||||
{% else %}
|
||||
{% set title = 'Go to page @key'|t({'@key': key}) %}
|
||||
{% endif %}
|
||||
{% if current != key %}
|
||||
<a href="{{ item.href }}" title="{{ title }}"{{ item.attributes|without('href', 'title').addClass('pager__link', current == key ? ' is-active') }}>
|
||||
{% endif %}
|
||||
<span class="visually-hidden">
|
||||
{{ 'Page'|t }}
|
||||
</span>
|
||||
{{ key }}
|
||||
{% if current != key %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
{# Add an ellipsis if there are further next pages. #}
|
||||
{% if ellipses.next %}
|
||||
<li class="pager__item pager__item--ellipsis" role="presentation">…</li>
|
||||
{% endif %}
|
||||
|
||||
{# Print next item if we are not on the last page. #}
|
||||
{% if items.next %}
|
||||
<li class="pager__item pager__item--control pager__item--next">
|
||||
<a href="{{ items.next.href }}" title="{{ 'Go to next page'|t }}" rel="next"{{ items.next.attributes|without('href', 'title', 'rel').addClass('pager__link') }}>
|
||||
<span class="visually-hidden">{{ 'Next page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-previous.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{# Print last item if we are not on the last page. #}
|
||||
{% if items.last %}
|
||||
<li class="pager__item pager__item--control pager__item--last">
|
||||
<a href="{{ items.last.href }}" title="{{ 'Go to last page'|t }}"{{ items.last.attributes|without('href', 'title').addClass('pager__link') }}>
|
||||
<span class="visually-hidden">{{ 'Last page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-first.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</nav>
|
||||
{% endif %}
|
||||
@ -0,0 +1,44 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a text format-enabled form element.
|
||||
*
|
||||
* @todo Remove when https://www.drupal.org/node/3016346 and
|
||||
* https://www.drupal.org/node/3016343 are fixed.
|
||||
*
|
||||
* Available variables:
|
||||
* - children: Text format element children.
|
||||
* - description: Text format element description.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* - aria_description: Flag for whether or not an ARIA description has been
|
||||
* added to the description container.
|
||||
* - description_attributes: attributes for the description.
|
||||
* @see https://www.drupal.org/node/3016343
|
||||
* - disabled: An indicator for whether the associated form element is disabled,
|
||||
* added by this theme.
|
||||
* @see https://www.drupal.org/node/3016346
|
||||
*
|
||||
* @see template_preprocess_text_format_wrapper()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'js-form-item',
|
||||
'form-item',
|
||||
]
|
||||
%}
|
||||
|
||||
{{ attach_library('olivero/filter.theme') }}
|
||||
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ children }}
|
||||
{% if description %}
|
||||
{%
|
||||
set description_classes = [
|
||||
aria_description ? 'form-item__description',
|
||||
disabled ? 'is-disabled',
|
||||
]
|
||||
%}
|
||||
<div{{ description_attributes.addClass(description_classes) }}>{{ description }}</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -0,0 +1,25 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override to present all user data.
|
||||
*
|
||||
* This template is used when viewing a registered user's page,
|
||||
* e.g., example.com/user/123. 123 being the user's ID.
|
||||
*
|
||||
* Available variables:
|
||||
* - content: A list of content items. Use 'content' to print all content, or
|
||||
* print a subset such as 'content.field_example'. Fields attached to a user
|
||||
* such as 'user_picture' are available as 'content.user_picture'.
|
||||
* - attributes: HTML attributes for the container element.
|
||||
* - user: A Drupal User entity.
|
||||
*
|
||||
* @see template_preprocess_user()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
<div{{ attributes }}>
|
||||
{% if content %}
|
||||
{{- content -}}
|
||||
{% endif %}
|
||||
</div>
|
||||
31
web/core/themes/olivero/templates/user/username.html.twig
Normal file
31
web/core/themes/olivero/templates/user/username.html.twig
Normal file
@ -0,0 +1,31 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for displaying a username.
|
||||
*
|
||||
* Available variables:
|
||||
* - account: The full account information for the user.
|
||||
* - uid: The user ID, or zero if not a user. As used in anonymous comments.
|
||||
* - name: The user's name, sanitized, and optionally truncated.
|
||||
* - name_raw: The user's name, un-truncated.
|
||||
* - truncated: Whether the user's name was truncated.
|
||||
* - extra: Additional text to append to the user's name, sanitized.
|
||||
* - profile_access: Whether the current user has permission to access this
|
||||
users profile page.
|
||||
* - link_path: The path or URL of the user's profile page, home page,
|
||||
* or other desired page to link to for more information about the user.
|
||||
* - homepage: (optional) The home page of the account, only set for non users.
|
||||
* - link_options: Options to set on the \Drupal\Core\Url object if linking the
|
||||
* user's name to the user's page.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
*
|
||||
* @see template_preprocess_username()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{%- if link_path -%}
|
||||
<a{{ attributes }}>{{ name }}{{ extra }}</a>
|
||||
{%- else -%}
|
||||
<span{{ attributes }}>{{ name }}{{ extra }}</span>
|
||||
{%- endif -%}
|
||||
@ -0,0 +1,46 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a views mini-pager.
|
||||
*
|
||||
* Available variables:
|
||||
* - heading_id: Pagination heading ID.
|
||||
* - pagination_heading_level: The heading level to use for the pager.
|
||||
* - items: List of pager items.
|
||||
*
|
||||
* @see template_preprocess_views_mini_pager()
|
||||
*/
|
||||
#}
|
||||
{% if items.previous or items.next %}
|
||||
<nav class="pager" role="navigation" aria-labelledby="{{ heading_id }}">
|
||||
<{{ pagination_heading_level }} id="{{ heading_id }}" class="visually-hidden">{{ 'Pagination'|t }}</{{ pagination_heading_level }}>
|
||||
<ul class="pager__items js-pager__items">
|
||||
{# Print previous item if we are not on the first page. #}
|
||||
{% if items.previous %}
|
||||
<li class="pager__item pager__item--control pager__item--previous">
|
||||
<a href="{{ items.previous.href }}" class="pager__link" title="{{ 'Go to previous page'|t }}" rel="prev"{{ items.previous.attributes|without('href', 'title', 'rel', 'class') }}>
|
||||
<span class="visually-hidden">{{ 'Previous page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-previous.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{# Print current active page. #}
|
||||
{% if items.current %}
|
||||
<li class="pager__item pager__item--active">
|
||||
{{ items.current }}
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{# Print next item if we are not on the last page. #}
|
||||
{% if items.next %}
|
||||
<li class="pager__item pager__item--control pager__item--next">
|
||||
<a href="{{ items.next.href }}" class="pager__link" title="{{ 'Go to next page'|t }}" rel="next"{{ items.next.attributes|without('href', 'title', 'rel') }}>
|
||||
<span class="visually-hidden">{{ 'Next page'|t }}</span>
|
||||
{%- include "@olivero/../images/pager-previous.svg" -%}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</nav>
|
||||
{% endif %}
|
||||
@ -0,0 +1,94 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for the frontpage view template.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: Remaining HTML attributes for the element.
|
||||
* - css_name: A CSS-safe version of the view name.
|
||||
* - css_class: The user-specified classes names, if any.
|
||||
* - header: The optional header.
|
||||
* - footer: The optional footer.
|
||||
* - rows: The results of the view query, if any.
|
||||
* - empty: The content to display if there are no rows.
|
||||
* - pager: The optional pager next/prev links to display.
|
||||
* - exposed: Exposed widget form/info to display.
|
||||
* - feed_icons: Optional feed icons to display.
|
||||
* - more: An optional link to the next page of results.
|
||||
* - title: Title of the view, only used when displaying in the admin preview.
|
||||
* - title_prefix: Additional output populated by modules, intended to be
|
||||
* displayed in front of the view title.
|
||||
* - title_suffix: Additional output populated by modules, intended to be
|
||||
* displayed after the view title.
|
||||
* - attachment_before: An optional attachment view to be displayed before the
|
||||
* view content.
|
||||
* - attachment_after: An optional attachment view to be displayed after the
|
||||
* view content.
|
||||
* - dom_id: Unique id for every view being printed to give unique class for
|
||||
* Javascript.
|
||||
*
|
||||
* @see template_preprocess_views_view()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{%
|
||||
set classes = [
|
||||
'view',
|
||||
'view-' ~ id|clean_class,
|
||||
'view-id-' ~ id,
|
||||
'view-display-id-' ~ display_id,
|
||||
'grid-full',
|
||||
'layout--pass--content-narrow',
|
||||
dom_id ? 'js-view-dom-id-' ~ dom_id,
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if title %}
|
||||
{{ title }}
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% if header %}
|
||||
<div class="view-header">
|
||||
{{ header }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if exposed %}
|
||||
<div class="view-filters">
|
||||
{{ exposed }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if attachment_before %}
|
||||
<div class="attachment attachment-before">
|
||||
{{ attachment_before }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if rows %}
|
||||
<div class="view-content">
|
||||
{{ rows }}
|
||||
</div>
|
||||
{% elseif empty %}
|
||||
{% include '@olivero/includes/get-started.html.twig' %}
|
||||
{% endif %}
|
||||
|
||||
{% if pager %}
|
||||
{{ pager }}
|
||||
{% endif %}
|
||||
{% if attachment_after %}
|
||||
<div class="attachment attachment-after">
|
||||
{{ attachment_after }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if more %}
|
||||
{{ more }}
|
||||
{% endif %}
|
||||
{% if footer %}
|
||||
<div class="view-footer">
|
||||
{{ footer }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
@ -0,0 +1,49 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for views to display rows in a grid.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: HTML attributes for the wrapping element.
|
||||
* - title: The title of this group of rows.
|
||||
* - view: The view object.
|
||||
* - rows: The rendered view results.
|
||||
* - options: The view plugin style options.
|
||||
* - row_class_default: A flag indicating whether default classes should be
|
||||
* used on rows.
|
||||
* - col_class_default: A flag indicating whether default classes should be
|
||||
* used on columns.
|
||||
* - items: A list of grid items. Each item contains a list of rows or columns.
|
||||
* The order in what comes first (row or column) depends on which alignment
|
||||
* type is chosen (horizontal or vertical).
|
||||
* - attributes: HTML attributes for each row or column.
|
||||
* - content: A list of columns or rows. Each row or column contains:
|
||||
* - attributes: HTML attributes for each row or column.
|
||||
* - content: The row or column contents.
|
||||
*
|
||||
* @see template_preprocess_views_view_grid()
|
||||
*/
|
||||
#}
|
||||
{{ attach_library('olivero/layout-views-grid') }}
|
||||
|
||||
{%
|
||||
set classes = [
|
||||
'views-view-grid',
|
||||
'views-view-grid--' ~ options.alignment,
|
||||
]
|
||||
%}
|
||||
|
||||
{% if title %}
|
||||
<h3>{{ title }}</h3>
|
||||
{% endif %}
|
||||
<div{{ attributes.addClass(classes).setAttribute('style', '--views-grid--column-count: ' ~ options.columns) }}>
|
||||
{% for row in items %}
|
||||
{% for item in row.content %}
|
||||
<div class="views-view-grid__item">
|
||||
<div class="views-view-grid__item-inner">
|
||||
{{- item.content -}}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -0,0 +1,121 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for implementation of displaying a view as a table.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: Remaining HTML attributes for the element.
|
||||
* - class: HTML classes that can be used to style contextually through CSS.
|
||||
* - title : The title of this group of rows.
|
||||
* - header: The table header columns.
|
||||
* - attributes: Remaining HTML attributes for the element.
|
||||
* - content: HTML classes to apply to each header cell, indexed by
|
||||
* the header's key.
|
||||
* - default_classes: A flag indicating whether default classes should be
|
||||
* used.
|
||||
* - caption_needed: Is the caption tag needed.
|
||||
* - caption: The caption for this table.
|
||||
* - accessibility_description: Extended description for the table details.
|
||||
* - accessibility_summary: Summary for the table details.
|
||||
* - rows: Table row items. Rows are keyed by row number.
|
||||
* - attributes: HTML classes to apply to each row.
|
||||
* - columns: Row column items. Columns are keyed by column number.
|
||||
* - attributes: HTML classes to apply to each column.
|
||||
* - content: The column content.
|
||||
* - default_classes: A flag indicating whether default classes should be
|
||||
* used.
|
||||
* - responsive: A flag indicating whether table is responsive.
|
||||
* - sticky: A flag indicating whether table header is sticky.
|
||||
* - summary_element: A render array with table summary information (if any).
|
||||
*
|
||||
* @see template_preprocess_views_view_table()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'views-table',
|
||||
'cols-' ~ header|length,
|
||||
responsive ? 'responsive-enabled',
|
||||
sticky ? 'sticky-header',
|
||||
]
|
||||
%}
|
||||
<table{{ attributes.addClass(classes) }}>
|
||||
{% if caption_needed %}
|
||||
<caption>
|
||||
{% if caption %}
|
||||
{{ caption }}
|
||||
{% else %}
|
||||
{{ title }}
|
||||
{% endif %}
|
||||
{% if (summary_element is not empty) %}
|
||||
{{ summary_element }}
|
||||
{% endif %}
|
||||
</caption>
|
||||
{% endif %}
|
||||
{% if header %}
|
||||
<thead>
|
||||
<tr>
|
||||
{% for key, column in header %}
|
||||
{% if column.default_classes %}
|
||||
{%
|
||||
set column_classes = [
|
||||
'views-field',
|
||||
'views-field-' ~ fields[key],
|
||||
]
|
||||
%}
|
||||
{% endif %}
|
||||
<th{{ column.attributes.addClass(column_classes).setAttribute('scope', 'col') }}>
|
||||
{%- if column.wrapper_element -%}
|
||||
<{{ column.wrapper_element }}>
|
||||
{%- if column.url -%}
|
||||
<a href="{{ column.url }}" title="{{ column.title }}" rel="nofollow">{{ column.content }}{{ column.sort_indicator }}</a>
|
||||
{%- else -%}
|
||||
{{ column.content }}{{ column.sort_indicator }}
|
||||
{%- endif -%}
|
||||
</{{ column.wrapper_element }}>
|
||||
{%- else -%}
|
||||
{%- if column.url -%}
|
||||
<a href="{{ column.url }}" title="{{ column.title }}" rel="nofollow">{{ column.content }}{{ column.sort_indicator }}</a>
|
||||
{%- else -%}
|
||||
{{- column.content }}{{ column.sort_indicator }}
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
</th>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
</thead>
|
||||
{% endif %}
|
||||
<tbody>
|
||||
{% for row in rows %}
|
||||
<tr{{ row.attributes }}>
|
||||
{% for key, column in row.columns %}
|
||||
{% if column.default_classes %}
|
||||
{%
|
||||
set column_classes = [
|
||||
'views-field'
|
||||
]
|
||||
%}
|
||||
{% for field in column.fields %}
|
||||
{% set column_classes = column_classes|merge(['views-field-' ~ field]) %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
<td{{ column.attributes.addClass(column_classes) }}>
|
||||
{%- if column.wrapper_element -%}
|
||||
<{{ column.wrapper_element }}>
|
||||
{% for content in column.content %}
|
||||
{{ content.separator }}{{ content.field_output }}
|
||||
{% endfor %}
|
||||
</{{ column.wrapper_element }}>
|
||||
{%- else -%}
|
||||
{% for content in column.content %}
|
||||
{{- content.separator }}{{ content.field_output -}}
|
||||
{% endfor %}
|
||||
{%- endif %}
|
||||
</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
95
web/core/themes/olivero/templates/views/views-view.html.twig
Normal file
95
web/core/themes/olivero/templates/views/views-view.html.twig
Normal file
@ -0,0 +1,95 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Theme override for a main view template.
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: Remaining HTML attributes for the element.
|
||||
* - css_name: A CSS-safe version of the view name.
|
||||
* - css_class: The user-specified classes names, if any.
|
||||
* - header: The optional header.
|
||||
* - footer: The optional footer.
|
||||
* - rows: The results of the view query, if any.
|
||||
* - empty: The content to display if there are no rows.
|
||||
* - pager: The optional pager next/prev links to display.
|
||||
* - exposed: Exposed widget form/info to display.
|
||||
* - feed_icons: Optional feed icons to display.
|
||||
* - more: An optional link to the next page of results.
|
||||
* - title: Title of the view, only used when displaying in the admin preview.
|
||||
* - title_prefix: Additional output populated by modules, intended to be
|
||||
* displayed in front of the view title.
|
||||
* - title_suffix: Additional output populated by modules, intended to be
|
||||
* displayed after the view title.
|
||||
* - attachment_before: An optional attachment view to be displayed before the
|
||||
* view content.
|
||||
* - attachment_after: An optional attachment view to be displayed after the
|
||||
* view content.
|
||||
* - dom_id: Unique id for every view being printed to give unique class for
|
||||
* Javascript.
|
||||
*
|
||||
* @see template_preprocess_views_view()
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set classes = [
|
||||
'view',
|
||||
'view-' ~ id|clean_class,
|
||||
'view-id-' ~ id,
|
||||
'view-display-id-' ~ display_id,
|
||||
dom_id ? 'js-view-dom-id-' ~ dom_id,
|
||||
]
|
||||
%}
|
||||
<div{{ attributes.addClass(classes) }}>
|
||||
{{ title_prefix }}
|
||||
{% if title %}
|
||||
{{ title }}
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{% if header %}
|
||||
<div class="view-header">
|
||||
{{ header }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if exposed %}
|
||||
<div class="view-filters">
|
||||
{{ exposed }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if attachment_before %}
|
||||
<div class="attachment attachment-before">
|
||||
{{ attachment_before }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if rows %}
|
||||
<div class="view-content">
|
||||
{{ rows }}
|
||||
</div>
|
||||
{% elseif empty %}
|
||||
<div class="view-empty">
|
||||
{{ empty }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if pager %}
|
||||
{{ pager }}
|
||||
{% endif %}
|
||||
{% if attachment_after %}
|
||||
<div class="attachment attachment-after">
|
||||
{{ attachment_after }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if more %}
|
||||
{{ more }}
|
||||
{% endif %}
|
||||
{% if footer %}
|
||||
<div class="view-footer">
|
||||
{{ footer }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if feed_icons %}
|
||||
<div class="feed-icons">
|
||||
{{ feed_icons }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
Reference in New Issue
Block a user