Skip to content

Commit 36753e8

Browse files
committed
fix: improve dark mode
1 parent a25cfd2 commit 36753e8

7 files changed

Lines changed: 16 additions & 14 deletions

File tree

src/app/builder/layout.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { ThemeProvider } from "next-themes";
2+
3+
export default function BuilderLayout({
4+
children,
5+
}: Readonly<{ children: React.ReactNode }>) {
6+
return (
7+
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
8+
{children}
9+
</ThemeProvider>
10+
);
11+
}

src/app/builder/page.tsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ import { useForm } from "react-hook-form";
2525
import { cn, getGridRows, updateColSpans } from "@/lib/utils";
2626
import { useSearchParams } from "next/navigation";
2727
import { useAuthState } from "@/hooks/use-auth";
28-
import { ThemeProvider } from "next-themes";
2928

3029
export default function FormBuilderPage() {
3130
const isMobile = useIsMobile();
@@ -258,7 +257,6 @@ export default function FormBuilderPage() {
258257
}
259258

260259
return (
261-
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
262260
<div>
263261
<FormBuilderHeader />
264262
{isMobile ? (
@@ -316,6 +314,5 @@ export default function FormBuilderPage() {
316314
onOpenChange={setShowWelcomeDialog}
317315
/>
318316
</div>
319-
</ThemeProvider>
320317
);
321318
}

src/app/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ export default function RootLayout({
5959
}: Readonly<{ children: React.ReactNode }>) {
6060
return (
6161
<ClerkProvider>
62-
<html lang="en">
62+
<html lang="en" suppressHydrationWarning>
6363
<body className={cn(fontVariables, "font-sans")}>
6464
<ConvexClientProvider>
6565
<PostHogProvider>

src/components/form-builder/canvas/sortable-row.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -181,7 +181,7 @@ export const RowColumn = ({ component, index, form }: SortableRowProps) => {
181181
{mode === "editor" && (
182182
<span
183183
className={cn(
184-
"absolute -top-6.5 -left-1.75 py-0.5 px-1 text-xs opacity-0 bg-primary text-white",
184+
"absolute -top-6.5 -left-1.75 py-0.5 px-1 text-xs opacity-0 bg-primary text-accent",
185185
component.id === selectedComponent?.id && "opacity-100"
186186
)}
187187
>
@@ -194,15 +194,15 @@ export const RowColumn = ({ component, index, form }: SortableRowProps) => {
194194
variant="link"
195195
size="icon"
196196
className={cn(
197-
"h-4 w-4 absolute -right-1.75 -top-5.5 m-0! hover:bg-primary/50 group-hover/component:opacity-100 opacity-0 cursor-pointer bg-primary text-white rounded-none",
197+
"h-4 w-4 absolute -right-1.75 -top-5.5 m-0! hover:bg-primary/50 group-hover/component:opacity-100 opacity-0 cursor-pointer bg-primary text-accent rounded-none",
198198
component.id === selectedComponent?.id && "opacity-100"
199199
)}
200200
onClick={(e) => {
201201
e.stopPropagation();
202202
handleDelete(component.id);
203203
}}
204204
>
205-
<Icons.Trash2Icon className="size-3" />
205+
<Icons.X className="size-3" />
206206
</Button>
207207

208208
<RenderEditorComponent

src/components/form-builder/dialogs/icon-picker-dialog.tsx

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -193,11 +193,6 @@ export function IconPickerDialog({
193193
setOpen={setOpen}
194194
selectedIcon={selectedIcon}
195195
/>
196-
<div
197-
className={cn(
198-
"absolute inset-x-0 bottom-0 h-12 z-10 bg-gradient-from-transparent bg-gradient-to-t from-popover to-transparent"
199-
)}
200-
/>
201196
</Suspense>
202197
</DialogContent>
203198
</Dialog>

src/components/form-builder/dialogs/save-form-dialog.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,7 @@ export function SaveFormDialog({ children, forceSave }: SaveFormDialogProps) {
204204
<div className="border rounded-lg p-4 bg-background">
205205
<GenerateCanvasGrid components={previewComponents} />
206206
</div>
207-
<div className="absolute bottom-0 left-0 right-0 h-10 bg-gradient-to-t from-muted to-transparent pointer-events-none" />
207+
<div className="absolute bottom-0 left-0 right-0 h-10 bg-gradient-to-t from-muted dark:from-black to-transparent pointer-events-none" />
208208
</>
209209
) : (
210210
<div className="flex items-center justify-center h-full text-muted-foreground">

src/components/form-builder/sidebar/sidebarLeft.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,6 @@ export function SidebarLeft() {
150150
))}
151151

152152
</SidebarContent>
153-
<div className="absolute bottom-30 left-0 right-0 h-10 bg-gradient-to-t from-muted to-transparent pointer-events-none" />
154153
<SidebarFooter className="border-t flex flex-col gap-4 py-3 px-2 justify-center">
155154
<SidebarUser />
156155
</SidebarFooter>

0 commit comments

Comments
 (0)