@farming-labs/astro-theme 0.0.7 → 0.0.9-beta.1
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.
- package/package.json +3 -3
- package/src/components/DocsLayout.astro +23 -17
- package/styles/colorful.css +108 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@farming-labs/astro-theme",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.9-beta.1",
|
|
4
4
|
"description": "Astro UI components for @farming-labs/docs — layout, sidebar, TOC, search, and theme toggle",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"astro",
|
|
@@ -79,8 +79,8 @@
|
|
|
79
79
|
},
|
|
80
80
|
"dependencies": {
|
|
81
81
|
"sugar-high": "^0.9.5",
|
|
82
|
-
"@farming-labs/
|
|
83
|
-
"@farming-labs/
|
|
82
|
+
"@farming-labs/astro": "0.0.9-beta.1",
|
|
83
|
+
"@farming-labs/docs": "0.0.9-beta.1"
|
|
84
84
|
},
|
|
85
85
|
"peerDependencies": {
|
|
86
86
|
"astro": ">=4.0.0"
|
|
@@ -136,8 +136,10 @@ function getIcon(iconKey) {
|
|
|
136
136
|
return ICON_MAP[iconKey] || null;
|
|
137
137
|
}
|
|
138
138
|
|
|
139
|
+
const staticExport = !!(config as { staticExport?: boolean }).staticExport;
|
|
139
140
|
const aiConfig = config?.ai;
|
|
140
|
-
const showFloatingAI = aiConfig?.mode === "floating" && aiConfig?.enabled;
|
|
141
|
+
const showFloatingAI = !staticExport && aiConfig?.mode === "floating" && !!aiConfig?.enabled;
|
|
142
|
+
const showSearch = !staticExport;
|
|
141
143
|
---
|
|
142
144
|
|
|
143
145
|
<script is:inline set:html={themeInitScript}></script>
|
|
@@ -153,12 +155,14 @@ const showFloatingAI = aiConfig?.mode === "floating" && aiConfig?.enabled;
|
|
|
153
155
|
</svg>
|
|
154
156
|
</button>
|
|
155
157
|
<a href={resolvedTitleUrl} class="fd-header-title">{resolvedTitle}</a>
|
|
156
|
-
|
|
157
|
-
<
|
|
158
|
-
<
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
158
|
+
{showSearch && (
|
|
159
|
+
<button class="fd-search-trigger-mobile" id="fd-search-open-mobile" aria-label="Search">
|
|
160
|
+
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
|
|
161
|
+
<circle cx="11" cy="11" r="8" />
|
|
162
|
+
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
163
|
+
</svg>
|
|
164
|
+
</button>
|
|
165
|
+
)}
|
|
162
166
|
</header>
|
|
163
167
|
|
|
164
168
|
<div class="fd-sidebar-overlay" id="fd-sidebar-overlay" style="display:none"></div>
|
|
@@ -174,16 +178,18 @@ const showFloatingAI = aiConfig?.mode === "floating" && aiConfig?.enabled;
|
|
|
174
178
|
</a>
|
|
175
179
|
</div>
|
|
176
180
|
|
|
177
|
-
|
|
178
|
-
<
|
|
179
|
-
<
|
|
180
|
-
<
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
181
|
+
{showSearch && (
|
|
182
|
+
<div class="fd-sidebar-search">
|
|
183
|
+
<button class="fd-sidebar-search-btn" id="fd-search-open">
|
|
184
|
+
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
|
|
185
|
+
<circle cx="11" cy="11" r="8" />
|
|
186
|
+
<line x1="21" y1="21" x2="16.65" y2="16.65" />
|
|
187
|
+
</svg>
|
|
188
|
+
<span>Search</span>
|
|
189
|
+
<kbd>⌘</kbd><kbd>K</kbd>
|
|
190
|
+
</button>
|
|
191
|
+
</div>
|
|
192
|
+
)}
|
|
187
193
|
|
|
188
194
|
{Astro.slots.has("sidebar-header") && (
|
|
189
195
|
<div class="fd-sidebar-banner">
|
package/styles/colorful.css
CHANGED
|
@@ -35,6 +35,114 @@
|
|
|
35
35
|
--color-fd-muted-foreground: hsl(0, 0%, 72%);
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
+
/* ─── Sidebar AI trigger (sidebar-icon mode) — search + Ask AI row ───── */
|
|
39
|
+
|
|
40
|
+
.fd-sidebar-search-ai-row {
|
|
41
|
+
display: flex;
|
|
42
|
+
gap: 10px;
|
|
43
|
+
align-items: stretch;
|
|
44
|
+
width: 100%;
|
|
45
|
+
margin-bottom: 2px;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.fd-sidebar-search-ai-row .fd-sidebar-search-btn {
|
|
49
|
+
flex: 1;
|
|
50
|
+
min-width: 0;
|
|
51
|
+
display: flex;
|
|
52
|
+
align-items: center;
|
|
53
|
+
gap: 8px;
|
|
54
|
+
padding: 8px 12px;
|
|
55
|
+
font-size: 0.875rem;
|
|
56
|
+
color: var(--color-fd-muted-foreground);
|
|
57
|
+
background: transparent;
|
|
58
|
+
border: 1px solid var(--color-fd-border);
|
|
59
|
+
border-radius: 8px;
|
|
60
|
+
cursor: pointer;
|
|
61
|
+
transition: background-color 150ms, border-color 150ms, color 150ms;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.fd-sidebar-search-ai-row .fd-sidebar-search-btn:hover {
|
|
65
|
+
background: var(--color-fd-accent);
|
|
66
|
+
color: var(--color-fd-foreground);
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.fd-sidebar-search-ai-row .fd-sidebar-search-btn svg {
|
|
70
|
+
flex-shrink: 0;
|
|
71
|
+
width: 16px;
|
|
72
|
+
height: 16px;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.fd-sidebar-search-ai-row .fd-sidebar-search-kbd {
|
|
76
|
+
display: flex;
|
|
77
|
+
gap: 2px;
|
|
78
|
+
margin-left: auto;
|
|
79
|
+
font-size: 0.75rem;
|
|
80
|
+
opacity: 0.8;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.fd-sidebar-search-ai-row .fd-sidebar-search-kbd kbd {
|
|
84
|
+
font-family: inherit;
|
|
85
|
+
font-size: 0.7rem;
|
|
86
|
+
padding: 2px 5px;
|
|
87
|
+
border: 1px solid var(--color-fd-border);
|
|
88
|
+
border-radius: 4px;
|
|
89
|
+
background: var(--color-fd-muted);
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.fd-sidebar-search-ai-row .fd-sidebar-ai-btn {
|
|
93
|
+
display: inline-flex;
|
|
94
|
+
align-items: center;
|
|
95
|
+
justify-content: center;
|
|
96
|
+
width: 38px;
|
|
97
|
+
min-width: 38px;
|
|
98
|
+
flex-shrink: 0;
|
|
99
|
+
border-radius: 8px;
|
|
100
|
+
border: 1px solid var(--color-fd-border);
|
|
101
|
+
background: transparent;
|
|
102
|
+
color: var(--color-fd-muted-foreground);
|
|
103
|
+
cursor: pointer;
|
|
104
|
+
transition: background-color 150ms, color 150ms, border-color 150ms;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
.fd-sidebar-search-ai-row .fd-sidebar-ai-btn:hover {
|
|
108
|
+
background: var(--color-fd-accent);
|
|
109
|
+
color: var(--color-fd-primary);
|
|
110
|
+
border-color: var(--color-fd-primary);
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.fd-sidebar-search-ai-row .fd-sidebar-ai-btn svg {
|
|
114
|
+
width: 16px;
|
|
115
|
+
height: 16px;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
.dark .fd-sidebar .fd-sidebar-search-ai-row .fd-sidebar-search-btn {
|
|
119
|
+
background: var(--color-fd-secondary);
|
|
120
|
+
border-color: var(--color-fd-border);
|
|
121
|
+
color: var(--color-fd-muted-foreground);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.dark .fd-sidebar .fd-sidebar-search-ai-row .fd-sidebar-search-btn:hover {
|
|
125
|
+
background: var(--color-fd-accent);
|
|
126
|
+
color: var(--color-fd-foreground);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.dark .fd-sidebar .fd-sidebar-search-ai-row .fd-sidebar-search-kbd kbd {
|
|
130
|
+
background: var(--color-fd-muted);
|
|
131
|
+
border-color: var(--color-fd-border);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.dark .fd-sidebar .fd-sidebar-search-ai-row .fd-sidebar-ai-btn {
|
|
135
|
+
background: var(--color-fd-secondary);
|
|
136
|
+
border-color: var(--color-fd-border);
|
|
137
|
+
color: var(--color-fd-muted-foreground);
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.dark .fd-sidebar .fd-sidebar-search-ai-row .fd-sidebar-ai-btn:hover {
|
|
141
|
+
background: var(--color-fd-accent);
|
|
142
|
+
color: var(--color-fd-primary);
|
|
143
|
+
border-color: var(--color-fd-primary);
|
|
144
|
+
}
|
|
145
|
+
|
|
38
146
|
/* ─── Cards (fumadocs style) ────────────────────────────────────────── */
|
|
39
147
|
|
|
40
148
|
.fd-card {
|