seeds_tailwind-1.0.x-dev/templates/layout/page.html.twig

{#
/**
 * @file
 * seedsTailwind 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 template_preprocess_page()
 * @see html.html.twig
 */
#}

<div id="page-wrapper" class="page-wrapper">
	<div id="page">
		{% if page.header %}
			<header id="header" class="header bg-slate-100" role="banner" aria-label="{{ 'Site header'|t}}">
				{% block head %}
					{% if page.header_collapse or page.header %}
						<nav{{navbar_top_attributes}} class="grid grid-cols-2">
							{% if container_navbar %}
								<div class="container">
								{% endif %}
								{% if page.header|render %}
									<div class="navbar-form">
										{{ page.header }}
									</div>
								{% endif %}
								{% if page.header_collapse | render %}
									<div class="navigation-bar hidden lg:flex">
										{{ page.header_collapse }}
									</div>
								{% endif %}
								{% if page.collapse_only or page.header_collapse or page.navigation %}
									<button class="mobile-menu-button lg:hidden">
										<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24">
											<title>bars-3-bottom-left</title>
											<g fill="none">
												<path d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
											</g>
										</svg>
									</button>
								{% endif %}
								{% if container_navbar %}
								</div>
							{% endif %}
						</nav>
					{% endif %}
					<nav{{navbar_attributes}}>
						{% if container_navbar %}
							<div class="container">
							{% endif %}
							{% if page.collapse_only or page.navigation or page.header_collapse %}
								<div class="collapse navbar-collapse hidden">
									{% if page.navigation|render %}
										<div class="navbar-form">
											{{ page.navigation }}
										</div>
									{% endif %}

									{% if page.collapse_only or page.header_collapse %}
										<div class="collapse-only flex lg:hidden">
											{{ page.collapse_only }}
											{{ page.header_collapse }}
										</div>
									{% endif %}
								</div>
							{% endif %}
							{% if sidebar_collapse %}
								<button class="mobile-menu-button lg:hidden">
									<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24">
										<title>bars-3-bottom-left</title>
										<g fill="none">
											<path d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25H12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
										</g>
									</svg>
								</button>
							{% endif %}
							{% if container_navbar %}
							</div>
						{% endif %}
					</nav>
				{% endblock %}
			</header>
		{% endif %}
		{% if page.highlighted %}
			<div class="highlighted">
				<aside class="{{ container }} section clearfix" role="complementary">
					{{ page.highlighted }}
				</aside>
			</div>
		{% endif %}
		{% if page.featured_top %}
			{% block featured %}
				<div class="featured-top">
					<aside class="featured-top__inner section {{ container }} clearfix" role="complementary">
						{{ page.featured_top }}
					</aside>
				</div>
			{% endblock %}
		{% endif %}
		<div id="main-wrapper" class="layout-main-wrapper clearfix">
			{% block content %}
				<div id="main" class="{{ main_container }}">
					{{ page.breadcrumb }}
					<div class="row-offcanvas row-offcanvas-left clearfix">
						<main class="main-content" id="content" role="main">
							<section class="section">
								<a id="main-content" tabindex="-1"></a>
								{{ page.content }}
							</section>
						</main>
					</div>
				</div>
			{% endblock %}
		</div>
		{% if page.featured_bottom_first or page.featured_bottom_second or page.featured_bottom_third %}
			<div class="featured-bottom">
				<aside class="{{ container }} clearfix" role="complementary">
					{{ page.featured_bottom_first }}
					{{ page.featured_bottom_second }}
					{{ page.featured_bottom_third }}
				</aside>
			</div>
		{% endif %}
		<footer class="site-footer">
			{% block footer %}
				<div class="{{ container }}">
					{% if page.footer_first or page.footer_second or page.footer_third or page.footer_fourth %}
						<div class="site-footer__top grid grid-flow-row-dense grid-cols-5 grid-rows-1 bg-slate-100">
							{{ page.footer_first }}
							{{ page.footer_second }}
							{{ page.footer_third }}
							{{ page.footer_fourth }}
						</div>
					{% endif %}
					{% if page.footer_fifth %}
						<div class="site-footer__bottom bg-slate-300">
							{{ page.footer_fifth }}
						</div>
					{% endif %}
				</div>
			{% endblock %}
		</footer>
	</div>
</div>