Add remaining samples, tooling, and local project assets

2026-04-15 18:02:17 +09:00
parent 05d43a7999
commit 1ff6c6cbb2
862 changed files with 18979 additions and 21 deletions
--- a/samples/src/components/SiteTitleWithSelect.astro
+++ b/samples/src/components/SiteTitleWithSelect.astro
@@ -0,0 +1,154 @@
+---
+import { Logos } from "starlight-theme-nova/components/Logos";
+import type { Props } from "@astrojs/starlight/props";
+
+const { siteTitle, locale } = Astro.props; // Starlight props
+
+const sections = [
+    { label: "Civil DX", value: "/civil-dx/" },
+    { label: "기반기술", value: "/기반기술/" },
+    { label: "설계", value: "/설계/" },
+    { label: "시공", value: "/시공/" },
+];
+
+const currentPath = decodeURIComponent(Astro.url.pathname);
+let currentSection = "";
+
+// Determine current section
+for (const section of sections) {
+    if (currentPath.includes(section.value)) {
+        currentSection = section.value;
+        break;
+    }
+}
+---
+
+<div class="site-title-wrapper">
+    <!-- Logo/Title -->
+    <a
+        href="/"
+        class="site-title"
+        aria-label={siteTitle ? siteTitle.textContent : "CivilEngineeringLab"}
+    >
+        <span class="logo-mark" data-testid="cel-mobile-mark">CEL</span>
+        {
+            siteTitle &&
+                siteTitle.logoVisibleOnMobile !== false &&
+                siteTitle.logo && (
+                    <img
+                        class="logo"
+                        src={siteTitle.logo.src}
+                        alt={siteTitle.logo.alt || "Logo"}
+                        width="32"
+                        height="32"
+                    />
+                )
+        }
+        <span class="title-text" data-testid="cel-full-title"
+            >{siteTitle ? siteTitle.textContent : "CivilEngineeringLab"}</span
+        >
+    </a>
+
+    <!-- Divider -->
+    <span class="divider">|</span>
+
+    <!-- Select Box -->
+    <select class="section-select" onchange="window.location.href=this.value">
+        <option value="" disabled selected={!currentSection}>섹션 선택</option>
+        {
+            sections.map((section) => (
+                <option
+                    value={section.value}
+                    selected={section.value === currentSection}
+                >
+                    {section.label}
+                </option>
+            ))
+        }
+    </select>
+</div>
+
+<style>
+    .site-title-wrapper {
+        display: flex;
+        align-items: center;
+        gap: 1rem;
+    }
+    .title-text {
+        font-weight: bold;
+        font-size: 1.2rem;
+        color: var(--sl-color-text-accent);
+        text-decoration: none;
+    }
+    .site-title {
+        text-decoration: none;
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+        min-height: 2.25rem;
+    }
+
+    .logo-mark {
+        display: none;
+        font-weight: 800;
+        letter-spacing: 0.12em;
+        color: var(--sl-color-text);
+        font-size: 1.1rem;
+    }
+
+    .divider {
+        color: var(--sl-color-gray-4);
+    }
+
+    .section-select {
+        background-color: var(--sl-color-bg-nav);
+        color: var(--sl-color-white);
+        border: 1px solid var(--sl-color-gray-5);
+        border-radius: 0.25rem;
+        padding: 0.25rem 0.5rem;
+        font-size: 0.9rem;
+        cursor: pointer;
+    }
+
+    .section-select:hover {
+        border-color: var(--sl-color-gray-3);
+    }
+
+    /* Mobile handling */
+    @media (max-width: 64rem) {
+        .site-title-wrapper {
+            gap: 0.5rem;
+        }
+        .logo {
+            display: none;
+        }
+        .logo-mark {
+            display: inline-flex;
+        }
+        .title-text {
+            font-size: 1rem;
+            display: none !important;
+        }
+        .section-select {
+            max-width: 110px;
+            padding: 0.25rem 0.4rem;
+        }
+        .divider {
+            display: none;
+        }
+        :global(.nova-header-actions-lg .nova-theme-select) {
+            display: none !important;
+        }
+    }
+
+    @media (min-width: 64rem) {
+        .logo-mark {
+            display: none;
+        }
+        .title-text {
+            display: inline;
+        }
+    }
+</style>
+
+<script type="module" src="/scripts/fuzzy-search-client.js"></script>