page.html.twig 8.61 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
{#
/**
 * @file
 * Bartik'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.
 * - logo: The url of the logo image, as defined in theme settings.
 * - site_name: The name of the site. This is empty when displaying the site
 *   name has been disabled in the theme settings.
 * - site_slogan: The slogan of the site. This is empty when displaying the site
 *   slogan has been disabled in theme settings.
 * - hide_site_name: A flag indicating if the site name has been toggled off on
29
 *   the theme settings page. If hidden, the "visually-hidden" class is added
30 31
 *   to make the site name visually hidden, but still accessible.
 * - hide_site_slogan: A flag indicating if the site slogan has been toggled off
32
 *   on the theme settings page. If hidden, the "visually-hidden" class is
33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81
 *   added to make the site slogan visually hidden, but still accessible.
 *
 * Navigation:
 * - main_menu: The Main menu links for the site, if they have been configured.
 * - secondary_menu: The Secondary menu links for the site, if they have been
 *   configured.
 * - breadcrumb: The breadcrumb trail for the current page.
 *
 * Page content (in order of occurrence in the default page.html.twig):
 * - 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.
 * - messages: Status and error messages. Should be displayed prominently.
 * - tabs: Tabs linking to any sub-pages beneath the current page (e.g., the
 *   view and edit tabs when displaying a node).
 * - action_links: Actions local to the page, such as "Add menu" on the menu
 *   administration interface.
 * - feed_icons: All feed icons for the current page.
 * - 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.featured: Items for the featured region.
 * - page.highlighted: Items for the highlighted content region.
 * - page.help: Dynamic help text, mostly for admin pages.
 * - page.content: The main content of the current page.
 * - page.sidebar_first: Items for the first sidebar.
 * - page.sidebar_second: Items for the second sidebar.
 * - page.triptych_first: Items for the first triptych.
 * - page.triptych_middle: Items for the middle triptych.
 * - page.triptych_last: Items for the last triptych.
 * - page.footer_firstcolumn: Items for the first footer column.
 * - page.footer_secondcolumn: Items for the second footer column.
 * - page.footer_thirdcolumn: Items for the third footer column.
 * - page.footer_fourthcolumn: Items for the fourth footer column.
 * - page.footer: Items for the footer region.
 *
 * @see template_preprocess_page()
 * @see bartik_preprocess_page()
 * @see html.html.twig
 */
#}
<div id="page-wrapper"><div id="page">

82
  <header id="header" class="{{ secondary_menu ? 'with-secondary-menu' : 'without-secondary-menu' }}" role="banner" aria-label="{{ 'Site header'|t}}"><div class="section clearfix">
83
   {% if secondary_menu %}
84
      <nav id="secondary-menu" class="navigation" role="navigation"  aria-labelledby="links__system_secondary_menu">
85 86 87 88 89 90 91 92 93 94 95
        {{ secondary_menu }}
      </nav> <!-- /#secondary-menu -->
    {% endif %}

    {% if logo %}
      <a href="{{ front_page }}" title="{{ 'Home'|t }}" rel="home" id="logo">
        <img src="{{ logo }}" alt="{{ 'Home'|t }}" />
      </a>
    {% endif %}

    {% if site_name or site_slogan %}
96
      <div id="name-and-slogan"{% if hide_site_name and hide_site_slogan %} class="visually-hidden"{% endif %}>
97 98
        {% if site_name %}
          {% if title %}
99
            <div id="site-name"{% if hide_site_name %} class="visually-hidden"{% endif %}>
100 101 102 103 104 105
              <strong>
                <a href="{{ front_page }}" title="{{ 'Home'|t }}" rel="home"><span>{{ site_name }}</span></a>
              </strong>
            </div>
          {# Use h1 when the content title is empty #}
          {% else %}
106
            <h1 id="site-name"{% if hide_site_name %} class="visually-hidden" {% endif %}>
107 108 109 110 111 112
              <a href="{{ front_page }}" title="{{ 'Home'|t }}" rel="home"><span>{{ site_name }}</span></a>
            </h1>
          {% endif %}
        {% endif %}

        {% if site_slogan %}
113
          <div id="site-slogan"{% if hide_site_slogan %} class="visually-hidden"{% endif %}>
114 115 116 117 118 119 120 121 122
            {{ site_slogan }}
          </div>
        {% endif %}
      </div><!-- /#name-and-slogan -->
    {% endif %}

    {{ page.header }}

    {% if main_menu %}
123
      <nav id ="main-menu" class="navigation" role="navigation" aria-labelledby="links__system_main_menu">
124 125 126 127
        <div id="nav"></div>
        <div id="no-nav"></div>
        <a class="main-menu-reveal" href="#nav">{{ 'Menu'|t }}</a>
        <a class="main-menu-reveal main-menu-reveal--hide" href="#no-nav">{{ 'Menu'|t }}</a>
128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158
        {{ main_menu }}
      </nav> <!-- /#main-menu -->
    {% endif %}
  </div></header> <!-- /.section, /#header-->

  {% if messages %}
    <div id="messages"><div class="section clearfix">
      {{ messages }}
    </div></div> <!-- /.section, /#messages -->
  {% endif %}

  {% if page.featured %}
    <aside id="featured"><div class="section clearfix">
      {{ page.featured }}
    </div></aside> <!-- /.section, /#featured -->
  {% endif %}

  <div id="main-wrapper" class="clearfix"><div id="main" class="clearfix">
    {{ breadcrumb }}

    <main id="content" class="column" role="main"><section class="section">
      {% if page.highlighted %}<div id="highlighted">{{ page.highlighted }}</div>{% endif %}
      <a id="main-content"></a>
      {{ title_prefix }}
        {% if title %}
          <h1 class="title" id="page-title">
            {{ title }}
          </h1>
        {% endif %}
      {{ title_suffix }}
        {% if tabs %}
159
          <nav class="tabs" role="navigation" aria-label="{{ 'Tabs'|t }}">
160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214
            {{ tabs }}
          </nav>
        {% endif %}
      {{ page.help }}
        {% if action_links %}
          <ul class="action-links">
            {{ action_links }}
          </ul>
        {% endif %}
      {{ page.content }}
      {{ feed_icons }}
    </section></main> <!-- /.section, /#content -->

    {% if page.sidebar_first %}
      <div id="sidebar-first" class="column sidebar"><aside class="section">
        {{ page.sidebar_first }}
      </aside></div><!-- /.section, /#sidebar-first -->
    {% endif %}

    {% if page.sidebar_second %}
      <div id="sidebar-second" class="column sidebar"><aside class="section">
        {{ page.sidebar_second }}
      </aside></div><!-- /.section, /#sidebar-second -->
    {% endif %}

  </div></div><!-- /#main, /#main-wrapper -->

  {% if page.triptych_first or page.triptych_middle or page.triptych_last %}
    <div id="triptych-wrapper"><aside id="triptych" class="clearfix">
      {{ page.triptych_first }}
      {{ page.triptych_middle }}
      {{ page.triptych_last }}
    </aside></div><!-- /#triptych, /#triptych-wrapper -->
  {% endif %}

  <div id="footer-wrapper"><footer class="section">

    {% if page.footer_firstcolumn or page.footer_secondcolumn or page.footer_thirdcolumn or page.footer_fourthcolumn %}
      <div id="footer-columns" class="clearfix">
        {{ page.footer_firstcolumn }}
        {{ page.footer_secondcolumn }}
        {{ page.footer_thirdcolumn }}
        {{ page.footer_fourthcolumn }}
      </div><!-- /#footer-columns -->
    {% endif %}

    {% if page.footer %}
      <div id="footer" role="contentinfo" class="clearfix">
        {{ page.footer }}
      </div> <!-- /#footer -->
   {% endif %}

  </footer></div> <!-- /.section, /#footer-wrapper -->

</div></div> <!-- /#page, /#page-wrapper -->