@farming-labs/theme 0.0.66 → 0.0.71

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.
@@ -0,0 +1,90 @@
1
+ import * as _farming_labs_docs0 from "@farming-labs/docs";
2
+
3
+ //#region src/concrete/index.d.ts
4
+ declare const ConcreteUIDefaults: {
5
+ colors: {
6
+ primary: string;
7
+ background: string;
8
+ muted: string;
9
+ border: string;
10
+ };
11
+ typography: {
12
+ font: {
13
+ style: {
14
+ sans: string;
15
+ mono: string;
16
+ };
17
+ h1: {
18
+ size: string;
19
+ weight: number;
20
+ lineHeight: string;
21
+ letterSpacing: string;
22
+ };
23
+ h2: {
24
+ size: string;
25
+ weight: number;
26
+ lineHeight: string;
27
+ letterSpacing: string;
28
+ };
29
+ h3: {
30
+ size: string;
31
+ weight: number;
32
+ lineHeight: string;
33
+ letterSpacing: string;
34
+ };
35
+ h4: {
36
+ size: string;
37
+ weight: number;
38
+ lineHeight: string;
39
+ letterSpacing: string;
40
+ };
41
+ body: {
42
+ size: string;
43
+ weight: number;
44
+ lineHeight: string;
45
+ };
46
+ small: {
47
+ size: string;
48
+ weight: number;
49
+ lineHeight: string;
50
+ letterSpacing: string;
51
+ };
52
+ };
53
+ };
54
+ radius: string;
55
+ layout: {
56
+ contentWidth: number;
57
+ sidebarWidth: number;
58
+ toc: {
59
+ enabled: boolean;
60
+ depth: number;
61
+ style: "directional";
62
+ };
63
+ header: {
64
+ height: number;
65
+ sticky: boolean;
66
+ };
67
+ };
68
+ sidebar: {
69
+ style: "bordered";
70
+ };
71
+ components: {
72
+ Callout: {
73
+ variant: string;
74
+ icon: boolean;
75
+ };
76
+ CodeBlock: {
77
+ showCopyButton: boolean;
78
+ };
79
+ HoverLink: {
80
+ linkLabel: string;
81
+ showIndicator: boolean;
82
+ };
83
+ Tabs: {
84
+ style: "default";
85
+ };
86
+ };
87
+ };
88
+ declare const concrete: (overrides?: Partial<_farming_labs_docs0.DocsTheme>) => _farming_labs_docs0.DocsTheme;
89
+ //#endregion
90
+ export { ConcreteUIDefaults, concrete };
@@ -0,0 +1,92 @@
1
+ import { createTheme } from "@farming-labs/docs";
2
+
3
+ //#region src/concrete/index.ts
4
+ /**
5
+ * Concrete theme preset.
6
+ * Brutalist-inspired layout with poster typography, square corners, and offset shadows.
7
+ *
8
+ * CSS: `@import "@farming-labs/theme/concrete/css";`
9
+ */
10
+ const ConcreteUIDefaults = {
11
+ colors: {
12
+ primary: "#ff5b31",
13
+ background: "#f6ead9",
14
+ muted: "#5a4c42",
15
+ border: "#141210"
16
+ },
17
+ typography: { font: {
18
+ style: {
19
+ sans: "'Archivo', 'IBM Plex Sans', 'Space Grotesk', system-ui, sans-serif",
20
+ mono: "'Space Mono', 'IBM Plex Mono', ui-monospace, monospace"
21
+ },
22
+ h1: {
23
+ size: "2.85rem",
24
+ weight: 900,
25
+ lineHeight: "0.98",
26
+ letterSpacing: "-0.05em"
27
+ },
28
+ h2: {
29
+ size: "2.05rem",
30
+ weight: 850,
31
+ lineHeight: "1.04",
32
+ letterSpacing: "-0.035em"
33
+ },
34
+ h3: {
35
+ size: "1.52rem",
36
+ weight: 800,
37
+ lineHeight: "1.14",
38
+ letterSpacing: "-0.02em"
39
+ },
40
+ h4: {
41
+ size: "1.16rem",
42
+ weight: 750,
43
+ lineHeight: "1.28",
44
+ letterSpacing: "-0.01em"
45
+ },
46
+ body: {
47
+ size: "1.02rem",
48
+ weight: 550,
49
+ lineHeight: "1.68"
50
+ },
51
+ small: {
52
+ size: "0.83rem",
53
+ weight: 600,
54
+ lineHeight: "1.42",
55
+ letterSpacing: "0.02em"
56
+ }
57
+ } },
58
+ radius: "0px",
59
+ layout: {
60
+ contentWidth: 896,
61
+ sidebarWidth: 316,
62
+ toc: {
63
+ enabled: true,
64
+ depth: 3,
65
+ style: "directional"
66
+ },
67
+ header: {
68
+ height: 68,
69
+ sticky: true
70
+ }
71
+ },
72
+ sidebar: { style: "bordered" },
73
+ components: {
74
+ Callout: {
75
+ variant: "outline",
76
+ icon: true
77
+ },
78
+ CodeBlock: { showCopyButton: true },
79
+ HoverLink: {
80
+ linkLabel: "View doc",
81
+ showIndicator: false
82
+ },
83
+ Tabs: { style: "default" }
84
+ }
85
+ };
86
+ const concrete = createTheme({
87
+ name: "concrete",
88
+ ui: ConcreteUIDefaults
89
+ });
90
+
91
+ //#endregion
92
+ export { ConcreteUIDefaults, concrete };
@@ -0,0 +1,88 @@
1
+ import * as _farming_labs_docs0 from "@farming-labs/docs";
2
+
3
+ //#region src/hardline/index.d.ts
4
+ declare const HardlineUIDefaults: {
5
+ colors: {
6
+ primary: string;
7
+ background: string;
8
+ muted: string;
9
+ border: string;
10
+ };
11
+ typography: {
12
+ font: {
13
+ style: {
14
+ sans: string;
15
+ mono: string;
16
+ };
17
+ h1: {
18
+ size: string;
19
+ weight: number;
20
+ lineHeight: string;
21
+ letterSpacing: string;
22
+ };
23
+ h2: {
24
+ size: string;
25
+ weight: number;
26
+ lineHeight: string;
27
+ letterSpacing: string;
28
+ };
29
+ h3: {
30
+ size: string;
31
+ weight: number;
32
+ lineHeight: string;
33
+ letterSpacing: string;
34
+ };
35
+ h4: {
36
+ size: string;
37
+ weight: number;
38
+ lineHeight: string;
39
+ };
40
+ body: {
41
+ size: string;
42
+ weight: number;
43
+ lineHeight: string;
44
+ };
45
+ small: {
46
+ size: string;
47
+ weight: number;
48
+ lineHeight: string;
49
+ };
50
+ };
51
+ };
52
+ radius: string;
53
+ layout: {
54
+ contentWidth: number;
55
+ sidebarWidth: number;
56
+ toc: {
57
+ enabled: boolean;
58
+ depth: number;
59
+ style: "default";
60
+ };
61
+ header: {
62
+ height: number;
63
+ sticky: boolean;
64
+ };
65
+ };
66
+ sidebar: {
67
+ style: "bordered";
68
+ };
69
+ components: {
70
+ Callout: {
71
+ variant: string;
72
+ icon: boolean;
73
+ };
74
+ CodeBlock: {
75
+ showCopyButton: boolean;
76
+ };
77
+ HoverLink: {
78
+ linkLabel: string;
79
+ showIndicator: boolean;
80
+ };
81
+ Tabs: {
82
+ style: "underline";
83
+ };
84
+ };
85
+ };
86
+ declare const hardline: (overrides?: Partial<_farming_labs_docs0.DocsTheme>) => _farming_labs_docs0.DocsTheme;
87
+ //#endregion
88
+ export { HardlineUIDefaults, hardline };
@@ -0,0 +1,90 @@
1
+ import { createTheme } from "@farming-labs/docs";
2
+
3
+ //#region src/hardline/index.ts
4
+ /**
5
+ * Hardline theme preset.
6
+ * Hard edges, strong borders, and high-contrast typography.
7
+ *
8
+ * CSS: `@import "@farming-labs/theme/hardline/css";`
9
+ */
10
+ const HardlineUIDefaults = {
11
+ colors: {
12
+ primary: "#ffd335",
13
+ background: "#f2efe8",
14
+ muted: "#4b4944",
15
+ border: "#121212"
16
+ },
17
+ typography: { font: {
18
+ style: {
19
+ sans: "'IBM Plex Sans', 'Space Grotesk', system-ui, sans-serif",
20
+ mono: "'IBM Plex Mono', 'JetBrains Mono', ui-monospace, monospace"
21
+ },
22
+ h1: {
23
+ size: "2.6rem",
24
+ weight: 800,
25
+ lineHeight: "1.05",
26
+ letterSpacing: "-0.03em"
27
+ },
28
+ h2: {
29
+ size: "1.95rem",
30
+ weight: 800,
31
+ lineHeight: "1.15",
32
+ letterSpacing: "-0.02em"
33
+ },
34
+ h3: {
35
+ size: "1.45rem",
36
+ weight: 700,
37
+ lineHeight: "1.2",
38
+ letterSpacing: "-0.015em"
39
+ },
40
+ h4: {
41
+ size: "1.15rem",
42
+ weight: 700,
43
+ lineHeight: "1.3"
44
+ },
45
+ body: {
46
+ size: "1rem",
47
+ weight: 500,
48
+ lineHeight: "1.65"
49
+ },
50
+ small: {
51
+ size: "0.875rem",
52
+ weight: 500,
53
+ lineHeight: "1.45"
54
+ }
55
+ } },
56
+ radius: "0px",
57
+ layout: {
58
+ contentWidth: 860,
59
+ sidebarWidth: 300,
60
+ toc: {
61
+ enabled: true,
62
+ depth: 3,
63
+ style: "default"
64
+ },
65
+ header: {
66
+ height: 64,
67
+ sticky: true
68
+ }
69
+ },
70
+ sidebar: { style: "bordered" },
71
+ components: {
72
+ Callout: {
73
+ variant: "outline",
74
+ icon: true
75
+ },
76
+ CodeBlock: { showCopyButton: true },
77
+ HoverLink: {
78
+ linkLabel: "Open page",
79
+ showIndicator: true
80
+ },
81
+ Tabs: { style: "underline" }
82
+ }
83
+ };
84
+ const hardline = createTheme({
85
+ name: "hardline",
86
+ ui: HardlineUIDefaults
87
+ });
88
+
89
+ //#endregion
90
+ export { HardlineUIDefaults, hardline };
package/dist/index.d.mts CHANGED
@@ -1,7 +1,9 @@
1
+ import { ConcreteUIDefaults, concrete } from "./concrete/index.mjs";
1
2
  import { DefaultUIDefaults, fumadocs } from "./default/index.mjs";
