Skip to content

Commit cd9ca02

Browse files
authored
Merge main into design branch for preview styling
2 parents 5c665f3 + 03a13cb commit cd9ca02

4 files changed

Lines changed: 227 additions & 137 deletions

File tree

src/app/globals.css

Lines changed: 45 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@
77
@theme inline {
88
--color-background: var(--background);
99
--color-foreground: var(--foreground);
10-
--font-sans: var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif;
11-
--font-mono: var(--font-geist-mono);
12-
--font-heading: var(--font-display), var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif;
10+
--font-sans: var(--font-system);
11+
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
12+
--font-heading: var(--font-system);
1313
--color-sidebar-ring: var(--sidebar-ring);
1414
--color-sidebar-border: var(--sidebar-border);
1515
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
@@ -142,10 +142,13 @@
142142
}
143143
body {
144144
background: var(--color-page);
145+
font-family: var(--font-system);
146+
font-size: var(--welcome-text-size);
147+
letter-spacing: var(--welcome-letter-spacing);
145148
@apply text-foreground;
146149
}
147150
html {
148-
@apply font-sans;
151+
font-family: var(--font-system);
149152
}
150153
}
151154

@@ -1176,6 +1179,44 @@
11761179
cursor: not-allowed;
11771180
}
11781181

1182+
.element-chat-popup-prompt-readonly {
1183+
flex: 1;
1184+
min-width: 0;
1185+
margin: 0;
1186+
font-family: inherit;
1187+
font-size: 13px;
1188+
line-height: 1.45;
1189+
letter-spacing: -0.01em;
1190+
color: rgba(17, 17, 17, 0.88);
1191+
}
1192+
1193+
.element-chat-popup-locked-hint {
1194+
font-family: inherit;
1195+
font-size: 12px;
1196+
color: rgba(17, 17, 17, 0.45);
1197+
}
1198+
1199+
.element-chat-popup-toolbar-spacer {
1200+
width: 26px;
1201+
}
1202+
1203+
.element-chat-popup-view-preview {
1204+
height: 28px;
1205+
padding: 0 12px;
1206+
border: none;
1207+
border-radius: 999px;
1208+
background: #2f6feb;
1209+
color: #ffffff;
1210+
font-family: inherit;
1211+
font-size: 12px;
1212+
font-weight: 600;
1213+
cursor: pointer;
1214+
}
1215+
1216+
.element-chat-popup-view-preview:hover {
1217+
background: #255fd4;
1218+
}
1219+
11791220
.element-chat-popup-toolbar {
11801221
display: grid;
11811222
grid-template-columns: auto 1fr auto;

src/app/layout.tsx

Lines changed: 1 addition & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,6 @@
11
import type { Metadata } from "next";
2-
import { Geist, Geist_Mono, Plus_Jakarta_Sans, Sora } from "next/font/google";
32
import "./globals.css";
43

5-
const geistSans = Geist({
6-
variable: "--font-geist-sans",
7-
subsets: ["latin"],
8-
});
9-
10-
const geistMono = Geist_Mono({
11-
variable: "--font-geist-mono",
12-
subsets: ["latin"],
13-
});
14-
15-
const plusJakarta = Plus_Jakarta_Sans({
16-
variable: "--font-ui",
17-
subsets: ["latin"],
18-
});
19-
20-
const sora = Sora({
21-
variable: "--font-display",
22-
subsets: ["latin"],
23-
});
24-
254
export const metadata: Metadata = {
265
title: "parse-nip · popped.dev",
276
description:
@@ -41,11 +20,7 @@ export default function RootLayout({
4120
}>) {
4221
return (
4322
<html lang="en">
44-
<body
45-
className={`${geistSans.variable} ${geistMono.variable} ${plusJakarta.variable} ${sora.variable} min-h-screen antialiased`}
46-
>
47-
{children}
48-
</body>
23+
<body className="min-h-screen antialiased">{children}</body>
4924
</html>
5025
);
5126
}

src/components/design/DesignSelectLayerActive.tsx

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,16 @@ export function DesignSelectLayerActive() {
4545
const [chat, setChat] = useState<ChatState | null>(null);
4646
const [highlight, setHighlight] = useState<Rect | null>(null);
4747

48+
const handlePreviewReady = useCallback(
49+
(params: Parameters<typeof showPreview>[0]) => {
50+
showPreview(params);
51+
setChat(null);
52+
setHover(null);
53+
setHighlight(null);
54+
},
55+
[showPreview],
56+
);
57+
4858
useEffect(() => {
4959
document.body.dataset.cursorMode = "design";
5060
return () => {
@@ -164,7 +174,7 @@ export function DesignSelectLayerActive() {
164174
elementLabel={chat.label}
165175
elementContext={buildElementContext(chat.element)}
166176
onClose={clearSelection}
167-
onPreviewReady={showPreview}
177+
onPreviewReady={handlePreviewReady}
168178
/>
169179
) : null}
170180
</>,

0 commit comments

Comments
 (0)