hanzoai/docs
2
0
Fork 0
mirror of https://github.com/hanzo-docs/docs.git synced 2026-10-25 04:20:02 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UI: Change --fd-layout-width to 1600px by default

Browse Source
This commit is contained in:
Fuma Nama
2025-10-08 20:55:59 +08:00
parent 1494340703
commit 0ed0ca6922
13 changed files with 67 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/lazy-coats-beg.md
+13
View File
@@ -0,0 +1,13 @@
---
'fumadocs-ui': major
---
**Change `--fd-layout-width` to `1600px` by default**
This will change the max layout width to `1600px`, you can still change it back with:
```css
:root {
--fd-layout-width: 100vw;
}
```
apps/docs/components/ai/search.tsx
+2 -2
View File
@@ -294,7 +294,7 @@ export function AISearchTrigger() {
<Presence present={open}>
<div
className={cn(
'fixed inset-0 p-2 right-(--removed-body-scroll-bar-size,0) flex flex-col pb-[8.375rem] items-center bg-fd-background/80 backdrop-blur-sm z-50',
'fixed inset-0 p-2 right-(--removed-body-scroll-bar-size,0) flex flex-col pb-[8.375rem] items-center bg-fd-background/80 backdrop-blur-sm z-30',
open ? 'animate-fd-fade-in' : 'animate-fd-fade-out',
)}
onClick={(e) => {
@@ -342,7 +342,7 @@ export function AISearchTrigger() {
</Presence>
<div
className={cn(
'fixed bottom-2 transition-[width,height] duration-300 ease-[cubic-bezier(0.34,1.56,0.64,1)] -translate-x-1/2 rounded-2xl border shadow-xl z-50 overflow-hidden',
'fixed bottom-2 transition-[width,height] duration-300 ease-[cubic-bezier(0.34,1.56,0.64,1)] -translate-x-1/2 rounded-2xl border shadow-xl overflow-hidden z-30',
open
? 'w-[min(600px,90vw)] bg-fd-popover h-32'
: 'w-40 h-10 bg-fd-secondary text-fd-secondary-foreground shadow-fd-background',
packages/ui/css/black.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: hsl(0, 0%, 98%);
--color-fd-foreground: hsl(0, 0%, 3.9%);
packages/ui/css/catppuccin.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-popover: hsl(220, 22%, 92%);
--color-fd-popover-foreground: hsl(234, 16%, 35%);
packages/ui/css/default.css
+33
View File
@@ -0,0 +1,33 @@
/**
The default theme of Fumadocs
*/
@theme {
--color-fd-background: transparent;
--color-fd-foreground: transparent;
--color-fd-muted: transparent;
--color-fd-muted-foreground: transparent;
--color-fd-popover: transparent;
--color-fd-popover-foreground: transparent;
--color-fd-card: transparent;
--color-fd-card-foreground: transparent;
--color-fd-border: transparent;
--color-fd-primary: transparent;
--color-fd-primary-foreground: transparent;
--color-fd-secondary: transparent;
--color-fd-secondary-foreground: transparent;
--color-fd-accent: transparent;
--color-fd-accent-foreground: transparent;
--color-fd-ring: transparent;
--color-fd-overlay: transparent;
}
@theme static {
--color-fd-info: oklch(62.3% 0.214 259.815);
--color-fd-warning: oklch(76.9% 0.188 70.08);
--color-fd-error: oklch(63.7% 0.237 25.331);
--color-fd-success: oklch(72.3% 0.219 149.579);
--color-fd-diff-remove: rgba(200, 10, 100, 0.12);
--color-fd-diff-remove-symbol: rgb(230, 10, 100);
--color-fd-diff-add: rgba(14, 180, 100, 0.1);
--color-fd-diff-add-symbol: rgb(10, 200, 100);
}
packages/ui/css/dusk.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: hsl(250, 20%, 92%);
--color-fd-primary: hsl(340, 40%, 48%);
packages/ui/css/neutral.css
+3
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: hsl(0, 0%, 96%);
--color-fd-foreground: hsl(0, 0%, 3.9%);
@@ -34,6 +36,7 @@
--color-fd-accent: hsla(0, 0%, 40.9%, 30%);
--color-fd-accent-foreground: hsl(0, 0%, 90%);
--color-fd-ring: hsl(0, 0%, 54.9%);
--color-fd-overlay: hsla(0, 0%, 0%, 0.2);
}
.dark #nd-sidebar {
packages/ui/css/ocean.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: hsl(0, 0%, 98%);
--color-fd-foreground: hsl(0, 0%, 3.9%);
packages/ui/css/preset.css
+1 -14
View File
@@ -3,13 +3,6 @@
@source '../dist/**/*.js';
@plugin '../dist/theme/typography/index.js';
@theme static {
--color-fd-info: oklch(62.3% 0.214 259.815);
--color-fd-warning: oklch(76.9% 0.188 70.08);
--color-fd-error: oklch(63.7% 0.237 25.331);
--color-fd-success: oklch(72.3% 0.219 149.579);
}
[dir='rtl'] {
--fd-sidebar-mobile-offset: -100%;
}
@@ -20,16 +13,10 @@
--fd-page-width: 1200px;
--fd-sidebar-width: 0px;
--fd-toc-width: 0px;
--fd-layout-width: 100vw;
--fd-layout-width: 1600px;
--fd-banner-height: 0px;
--fd-nav-height: 0px;
--fd-tocnav-height: 0px;
--color-fd-diff-remove: rgba(200, 10, 100, 0.12);
--color-fd-diff-remove-symbol: rgb(230, 10, 100);
--color-fd-diff-add: rgba(14, 180, 100, 0.1);
--color-fd-diff-add-symbol: rgb(10, 200, 100);
--animate-fd-fade-in: fd-fade-in 300ms ease;
--animate-fd-fade-out: fd-fade-out 300ms ease;
packages/ui/css/purple.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: hsl(256, 100%, 96%);
--color-fd-primary: hsl(270, 100%, 52%);
packages/ui/css/shadcn.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-background: var(--background);
--color-fd-foreground: var(--foreground);
packages/ui/css/vitepress.css
+2
View File
@@ -1,3 +1,5 @@
@import './default.css';
@theme {
--color-fd-muted: hsl(0, 0%, 96.1%);
--color-fd-popover: hsl(0, 0%, 100%);
packages/ui/src/components/dialog/search.tsx
+1 -1
View File
@@ -173,7 +173,7 @@ export function SearchDialogOverlay(
<DialogOverlay
{...props}
className={cn(
'fixed inset-0 z-50 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out',
'fixed inset-0 z-50 backdrop-blur-xs bg-fd-overlay data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out',
props.className,
)}
/>