2
3
  import { DocsCommandSearch } from "./docs-command-search.mjs";
3
4
  import { createDocsLayout, createDocsMetadata, createPageMetadata } from "./docs-layout.mjs";
4
5
  import { DocsPageClient } from "./docs-page-client.mjs";
6
+ import { HardlineUIDefaults, hardline } from "./hardline/index.mjs";
5
7
  import { RootProvider } from "./provider.mjs";
6
8
  import { DocsClientHooks } from "./docs-client-hooks.mjs";
7
9
  import { DocsFeedback, DocsFeedbackProps } from "./docs-feedback.mjs";
@@ -13,4 +15,4 @@ import { AIConfig, BreadcrumbConfig, CopyMarkdownConfig, DocsConfig, DocsFeedbac
13
15
  import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
14
16
  import { Tab, Tabs } from "fumadocs-ui/components/tabs";
15
17
  import { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre } from "fumadocs-ui/components/codeblock";
16
- export { type AIConfig, type BreadcrumbConfig, CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, type CopyMarkdownConfig, DocsBody, DocsClientHooks, DocsCommandSearch, type DocsConfig, DocsFeedback, type DocsFeedbackData, type DocsFeedbackProps, type DocsFeedbackValue, DocsLayout, type DocsMetadata, type DocsNav, DocsPage, DocsPageClient, type DocsTheme, type FeedbackConfig, type FontStyle, DefaultUIDefaults as FumadocsUIDefaults, HoverLink, type HoverLinkProps, type OGConfig, type OpenDocsConfig, type OpenDocsProvider, PageActions, type PageActionsConfig, type PageFrontmatter, Pre, RootProvider, type SidebarConfig, Tab, Tabs, type ThemeToggleConfig, type TypographyConfig, type UIConfig, createDocsLayout, createDocsMetadata, createPageMetadata, createTheme, deepMerge, defineDocs, extendTheme, fumadocs, withLangInUrl };
18
+ export { type AIConfig, type BreadcrumbConfig, CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, ConcreteUIDefaults, type CopyMarkdownConfig, DocsBody, DocsClientHooks, DocsCommandSearch, type DocsConfig, DocsFeedback, type DocsFeedbackData, type DocsFeedbackProps, type DocsFeedbackValue, DocsLayout, type DocsMetadata, type DocsNav, DocsPage, DocsPageClient, type DocsTheme, type FeedbackConfig, type FontStyle, DefaultUIDefaults as FumadocsUIDefaults, HardlineUIDefaults, HoverLink, type HoverLinkProps, type OGConfig, type OpenDocsConfig, type OpenDocsProvider, PageActions, type PageActionsConfig, type PageFrontmatter, Pre, RootProvider, type SidebarConfig, Tab, Tabs, type ThemeToggleConfig, type TypographyConfig, type UIConfig, concrete, createDocsLayout, createDocsMetadata, createPageMetadata, createTheme, deepMerge, defineDocs, extendTheme, fumadocs, hardline, withLangInUrl };
package/dist/index.mjs CHANGED
@@ -6,6 +6,8 @@ import { DocsCommandSearch } from "./docs-command-search.mjs";
6
6
  import { createDocsLayout, createDocsMetadata, createPageMetadata } from "./docs-layout.mjs";
7
7
  import { RootProvider } from "./provider.mjs";
8
8
  import { DefaultUIDefaults, fumadocs } from "./default/index.mjs";
9
+ import { ConcreteUIDefaults, concrete } from "./concrete/index.mjs";
10
+ import { HardlineUIDefaults, hardline } from "./hardline/index.mjs";
9
11
  import { DocsClientHooks } from "./docs-client-hooks.mjs";
10
12
  import { HoverLink } from "./hover-link.mjs";
11
13
  import { DocsLayout } from "fumadocs-ui/layouts/docs";
@@ -14,4 +16,4 @@ import { DocsBody, DocsPage } from "fumadocs-ui/layouts/docs/page";
14
16
  import { Tab, Tabs } from "fumadocs-ui/components/tabs";
15
17
  import { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre } from "fumadocs-ui/components/codeblock";
16
18
 
17
- export { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, DocsBody, DocsClientHooks, DocsCommandSearch, DocsFeedback, DocsLayout, DocsPage, DocsPageClient, DefaultUIDefaults as FumadocsUIDefaults, HoverLink, PageActions, Pre, RootProvider, Tab, Tabs, createDocsLayout, createDocsMetadata, createPageMetadata, createTheme, deepMerge, defineDocs, extendTheme, fumadocs, withLangInUrl };
19
+ export { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, ConcreteUIDefaults, DocsBody, DocsClientHooks, DocsCommandSearch, DocsFeedback, DocsLayout, DocsPage, DocsPageClient, DefaultUIDefaults as FumadocsUIDefaults, HardlineUIDefaults, HoverLink, PageActions, Pre, RootProvider, Tab, Tabs, concrete, createDocsLayout, createDocsMetadata, createPageMetadata, createTheme, deepMerge, defineDocs, extendTheme, fumadocs, hardline, withLangInUrl };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@farming-labs/theme",
3
- "version": "0.0.66",
3
+ "version": "0.0.71",
4
4
  "description": "Theme package for @farming-labs/docs — layout, provider, MDX components, and styles",
5
5
  "keywords": [
6
6
  "docs",
@@ -68,6 +68,16 @@
68
68
  "import": "./dist/greentree/index.mjs",
69
69
  "default": "./dist/greentree/index.mjs"
70
70
  },
71
+ "./hardline": {
72
+ "types": "./dist/hardline/index.d.mts",
73
+ "import": "./dist/hardline/index.mjs",
74
+ "default": "./dist/hardline/index.mjs"
75
+ },
76
+ "./concrete": {
77
+ "types": "./dist/concrete/index.d.mts",
78
+ "import": "./dist/concrete/index.mjs",
79
+ "default": "./dist/concrete/index.mjs"
80
+ },
71
81
  "./search": {
72
82
  "types": "./dist/search.d.mts",
73
83
  "import": "./dist/search.mjs",
@@ -97,6 +107,8 @@
97
107
  "./shiny/css": "./styles/shiny.css",
98
108
  "./darkbold/css": "./styles/darkbold.css",
99
109
  "./greentree/css": "./styles/greentree.css",
110
+ "./hardline/css": "./styles/hardline.css",
111
+ "./concrete/css": "./styles/concrete.css",
100
112
  "./presets/neutral": "./styles/presets/neutral.css",
101
113
  "./presets/black": "./styles/presets/black.css",
102
114
  "./presets/base": "./styles/presets/base.css"
@@ -115,7 +127,7 @@
115
127
  "tsdown": "^0.20.3",
116
128
  "typescript": "^5.9.3",
117
129
  "vitest": "^3.2.4",
118
- "@farming-labs/docs": "0.0.66"
130
+ "@farming-labs/docs": "0.0.71"
119
131
  },
120
132
  "peerDependencies": {
121
133
  "@farming-labs/docs": ">=0.0.1",
@@ -0,0 +1,363 @@
1
+ /* @farming-labs/theme - concrete theme CSS */
2
+ @import "./hardline.css";
3
+
4
+ :root {
5
+ --color-fd-primary: #ff5b31;
6
+ --color-fd-primary-foreground: #140f0c;
7
+ --color-fd-ring: #141210;
8
+
9
+ --color-fd-background: #f6ead9;
10
+ --color-fd-foreground: #15120f;
11
+ --color-fd-card: #fbf4ea;
12
+ --color-fd-card-foreground: #15120f;
13
+ --color-fd-popover: #fbf4ea;
14
+ --color-fd-popover-foreground: #15120f;
15
+ --color-fd-secondary: #eadcc9;
16
+ --color-fd-secondary-foreground: #15120f;
17
+ --color-fd-muted: #e2d0b9;
18
+ --color-fd-muted-foreground: #5b4e42;
19
+ --color-fd-accent: #245dff;
20
+ --color-fd-accent-foreground: #f8f5ef;
21
+ --color-fd-border: #141210;
22
+
23
+ --radius: 0px;
24
+ --fd-nav-height: 68px;
25
+ }
26
+
27
+ .dark {
28
+ --color-fd-primary: #ff744d;
29
+ --color-fd-primary-foreground: #180f0b;
30
+ --color-fd-ring: #ff744d;
31
+
32
+ --color-fd-background: #12100f;
33
+ --color-fd-foreground: #f6eee2;
34
+ --color-fd-card: #1a1614;
35
+ --color-fd-card-foreground: #f6eee2;
36
+ --color-fd-popover: #1a1614;
37
+ --color-fd-popover-foreground: #f6eee2;
38
+ --color-fd-secondary: #211b18;
39
+ --color-fd-secondary-foreground: #f6eee2;
40
+ --color-fd-muted: #2d2520;
41
+ --color-fd-muted-foreground: #c8b6a5;
42
+ --color-fd-accent: #7ba2ff;
43
+ --color-fd-accent-foreground: #101216;
44
+ --color-fd-border: rgba(246, 238, 226, 0.88);
45
+ }
46
+
47
+ #nd-docs-layout > header,
48
+ [role="banner"] {
49
+ background:
50
+ linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-background)), var(--color-fd-background));
51
+ }
52
+
53
+ aside a[data-active] {
54
+ text-transform: uppercase;
55
+ letter-spacing: 0.045em;
56
+ font-size: 0.79rem;
57
+ }
58
+
59
+ aside a[data-active="true"],
60
+ .fd-page-action-btn:hover,
61
+ .fd-page-action-btn[data-selected="true"],
62
+ .fd-page-action-btn[data-copied="true"],
63
+ .fd-feedback-choice:hover,
64
+ .fd-feedback-choice[data-selected="true"],
65
+ .fd-ai-tab[data-active="true"] {
66
+ box-shadow: 5px 5px 0 var(--color-fd-border);
67
+ transform: translate(-2px, -2px);
68
+ }
69
+
70
+ .dark aside a[data-active="true"],
71
+ .dark .fd-page-action-btn:hover,
72
+ .dark .fd-page-action-btn[data-selected="true"],
73
+ .dark .fd-page-action-btn[data-copied="true"],
74
+ .dark .fd-feedback-choice:hover,
75
+ .dark .fd-feedback-choice[data-selected="true"],
76
+ .dark .fd-ai-tab[data-active="true"] {
77
+ box-shadow: 5px 5px 0 color-mix(in srgb, var(--color-fd-primary) 55%, transparent);
78
+ }
79
+
80
+ .omni-item-active {
81
+ background: color-mix(in srgb, var(--color-fd-primary) 20%, var(--color-fd-card)) !important;
82
+ color: var(--color-fd-foreground) !important;
83
+ }
84
+
85
+ .omni-item-active .omni-item-icon,
86
+ .omni-item-active .omni-item-badge,
87
+ .omni-item-active .omni-item-ext,
88
+ .omni-item-active .omni-item-chevron {
89
+ color: var(--color-fd-foreground) !important;
90
+ }
91
+
92
+ .omni-item-active .omni-item-subtitle,
93
+ .omni-item-active .omni-item-shortcuts {
94
+ color: color-mix(in srgb, var(--color-fd-foreground) 78%, var(--color-fd-muted-foreground)) !important;
95
+ opacity: 1;
96
+ }
97
+
98
+ .dark .omni-item-active {
99
+ background: color-mix(in srgb, var(--color-fd-primary) 26%, var(--color-fd-card)) !important;
100
+ }
101
+
102
+ .fd-card,
103
+ [data-card],
104
+ [class*="fd-callout"],
105
+ .fd-page-action-menu,
106
+ .fd-page-action-btn,
107
+ .fd-docs-content pre,
108
+ .fd-docs-content .shiki,
109
+ .fd-docs-content [data-codeblock],
110
+ .fd-page-nav,
111
+ .fd-page-nav-card,
112
+ [class*="page-nav"] a {
113
+ box-shadow: 6px 6px 0 var(--color-fd-border);
114
+ }
115
+
116
+ .dark .fd-card,
117
+ .dark [data-card],
118
+ .dark [class*="fd-callout"],
119
+ .dark .fd-page-action-menu,
120
+ .dark .fd-page-action-btn,
121
+ .dark .fd-docs-content pre,
122
+ .dark .fd-docs-content .shiki,
123
+ .dark .fd-docs-content [data-codeblock],
124
+ .dark .fd-page-nav,
125
+ .dark .fd-page-nav-card,
126
+ .dark [class*="page-nav"] a {
127
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
128
+ }
129
+
130
+ .fd-docs-content h1,
131
+ .fd-docs-content h2 {
132
+ max-width: 14ch;
133
+ }
134
+
135
+ .fd-docs-content h1 {
136
+ letter-spacing: -0.055em;
137
+ }
138
+
139
+ .fd-docs-content h2 {
140
+ letter-spacing: -0.04em;
141
+ }
142
+
143
+ .fd-docs-content th {
144
+ background: var(--color-fd-foreground);
145
+ color: var(--color-fd-background);
146
+ }
147
+
148
+ .fd-docs-content :not(pre) > code {
149
+ background: color-mix(in srgb, var(--color-fd-primary) 22%, var(--color-fd-secondary));
150
+ }
151
+
152
+ .fd-hover-link-card {
153
+ box-shadow: 6px 6px 0 var(--color-fd-border);
154
+ }
155
+
156
+ .dark .fd-hover-link-card {
157
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
158
+ }
159
+
160
+ .fd-page-body .fd-table-wrapper,
161
+ .fd-docs-content table {
162
+ border: 3px solid var(--color-fd-border);
163
+ box-shadow: 6px 6px 0 var(--color-fd-border);
164
+ background: var(--color-fd-card);
165
+ }
166
+
167
+ .dark .fd-page-body .fd-table-wrapper,
168
+ .dark .fd-docs-content table {
169
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
170
+ }
171
+
172
+ .fd-docs-content th,
173
+ .fd-page-body th {
174
+ background: var(--color-fd-foreground);
175
+ color: var(--color-fd-background);
176
+ text-transform: uppercase;
177
+ letter-spacing: 0.08em;
178
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
179
+ font-size: 0.74rem;
180
+ }
181
+
182
+ .fd-docs-content td,
183
+ .fd-page-body td {
184
+ font-weight: 550;
185
+ }
186
+
187
+ .fd-docs-content tbody tr:nth-child(odd) td,
188
+ .fd-page-body tbody tr:nth-child(odd) td {
189
+ background: color-mix(in srgb, var(--color-fd-secondary) 72%, white 28%);
190
+ }
191
+
192
+ .dark .fd-docs-content tbody tr:nth-child(odd) td,
193
+ .dark .fd-page-body tbody tr:nth-child(odd) td {
194
+ background: color-mix(in srgb, var(--color-fd-secondary) 92%, black 8%);
195
+ }
196
+
197
+ .fd-docs-content tbody tr:hover td,
198
+ .fd-page-body tbody tr:hover td {
199
+ background: color-mix(in srgb, var(--color-fd-primary) 16%, var(--color-fd-card));
200
+ }
201
+
202
+ .fd-docs-content pre,
203
+ .fd-docs-content .shiki,
204
+ .fd-docs-content [data-codeblock],
205
+ .fd-docs-content .fd-codeblock,
206
+ .fd-ai-code-block {
207
+ border-width: 3px !important;
208
+ box-shadow: 6px 6px 0 var(--color-fd-border);
209
+ background:
210
+ linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 7%, var(--color-fd-card)) 0, var(--color-fd-card) 56px) !important;
211
+ }
212
+
213
+ .dark .fd-docs-content pre,
214
+ .dark .fd-docs-content .shiki,
215
+ .dark .fd-docs-content [data-codeblock],
216
+ .dark .fd-docs-content .fd-codeblock,
217
+ .dark .fd-ai-code-block {
218
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
219
+ background:
220
+ linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-card)) 0, var(--color-fd-card) 56px) !important;
221
+ }
222
+
223
+ .fd-codeblock-title {
224
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
225
+ text-transform: uppercase;
226
+ letter-spacing: 0.08em;
227
+ font-size: 0.72rem;
228
+ font-weight: 700;
229
+ padding-block: 0.8rem;
230
+ padding-inline: 1rem;
231
+ border-bottom: 3px solid var(--color-fd-border);
232
+ background: color-mix(in srgb, var(--color-fd-primary) 12%, var(--color-fd-card));
233
+ }
234
+
235
+ .fd-copy-btn,
236
+ .fd-ai-code-copy {
237
+ border: 2px solid var(--color-fd-border) !important;
238
+ border-radius: 0 !important;
239
+ background: var(--color-fd-background) !important;
240
+ color: var(--color-fd-foreground) !important;
241
+ box-shadow: 3px 3px 0 var(--color-fd-border);
242
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
243
+ font-size: 0.7rem;
244
+ letter-spacing: 0.06em;
245
+ text-transform: uppercase;
246
+ }
247
+
248
+ .fd-copy-btn:hover,
249
+ .fd-ai-code-copy:hover {
250
+ background: var(--color-fd-primary) !important;
251
+ color: var(--color-fd-primary-foreground) !important;
252
+ transform: translate(-1px, -1px);
253
+ }
254
+
255
+ .fd-tabs {
256
+ border: 3px solid var(--color-fd-border);
257
+ box-shadow: 6px 6px 0 var(--color-fd-border);
258
+ background: var(--color-fd-card);
259
+ }
260
+
261
+ .dark .fd-tabs {
262
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
263
+ }
264
+
265
+ .fd-tabs-list {
266
+ border-bottom: 3px solid var(--color-fd-border);
267
+ background: var(--color-fd-foreground);
268
+ }
269
+
270
+ .fd-tab-trigger {
271
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
272
+ text-transform: uppercase;
273
+ letter-spacing: 0.08em;
274
+ font-size: 0.72rem;
275
+ color: color-mix(in srgb, var(--color-fd-background) 82%, transparent);
276
+ border-bottom-width: 0;
277
+ }
278
+
279
+ .fd-tab-trigger:hover {
280
+ color: var(--color-fd-background);
281
+ background: color-mix(in srgb, var(--color-fd-primary) 18%, transparent);
282
+ }
283
+
284
+ .fd-tab-trigger.fd-tab-active {
285
+ color: var(--color-fd-primary-foreground);
286
+ background: var(--color-fd-primary);
287
+ box-shadow: inset -3px 0 0 var(--color-fd-border);
288
+ }
289
+
290
+ .fd-callout,
291
+ [class*="fd-callout"] {
292
+ border-width: 3px !important;
293
+ box-shadow: 6px 6px 0 var(--color-fd-border);
294
+ background: color-mix(in srgb, var(--color-fd-secondary) 82%, white 18%);
295
+ }
296
+
297
+ .dark .fd-callout,
298
+ .dark [class*="fd-callout"] {
299
+ box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
300
+ background: color-mix(in srgb, var(--color-fd-secondary) 92%, black 8%);
301
+ }
302
+
303
+ .fd-callout-indicator {
304
+ width: 10px;
305
+ }
306
+
307
+ .fd-callout-title {
308
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
309
+ text-transform: uppercase;
310
+ letter-spacing: 0.08em;
311
+ font-size: 0.72rem;
312
+ }
313
+
314
+ .fd-page-nav,
315
+ .fd-page-nav-card,
316
+ [class*="page-nav"] a,
317
+ .fd-hover-link-card,
318
+ .fd-page-action-menu,
319
+ .fd-ai-dialog,
320
+ .fd-ai-input-wrap,
321
+ .fd-ai-model-dropdown-menu,
322
+ .fd-ai-fm-topbar,
323
+ .fd-ai-fm-input-container,
324
+ .fd-feedback {
325
+ border-width: 3px !important;
326
+ }
327
+
328
+ .fd-page-nav-card:hover,
329
+ [class*="page-nav"] a:hover {
330
+ transform: translate(-2px, -2px);
331
+ }
332
+
333
+ .fd-hover-link-card {
334
+ background:
335
+ linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-card)) 0, var(--color-fd-card) 52px);
336
+ }
337
+
338
+ .fd-hover-link-title,
339
+ .fd-hover-link-description + a {
340
+ text-transform: uppercase;
341
+ letter-spacing: 0.04em;
342
+ }
343
+
344
+ .fd-toc-link,
345
+ .fd-toc-clerk .fd-toc-link {
346
+ font-family: var(--fd-font-mono, ui-monospace, monospace);
347
+ text-transform: uppercase;
348
+ letter-spacing: 0.05em;
349
+ font-size: 0.7rem;
350
+ border-left: 2px solid transparent;
351
+ padding-left: 0.75rem;
352
+ }
353
+
354
+ .fd-toc-link:hover,
355
+ .fd-toc-clerk .fd-toc-link:hover {
356
+ border-left-color: var(--color-fd-border);
357
+ background: color-mix(in srgb, var(--color-fd-primary) 12%, transparent);
358
+ }
359
+
360
+ .fd-toc-link-active,
361
+ .fd-toc-clerk .fd-toc-link[data-active="true"] {
362
+ border-left-color: var(--color-fd-primary);
363
+ }
@@ -0,0 +1,557 @@
1
+ /* @farming-labs/theme - hardline theme CSS */
2
+ @import "./presets/neutral.css";
3
+
4
+ :root {
5
+ --color-fd-primary: #ffd335;
6
+ --color-fd-primary-foreground: #121212;
7
+ --color-fd-ring: #121212;
8
+
9
+ --color-fd-background: #f2efe8;
10
+ --color-fd-foreground: #111111;
11
+ --color-fd-card: #f7f4ed;
12
+ --color-fd-card-foreground: #111111;
13
+ --color-fd-popover: #f7f4ed;
14
+ --color-fd-popover-foreground: #111111;
15
+ --color-fd-secondary: #ece7de;
16
+ --color-fd-secondary-foreground: #111111;
17
+ --color-fd-muted: #e5dfd3;
18
+ --color-fd-muted-foreground: #47423a;
19
+ --color-fd-accent: #ffe16e;
20
+ --color-fd-accent-foreground: #111111;
21
+ --color-fd-border: #111111;
22
+
23
+ --radius: 0px;
24
+ --fd-nav-height: 64px;
25
+ }
26
+
27
+ .dark {
28
+ --color-fd-primary: #ffcf3a;
29
+ --color-fd-primary-foreground: #101010;
30
+ --color-fd-ring: #ffcf3a;
31
+
32
+ --color-fd-background: #0f0f10;
33
+ --color-fd-foreground: #f4f1e8;
34
+ --color-fd-card: #171718;
35
+ --color-fd-card-foreground: #f4f1e8;
36
+ --color-fd-popover: #171718;
37
+ --color-fd-popover-foreground: #f4f1e8;
38
+ --color-fd-secondary: #1e1e20;
39
+ --color-fd-secondary-foreground: #f4f1e8;
40
+ --color-fd-muted: #242427;
41
+ --color-fd-muted-foreground: #b8b09f;
42
+ --color-fd-accent: #2d2612;
43
+ --color-fd-accent-foreground: #ffcf3a;
44
+ --color-fd-border: rgba(213, 204, 185, 0.82);
45
+ }
46
+
47
+ * {
48
+ scrollbar-width: auto;
49
+ }
50
+
51
+ ::selection {
52
+ background: var(--color-fd-primary);
53
+ color: var(--color-fd-primary-foreground);
54
+ }
55
+
56
+ /* Hard-edge layout baseline */
57
+ #nd-docs-layout [class*="rounded-"],
58
+ #nd-docs-layout [style*="border-radius"],
59
+ #nd-docs-layout code:not(pre code) {
60
+ border-radius: 0 !important;
61
+ }
62
+
63
+ #nd-docs-layout [class*="shadow-"] {
64
+ box-shadow: none !important;
65
+ }
66
+
67
+ /* Header and sidebar structure */
68
+ #nd-docs-layout > header,
69
+ [role="banner"] {
70
+ border-bottom: 2px solid var(--color-fd-border);
71
+ background: var(--color-fd-background);
72
+ }
73
+
74
+ aside#nd-sidebar,
75
+ #nd-docs-layout aside {
76
+ background: var(--color-fd-background);
77
+ border-right: 2px solid var(--color-fd-border);
78
+ }
79
+
80
+ /* Sidebar links and categories */
81
+ aside a[data-active] {
82
+ font-weight: 600;
83
+ font-size: 0.92rem;
84
+ letter-spacing: 0.01em;
85
+ padding: 0.5rem 0.625rem;
86
+ border: 1px solid transparent;
87
+ color: var(--color-fd-foreground);
88
+ }
89
+
90
+ aside a[data-active]:hover {
91
+ border-color: var(--color-fd-border);
92
+ background: color-mix(in srgb, var(--color-fd-primary) 24%, transparent);
93
+ }
94
+
95
+ aside a[data-active="true"] {
96
+ font-weight: 800;
97
+ background: var(--color-fd-primary);
98
+ color: var(--color-fd-primary-foreground);
99
+ border-color: var(--color-fd-border);
100
+ }
101
+
102
+ aside a[data-active="true"]::before {
103
+ display: none !important;
104
+ }
105
+
106
+ aside button.text-fd-muted-foreground {
107
+ font-size: 0.83rem;
108
+ font-weight: 800;
109
+ letter-spacing: 0.06em;
110
+ text-transform: uppercase;
111
+ color: var(--color-fd-muted-foreground);
112
+ }
113
+
114
+ /* Search/action inputs in sidebar */
115
+ aside button[class*="bg-fd-secondary"] {
116
+ border: 2px solid var(--color-fd-border);
117
+ background: var(--color-fd-card);
118
+ font-weight: 600;
119
+ }
120
+
121
+ .dark aside a[data-active]:hover {
122
+ background: color-mix(in srgb, var(--color-fd-primary) 16%, transparent);
123
+ }
124
+
125
+ .dark aside button[class*="bg-fd-secondary"] {
126
+ background: #151516;
127
+ }
128
+
129
+ /* Search UI (sidebar + command palette) */
130
+ .fd-sidebar-search-ai-row {
131
+ display: flex;
132
+ gap: 8px;
133
+ align-items: stretch;
134
+ width: 100%;
135
+ }
136
+
137
+ .fd-sidebar-search-ai-row > .fd-sidebar-search-btn,
138
+ .fd-sidebar-search-btn {
139
+ flex: 1;
140
+ min-width: 0;
141
+ display: flex;
142
+ align-items: center;
143
+ gap: 8px;
144
+ padding: 8px 10px;
145
+ border: 2px solid var(--color-fd-border) !important;
146
+ border-radius: 0 !important;
147
+ background: var(--color-fd-card) !important;
148
+ color: var(--color-fd-foreground) !important;
149
+ font-weight: 600;
150
+ }
151
+
152
+ .fd-sidebar-search-ai-row > .fd-sidebar-search-btn:hover,
153
+ .fd-sidebar-search-btn:hover {
154
+ background: color-mix(in srgb, var(--color-fd-primary) 18%, var(--color-fd-card)) !important;
155
+ }
156
+
157
+ .fd-sidebar-search-kbd {
158
+ margin-left: auto;
159
+ display: flex;
160
+ gap: 3px;
161
+ }
162
+
163
+ .fd-sidebar-search-kbd kbd {
164
+ border: 1px solid var(--color-fd-border);
165
+ border-radius: 0 !important;
166
+ background: var(--color-fd-secondary);
167
+ color: var(--color-fd-muted-foreground);
168
+ padding: 1px 4px;
169
+ font-size: 0.68rem;
170
+ }
171
+
172
+ .fd-sidebar-search-ai-row > .fd-sidebar-ai-btn,
173
+ .fd-sidebar-ai-btn {
174
+ width: 38px;
175
+ min-width: 38px;
176
+ display: inline-flex;
177
+ align-items: center;
178
+ justify-content: center;
179
+ border: 2px solid var(--color-fd-border) !important;
180
+ border-radius: 0 !important;
181
+ background: var(--color-fd-card) !important;
182
+ color: var(--color-fd-foreground) !important;
183
+ }
184
+
185
+ .fd-sidebar-search-ai-row > .fd-sidebar-ai-btn:hover,
186
+ .fd-sidebar-ai-btn:hover {
187
+ background: var(--color-fd-primary) !important;
188
+ color: var(--color-fd-primary-foreground) !important;
189
+ }
190
+
191
+ .omni-content {
192
+ border-radius: 0 !important;
193
+ border: 2px solid var(--color-fd-border) !important;
194
+ background: var(--color-fd-popover);
195
+ box-shadow: 6px 6px 0 var(--color-fd-border);
196
+ }
197
+
198
+ .omni-header {
199
+ border-bottom: 2px solid var(--color-fd-border) !important;
200
+ }
201
+
202
+ .omni-search-row {
203
+ gap: 0.625rem;
204
+ padding: 0.625rem 0.75rem;
205
+ }
206
+
207
+ .omni-search-input {
208
+ font-weight: 600;
209
+ }
210
+
211
+ .omni-search-input:focus {
212
+ caret-color: var(--color-fd-primary);
213
+ }
214
+
215
+ .omni-kbd,
216
+ .omni-kbd-sm,
217
+ .omni-close-btn {
218
+ border-radius: 0 !important;
219
+ }
220
+
221
+ .omni-kbd,
222
+ .omni-kbd-sm {
223
+ border: 1px solid var(--color-fd-border);
224
+ background: var(--color-fd-secondary);
225
+ }
226
+
227
+ .omni-close-btn:hover {
228
+ background: var(--color-fd-primary);
229
+ color: var(--color-fd-primary-foreground);
230
+ }
231
+
232
+ .omni-item {
233
+ border-radius: 0 !important;
234
+ border: 1px solid transparent;
235
+ font-weight: 600;
236
+ }
237
+
238
+ .omni-item:hover,
239
+ .omni-item-active {
240
+ border-color: var(--color-fd-border);
241
+ background: color-mix(in srgb, var(--color-fd-primary) 16%, transparent);
242
+ }
243
+
244
+ .omni-highlight {
245
+ border-radius: 0 !important;
246
+ background: color-mix(in srgb, var(--color-fd-primary) 36%, transparent);
247
+ }
248
+
249
+ /* Top-level content width and spacing */
250
+ @media (min-width: 1024px) {
251
+ #nd-docs-layout article#nd-page {
252
+ max-width: none;
253
+ }
254
+
255
+ #nd-docs-layout article#nd-page > .prose {
256
+ max-width: none;
257
+ }
258
+ }
259
+
260
+ /* Typography */
261
+ .fd-docs-content h1,
262
+ .fd-docs-content h2,
263
+ .fd-docs-content h3,
264
+ .fd-docs-content h4 {
265
+ text-transform: uppercase;
266
+ letter-spacing: 0.01em;
267
+ }
268
+
269
+ .fd-docs-content h1 {
270
+ font-weight: 900;
271
+ }
272
+
273
+ .fd-docs-content p {
274
+ font-weight: 500;
275
+ }
276
+
277
+ .fd-docs-content a:not(.fd-page-nav-card):not([class]) {
278
+ color: inherit;
279
+ text-decoration: underline;
280
+ text-decoration-thickness: 2px;
281
+ text-underline-offset: 3px;
282
+ text-decoration-color: var(--color-fd-primary);
283
+ }
284
+
285
+ /* Cards, callouts, tabs, and generic surfaces */
286
+ .fd-card,
287
+ [data-card],
288
+ [class*="fd-callout"],
289
+ .fd-page-action-menu,
290
+ .fd-page-action-btn {
291
+ border: 2px solid var(--color-fd-border) !important;
292
+ background: var(--color-fd-card);
293
+ box-shadow: 4px 4px 0 var(--color-fd-border);
294
+ }
295
+
296
+ .dark .fd-card,
297
+ .dark [data-card],
298
+ .dark [class*="fd-callout"],
299
+ .dark .fd-page-action-menu,
300
+ .dark .fd-page-action-btn {
301
+ box-shadow: 4px 4px 0 color-mix(in srgb, var(--color-fd-primary) 40%, transparent);
302
+ }
303
+
304
+ /* Page actions: hardline hard edges */
305
+ .fd-page-action-btn,
306
+ .fd-page-action-menu,
307
+ .fd-page-action-menu-item,
308
+ .fd-page-action-dropdown {
309
+ border-radius: 0 !important;
310
+ }
311
+
312
+ .fd-page-action-btn {
313
+ border: 2px solid var(--color-fd-border) !important;
314
+ background: var(--color-fd-card) !important;
315
+ color: var(--color-fd-foreground) !important;
316
+ font-weight: 700;
317
+ letter-spacing: 0.01em;
318
+ }
319
+
320
+ .fd-page-action-btn:hover,
321
+ .fd-page-action-btn[data-selected="true"],
322
+ .fd-page-action-btn[data-copied="true"] {
323
+ background: var(--color-fd-primary) !important;
324
+ color: var(--color-fd-primary-foreground) !important;
325
+ border-color: var(--color-fd-border) !important;
326
+ }
327
+
328
+ .fd-page-action-btn svg,
329
+ .fd-page-action-btn[data-selected="true"] svg,
330
+ .fd-page-action-btn[data-copied="true"] svg {
331
+ color: currentColor;
332
+ }
333
+
334
+ .fd-page-action-menu {
335
+ border: 2px solid var(--color-fd-border);
336
+ padding: 0.35rem;
337
+ }
338
+
339
+ .fd-page-action-menu-item {
340
+ border: 1px solid transparent;
341
+ font-weight: 600;
342
+ }
343
+
344
+ .fd-page-action-menu-item:hover {
345
+ border-color: var(--color-fd-border);
346
+ background: color-mix(in srgb, var(--color-fd-primary) 20%, transparent);
347
+ }
348
+
349
+ .fd-docs-content :not(pre) > code {
350
+ border: 2px solid var(--color-fd-border);
351
+ background: var(--color-fd-secondary);
352
+ padding: 1px 6px;
353
+ font-weight: 700;
354
+ }
355
+
356
+ .fd-docs-content pre,
357
+ .fd-docs-content .shiki,
358
+ .fd-docs-content [data-codeblock] {
359
+ border: 2px solid var(--color-fd-border) !important;
360
+ background: var(--color-fd-card) !important;
361
+ }
362
+
363
+ .dark .fd-docs-content pre,
364
+ .dark .fd-docs-content .shiki,
365
+ .dark .fd-docs-content [data-codeblock] {
366
+ background: #121214 !important;
367
+ }
368
+
369
+ .fd-docs-content table {
370
+ border-collapse: collapse;
371
+ border: 2px solid var(--color-fd-border);
372
+ width: 100%;
373
+ background: var(--color-fd-card);
374
+ }
375
+
376
+ .fd-docs-content th,
377
+ .fd-docs-content td {
378
+ border: 2px solid var(--color-fd-border);
379
+ padding: 0.7rem 0.85rem;
380
+ }
381
+
382
+ .fd-docs-content th {
383
+ text-transform: uppercase;
384
+ letter-spacing: 0.05em;
385
+ font-size: 0.78rem;
386
+ background: var(--color-fd-primary);
387
+ color: var(--color-fd-primary-foreground);
388
+ }
389
+
390
+ .fd-docs-content tbody tr:nth-child(even) td {
391
+ background: color-mix(in srgb, var(--color-fd-secondary) 85%, transparent);
392
+ }
393
+
394
+ .dark .fd-docs-content tbody tr:nth-child(even) td {
395
+ background: #1a1a1d;
396
+ }
397
+
398
+ /* Prev/next cards */
399
+ .fd-page-nav,
400
+ .fd-page-nav-card,
401
+ [class*="page-nav"] a {
402
+ border: 2px solid var(--color-fd-border);
403
+ background: var(--color-fd-card);
404
+ box-shadow: 4px 4px 0 var(--color-fd-border);
405
+ border-radius: 0 !important;
406
+ }
407
+
408
+ .fd-page-nav-card:hover,
409
+ [class*="page-nav"] a:hover {
410
+ background: color-mix(in srgb, var(--color-fd-primary) 18%, var(--color-fd-card));
411
+ }
412
+
413
+ .fd-page-nav-card [class*="text-"] {
414
+ text-transform: uppercase;
415
+ letter-spacing: 0.03em;
416
+ }
417
+
418
+ .dark .fd-page-nav,
419
+ .dark .fd-page-nav-card,
420
+ .dark [class*="page-nav"] a {
421
+ box-shadow: 4px 4px 0 color-mix(in srgb, var(--color-fd-primary) 35%, transparent);
422
+ }
423
+
424
+ /* Ask AI and feedback - hardline treatment */
425
+ .fd-ai-dialog,
426
+ .fd-ai-tab,
427
+ .fd-ai-input-wrap,
428
+ .fd-ai-send-btn,
429
+ .fd-ai-close-btn,
430
+ .fd-ai-clear-btn,
431
+ .fd-ai-floating-btn,
432
+ .fd-ai-suggestion,
433
+ .fd-ai-result,
434
+ .fd-ai-model-dropdown-btn,
435
+ .fd-ai-model-dropdown-menu,
436
+ .fd-ai-model-dropdown-item,
437
+ .fd-ai-fm-input-container,
438
+ .fd-ai-fm-send-btn,
439
+ .fd-ai-fm-suggestion,
440
+ .fd-ai-fm-trigger-btn,
441
+ .fd-ai-fm-close-btn,
442
+ .fd-ai-code-block,
443
+ .fd-ai-code-copy,
444
+ .fd-feedback-input,
445
+ .fd-feedback-submit,
446
+ .fd-feedback-choice {
447
+ border-radius: 0 !important;
448
+ }
449
+
450
+ .fd-ai-dialog,
451
+ .fd-ai-input-wrap,
452
+ .fd-ai-model-dropdown-menu,
453
+ .fd-ai-fm-topbar,
454
+ .fd-ai-fm-input-container,
455
+ .fd-ai-code-block {
456
+ border: 2px solid var(--color-fd-border) !important;
457
+ background: var(--color-fd-card) !important;
458
+ box-shadow: 4px 4px 0 var(--color-fd-border);
459
+ }
460
+
461
+ .dark .fd-ai-dialog,
462
+ .dark .fd-ai-input-wrap,
463
+ .dark .fd-ai-model-dropdown-menu,
464
+ .dark .fd-ai-fm-topbar,
465
+ .dark .fd-ai-fm-input-container,
466
+ .dark .fd-ai-code-block {
467
+ box-shadow: 4px 4px 0 color-mix(in srgb, var(--color-fd-primary) 35%, transparent);
468
+ }
469
+
470
+ .fd-ai-send-btn,
471
+ .fd-ai-close-btn,
472
+ .fd-ai-clear-btn,
473
+ .fd-ai-floating-btn,
474
+ .fd-ai-model-dropdown-btn,
475
+ .fd-ai-fm-send-btn,
476
+ .fd-ai-fm-trigger-btn,
477
+ .fd-ai-fm-close-btn,
478
+ .fd-feedback-submit,
479
+ .fd-feedback-choice {
480
+ border: 2px solid var(--color-fd-border) !important;
481
+ background: var(--color-fd-secondary) !important;
482
+ color: var(--color-fd-foreground) !important;
483
+ font-weight: 700;
484
+ }
485
+
486
+ .fd-ai-send-btn:hover,
487
+ .fd-ai-clear-btn:hover,
488
+ .fd-ai-floating-btn:hover,
489
+ .fd-ai-model-dropdown-btn:hover,
490
+ .fd-ai-fm-send-btn:hover,
491
+ .fd-ai-fm-trigger-btn:hover,
492
+ .fd-feedback-submit:hover,
493
+ .fd-feedback-choice:hover,
494
+ .fd-feedback-choice[data-selected="true"] {
495
+ background: var(--color-fd-primary) !important;
496
+ color: var(--color-fd-primary-foreground) !important;
497
+ }
498
+
499
+ .fd-ai-tab {
500
+ border: 2px solid transparent;
501
+ font-weight: 700;
502
+ text-transform: uppercase;
503
+ letter-spacing: 0.04em;
504
+ }
505
+
506
+ .fd-ai-tab[data-active="true"] {
507
+ border-color: var(--color-fd-border);
508
+ background: var(--color-fd-primary);
509
+ color: var(--color-fd-primary-foreground);
510
+ }
511
+
512
+ .fd-ai-bubble-user,
513
+ .fd-ai-bubble-ai {
514
+ border: 2px solid var(--color-fd-border);
515
+ border-radius: 0 !important;
516
+ }
517
+
518
+ .fd-ai-bubble-user {
519
+ background: var(--color-fd-primary);
520
+ color: var(--color-fd-primary-foreground);
521
+ }
522
+
523
+ .fd-ai-bubble-ai {
524
+ background: var(--color-fd-card);
525
+ color: var(--color-fd-card-foreground);
526
+ }
527
+
528
+ .fd-ai-bubble-ai table,
529
+ .fd-ai-fm-msg-content table {
530
+ border-collapse: collapse;
531
+ border: 2px solid var(--color-fd-border);
532
+ }
533
+
534
+ .fd-ai-bubble-ai th,
535
+ .fd-ai-bubble-ai td,
536
+ .fd-ai-fm-msg-content th,
537
+ .fd-ai-fm-msg-content td {
538
+ border: 2px solid var(--color-fd-border);
539
+ }
540
+
541
+ /* API reference panels */
542
+ [data-api-reference] [class*="border"],
543
+ [class*="fd-api"] [class*="border"] {
544
+ border-color: var(--color-fd-border) !important;
545
+ }
546
+
547
+ [class*="fd-api"] button,
548
+ [class*="fd-api"] [role="tab"] {
549
+ border-radius: 0 !important;
550
+ border: 2px solid transparent;
551
+ }
552
+
553
+ [class*="fd-api"] [role="tab"][data-state="active"] {
554
+ border-color: var(--color-fd-border);
555
+ background: var(--color-fd-primary);
556
+ color: var(--color-fd-primary-foreground);
557
+ }