docs/components/DocsNavbar.astro - dev - githubmirror/tabler

docs/components/DocsNavbar.astro

61 строка2 KB

Bartosz-Do

Fix docs UI bugs: tabs, redirect, docs-libs, colors grid, navbar link (#2830)

08 авг 2026, 00:57

08 авг 2026, 00:57a1b65d1

---
import Icon from '@ui/Icon.astro'
import DocsLogo from './DocsLogo.astro'
import { site } from '@shared/lib/site'

// Eventually belongs in src/lib/site.ts (out of scope for this task).
const previewUrl = 'https://preview.tabler.io'
const changelogUrl = 'https://tabler.io/changelog'
---

<!-- BEGIN DOCS NAVBAR -->
<nav class="navbar navbar-expand sticky-top" aria-label="Docs">
  <div class="container">
    <div class="row flex-fill align-items-md-center">
      <div class="col">
        <div class="d-flex align-items-center gap-4">
          <a href="/" class="navbar-brand navbar-brand-autodark gap-4">
            <DocsLogo />
          </a>
          <div>
            <span class="badge">v{site.version}</span>
          </div>
        </div>
      </div>
      <div class="d-none d-md-block col">
        <div id="docsearch"></div>
      </div>
      <div class="col d-flex">
        <ul class="navbar-nav ms-auto gap-2 align-items-center">
          <li class="nav-item d-none d-md-block">
            <a href={previewUrl} class="nav-link">Preview</a>
          </li>
          <li class="nav-item d-none d-md-block">
            <a href={changelogUrl} class="nav-link">Changelog</a>
          </li>
          <li class="nav-item hide-theme-dark">
            <a href="?theme=dark" class="btn btn-icon">
              <Icon name="moon" />
            </a>
          </li>
          <li class="nav-item hide-theme-light">
            <a href="?theme=light" class="btn btn-icon">
              <Icon name="sun" />
            </a>
          </li>
          <li class="nav-item">
            <a href={site.githubUrl} class="btn btn-icon" target="_blank">
              <Icon name="brand-github" />
            </a>
          </li>
          <li class="nav-item">
            <a href={previewUrl} class="btn btn-primary" target="_blank">
              <Icon name="eye" /> Preview
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</nav>
<!-- END DOCS NAVBAR -->