<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GNexus UI Kit</title>
<link rel="stylesheet" href="/assets/fonts/phosphor-icons/src/css/icons.css">
<link rel="stylesheet" href="/assets/libs/highlight/styles/base16/summerfruit-dark.min.css">
<link rel="stylesheet" href="/css/demo.css">
<link rel="icon" type="image/svg+xml" href="/assets/imgs/gnexus-mark.svg">
<meta name="theme-color" content="#16161E">
</head>
<body>
<main class="container docs-page">
<header class="section docs-intro">
<h1 class="contrast">GNexus UI Kit</h1>
<p>Набор базовых элементов интерфейса.</p>
</header>
<div class="docs-layout">
<aside class="docs-sidebar" aria-label="Навигация по UI kit">
<div class="docs-sidebar-title">Sections</div>
<nav>
<ul class="list list-nav">
<li class="list-item list-item-active">
<a class="list-action" href="#typography">
<span class="list-label"><i class="ph ph-text-aa"></i> Typography</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#colors">
<span class="list-label"><i class="ph ph-palette"></i> Palette</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#buttons">
<span class="list-label"><i class="ph ph-hand-pointing"></i> Buttons</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#forms">
<span class="list-label"><i class="ph ph-textbox"></i> Forms</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#editable-string">
<span class="list-label"><i class="ph ph-pencil-simple"></i> Editable String</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#navigation-overlays">
<span class="list-label"><i class="ph ph-stack"></i> Navigation & Overlays</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#lists">
<span class="list-label"><i class="ph ph-list-bullets"></i> Lists</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#badges">
<span class="list-label"><i class="ph ph-tag"></i> Badges</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#alerts">
<span class="list-label"><i class="ph ph-warning"></i> Alerts</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#tables">
<span class="list-label"><i class="ph ph-table"></i> Tables</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#data-patterns">
<span class="list-label"><i class="ph ph-chart-bar"></i> Data Patterns</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#page-header">
<span class="list-label"><i class="ph ph-browser"></i> Page Header</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#description-list">
<span class="list-label"><i class="ph ph-list-dashes"></i> Key-Value</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#toasts">
<span class="list-label"><i class="ph ph-notification"></i> Toasts</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#cards">
<span class="list-label"><i class="ph ph-squares-four"></i> Cards</span>
</a>
</li>
<li class="list-item">
<a class="list-action" href="#modals">
<span class="list-label"><i class="ph ph-browser"></i> Modals</span>
</a>
</li>
</ul>
</nav>
</aside>
<div class="docs-content">
@@include("partials/typography.html")
@@include("partials/palette.html")
@@include("partials/buttons.html")
@@include("partials/forms.html")
@@include("partials/editable-string.html")
@@include("partials/navigation-overlays.html")
@@include("partials/lists.html")
@@include("partials/badges.html")
@@include("partials/alerts.html")
@@include("partials/tables.html")
@@include("partials/data-patterns.html")
@@include("partials/page-header.html")
@@include("partials/description-list.html")
@@include("partials/toasts.html")
@@include("partials/cards.html")
@@include("partials/modals.html")
</div>
</div>
</main>
<script src="/assets/libs/highlight/highlight.min.js"></script>
<script src="/js/gnexus-ui-kit.js"></script>
</body>
</html>
