@levino/shipyard-base 0.7.0 → 0.7.1-rc-20260206100441
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -39,13 +39,13 @@ const { brand, navigation, showBrand = false } = Astro.props as Props
|
|
|
39
39
|
<a
|
|
40
40
|
href="/"
|
|
41
41
|
class={cn("btn btn-ghost text-xl", {
|
|
42
|
-
"
|
|
42
|
+
"lg:hidden": !showBrand,
|
|
43
43
|
})}
|
|
44
44
|
>
|
|
45
45
|
{brand}
|
|
46
46
|
</a>
|
|
47
47
|
</div>
|
|
48
|
-
<div class="hidden flex-none lg:flex">
|
|
48
|
+
<div class="hidden flex-none items-center lg:flex">
|
|
49
49
|
<ul class="menu menu-horizontal px-1">
|
|
50
50
|
{
|
|
51
51
|
Object.entries(navigation).map(([key, entry]) =>
|
|
@@ -75,3 +75,25 @@ const { brand, navigation, showBrand = false } = Astro.props as Props
|
|
|
75
75
|
<LanguageSwitcher variant="dropdown" />
|
|
76
76
|
</div>
|
|
77
77
|
</div>
|
|
78
|
+
|
|
79
|
+
<script>
|
|
80
|
+
document.addEventListener('click', (e) => {
|
|
81
|
+
const navbar = document.querySelector('.navbar')
|
|
82
|
+
if (!navbar) return
|
|
83
|
+
const openDetails = navbar.querySelectorAll('details[open]')
|
|
84
|
+
for (const details of openDetails) {
|
|
85
|
+
if (!details.contains(e.target)) {
|
|
86
|
+
details.removeAttribute('open')
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
})
|
|
90
|
+
document.addEventListener('keydown', (e) => {
|
|
91
|
+
if (e.key === 'Escape') {
|
|
92
|
+
const navbar = document.querySelector('.navbar')
|
|
93
|
+
if (!navbar) return
|
|
94
|
+
for (const details of navbar.querySelectorAll('details[open]')) {
|
|
95
|
+
details.removeAttribute('open')
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
})
|
|
99
|
+
</script>
|
|
@@ -17,13 +17,13 @@ const withLocale = (path: string) =>
|
|
|
17
17
|
Astro.currentLocale ? `/${Astro.currentLocale}${path}` : path
|
|
18
18
|
---
|
|
19
19
|
|
|
20
|
-
<ul class={cn("menu min-h-
|
|
21
|
-
<div>
|
|
22
|
-
<a href={withLocale("/")} class="btn btn-ghost mb-2 text-
|
|
20
|
+
<ul class={cn("menu min-h-full w-56 bg-base-100", { "lg:hidden": !local })} data-testid="sidebar-navigation">
|
|
21
|
+
<div class="max-w-full">
|
|
22
|
+
<a href={withLocale("/")} class="btn btn-ghost mb-2 max-w-full truncate text-lg">
|
|
23
23
|
{brand}
|
|
24
24
|
</a>
|
|
25
25
|
</div>
|
|
26
|
-
<div class="block
|
|
26
|
+
<div class="block lg:hidden" data-testid="sidebar-global-nav">
|
|
27
27
|
<li>
|
|
28
28
|
{
|
|
29
29
|
local ? (
|
|
@@ -42,7 +42,7 @@ const withLocale = (path: string) =>
|
|
|
42
42
|
<span class="text-sm opacity-70">Theme</span>
|
|
43
43
|
<ThemeToggle />
|
|
44
44
|
</li>
|
|
45
|
-
<div class={cn("divider my-1 block
|
|
45
|
+
<div class={cn("divider my-1 block lg:hidden", { hidden: !local })}></div>
|
|
46
46
|
</div>
|
|
47
47
|
{local && <div data-testid="sidebar-local-nav"><SidebarElement entry={local} /></div>}
|
|
48
48
|
</ul>
|
package/astro/layouts/Page.astro
CHANGED
|
@@ -8,6 +8,7 @@ import type {
|
|
|
8
8
|
NavigationTree,
|
|
9
9
|
Script,
|
|
10
10
|
} from '../../src/schemas/config'
|
|
11
|
+
import { cn } from '../../src/tools/cn'
|
|
11
12
|
import { getTitle } from '../../src/tools/title'
|
|
12
13
|
import {
|
|
13
14
|
AnnouncementBar,
|
|
@@ -60,6 +61,7 @@ const applyLocaleAndSetActive: (navigation: NavigationTree) => NavigationTree =
|
|
|
60
61
|
|
|
61
62
|
const navigation = applyLocaleAndSetActive(config.navigation)
|
|
62
63
|
const title = getTitle(config.title, props.title)
|
|
64
|
+
const hasSidebar = !!props.sidebarNavigation
|
|
63
65
|
|
|
64
66
|
// Helper function to render script attributes
|
|
65
67
|
const renderScriptAttributes = (script: Script) => {
|
|
@@ -106,25 +108,22 @@ const renderScriptAttributes = (script: Script) => {
|
|
|
106
108
|
return <script is:inline {...attrs}></script>
|
|
107
109
|
})}
|
|
108
110
|
</head>
|
|
109
|
-
<body>
|
|
111
|
+
<body class="flex min-h-screen flex-col">
|
|
110
112
|
{config.announcementBar && <AnnouncementBar config={config.announcementBar} />}
|
|
111
|
-
<div class="drawer lg:drawer-open">
|
|
113
|
+
<div class={cn("drawer grow", { "lg:drawer-open": hasSidebar })}>
|
|
112
114
|
<input id="drawer" type="checkbox" class="drawer-toggle" />
|
|
113
|
-
<div class="drawer-content overflow-x-hidden">
|
|
114
|
-
<
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
<div class="
|
|
123
|
-
<
|
|
124
|
-
<slot />
|
|
125
|
-
</div>
|
|
115
|
+
<div class="drawer-content flex flex-col overflow-x-hidden">
|
|
116
|
+
<GlobalDesktopNavigation
|
|
117
|
+
showBrand={!hasSidebar}
|
|
118
|
+
brand={config.brand}
|
|
119
|
+
navigation={navigation}
|
|
120
|
+
>
|
|
121
|
+
<slot name="navbarExtra" slot="navbarExtra" />
|
|
122
|
+
</GlobalDesktopNavigation>
|
|
123
|
+
<div class="grow">
|
|
124
|
+
<div class="mx-auto max-w-7xl px-4 pb-12">
|
|
125
|
+
<slot />
|
|
126
126
|
</div>
|
|
127
|
-
<Footer />
|
|
128
127
|
</div>
|
|
129
128
|
</div>
|
|
130
129
|
|
|
@@ -142,6 +141,7 @@ const renderScriptAttributes = (script: Script) => {
|
|
|
142
141
|
</div>
|
|
143
142
|
</div>
|
|
144
143
|
</div>
|
|
144
|
+
<Footer />
|
|
145
145
|
<Npm2YarnScript />
|
|
146
146
|
</body>
|
|
147
147
|
</html>
|
package/package.json
CHANGED
package/src/globals.css
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
* @source "../node_modules/@levino/shipyard-docs";
|
|
17
17
|
* @import "@levino/shipyard-base/globals.css";
|
|
18
18
|
*
|
|
19
|
-
* See: https://shipyard.levinkeller.de/docs/guides/tailwind-setup
|
|
19
|
+
* See: https://shipyard.levinkeller.de/en/docs/guides/tailwind-setup
|
|
20
20
|
*/
|
|
21
21
|
|
|
22
22
|
@import "./styles/components.css";
|