mirror of
https://github.com/shoelace-style/webawesome.git
synced 2026-01-12 12:09:26 +00:00
a07f6280a3
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com> Co-authored-by: lindsaym-fa <dev@lindsaym.design>
105 lines
3.6 KiB
Plaintext
105 lines
3.6 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en" data-fa-kit-code="b10bfbde90" data-cdn-url="{% cdnUrl %}">
|
|
<head>
|
|
{% include 'head.njk' %}
|
|
<meta name="theme-color" content="#f36944">
|
|
|
|
<script type="module" src="/assets/scripts/code-examples.js"></script>
|
|
<script type="module" src="/assets/scripts/copy-code.js"></script>
|
|
|
|
<script type="module" src="/assets/scripts/scroll.js"></script>
|
|
<script type="module" src="/assets/scripts/turbo.js"></script>
|
|
<script type="module" src="/assets/scripts/search.js"></script>
|
|
<script type="module" src="/assets/scripts/outline.js"></script>
|
|
<script defer data-domain="backers.webawesome.com" src="https://plausible.io/js/script.js"></script>
|
|
|
|
{# Docs styles #}
|
|
<link rel="stylesheet" href="/assets/styles/docs.css" />
|
|
</head>
|
|
<body class="layout-{{ layout | stripExtension }}">
|
|
<!-- use view="desktop" as default to reduce layout jank on desktop site. -->
|
|
<wa-page view="desktop" disable-navigation-toggle="">
|
|
<header slot="header" class="wa-split">
|
|
{# Logo #}
|
|
<div id="docs-branding">
|
|
{# Nav toggle #}
|
|
<wa-button appearance="plain" size="small" data-toggle-nav>
|
|
<wa-icon name="bars" label="Toggle navigation"></wa-icon>
|
|
</wa-button>
|
|
|
|
<a href="/" aria-label="Web Awesome">
|
|
<span class="wa-desktop-only">{% include "logo.njk" %}</span>
|
|
<span class="wa-mobile-only">{% include "logo-simple.njk" %}</span>
|
|
</a>
|
|
<small id="version-number" class="only-desktop">{{ package.version }}</small>
|
|
<wa-badge variant="warning" appearance="filled" class="only-desktop">Alpha</wa-badge>
|
|
</div>
|
|
|
|
<div id="docs-toolbar" class="wa-cluster wa-gap-xs">
|
|
{# Desktop selectors #}
|
|
<div class="only-desktop wa-cluster wa-gap-xs">
|
|
{% include "preset-theme-selector.njk" %}
|
|
{% include "color-scheme-selector.njk" %}
|
|
</div>
|
|
|
|
{# Search #}
|
|
<wa-button id="search-trigger" appearance="outlined" size="small" data-search>
|
|
<wa-icon slot="prefix" name="magnifying-glass"></wa-icon>
|
|
Search
|
|
<kbd slot="suffix" class="only-desktop">/</kbd>
|
|
</wa-button>
|
|
</div>
|
|
</header>
|
|
|
|
{# Sidebar #}
|
|
{% if hasSidebar %}
|
|
{# Mobile selectors #}
|
|
<div class="wa-mobile-only" slot="navigation-header">
|
|
<div class="wa-cluster wa-gap-xs">
|
|
{% include "preset-theme-selector.njk" %}
|
|
{% include "color-scheme-selector.njk" %}
|
|
</div>
|
|
</div>
|
|
<div slot="navigation" id="sidebar" class="docs-aside" data-remember-scroll>
|
|
{% include "sidebar.njk" %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Outline #}
|
|
{% if hasOutline %}
|
|
<aside slot="aside" id="outline" class="docs-aside">
|
|
<nav id="outline-standard" class="outline-links">
|
|
<h2><a href="#content">{{ title }}</a></h2>
|
|
</nav>
|
|
</aside>
|
|
{% endif %}
|
|
|
|
{# Main #}
|
|
<main id="content">
|
|
{# Expandable outline #}
|
|
<nav id="outline-expandable">
|
|
<details class="outline-links">
|
|
<summary>On this page</summary>
|
|
</details>
|
|
</nav>
|
|
|
|
|
|
|
|
{% block header %}
|
|
{% include 'breadcrumbs.njk' %}
|
|
<h1 class="title">{{ title }}</h1>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
{{ content | safe }}
|
|
{% endblock %}
|
|
|
|
{% block afterContent %}{% endblock %}
|
|
</main>
|
|
|
|
{% include 'search.njk' %}
|
|
</wa-page>
|
|
|
|
</body>
|
|
</html>
|