From 17e2ac0b01797f8472e781122a396c5d07acc974 Mon Sep 17 00:00:00 2001 From: moaaz <145723871+moaaz-ae@users.noreply.github.com> Date: Thu, 24 Sep 2026 04:23:53 +0300 Subject: [PATCH] refactor(web): variable fonts, and a real --font-mono for the first time (#15663) --- docs/custom.css | 4 +- .../components/chat-empty-state.tsx | 2 +- .../components/onboarding-question-card.tsx | 2 +- .../components/onboarding-welcome.tsx | 2 +- .../showcase-card/showcase-tile.tsx | 2 +- .../assets/fonts/InterVariable-Italic.woff2 | Bin 0 -> 51924 bytes .../web/src/assets/fonts/InterVariable.woff2 | Bin 0 -> 48444 bytes .../web/src/assets/fonts/JetBrainsMono.woff2 | Bin 0 -> 40404 bytes .../assets}/fonts/Sentient-Variable.woff2 | Bin .../src/assets/fonts/inter-v20-latin-500.ttf | Bin 343200 -> 0 bytes .../src/assets/fonts/inter-v20-latin-600.ttf | Bin 343828 -> 0 bytes .../assets/fonts/inter-v20-latin-700.woff2 | Bin 24356 -> 0 bytes .../assets/fonts/inter-v20-latin-800.woff2 | Bin 24400 -> 0 bytes .../fonts/inter-v20-latin-regular.woff2 | Bin 23664 -> 0 bytes .../features/chat/use-cases/use-case-card.tsx | 2 +- packages/web/src/styles.css | 54 ++++++------------ 16 files changed, 25 insertions(+), 43 deletions(-) create mode 100644 packages/web/src/assets/fonts/InterVariable-Italic.woff2 create mode 100644 packages/web/src/assets/fonts/InterVariable.woff2 create mode 100644 packages/web/src/assets/fonts/JetBrainsMono.woff2 rename packages/web/{public => src/assets}/fonts/Sentient-Variable.woff2 (100%) delete mode 100644 packages/web/src/assets/fonts/inter-v20-latin-500.ttf delete mode 100644 packages/web/src/assets/fonts/inter-v20-latin-600.ttf delete mode 100644 packages/web/src/assets/fonts/inter-v20-latin-700.woff2 delete mode 100644 packages/web/src/assets/fonts/inter-v20-latin-800.woff2 delete mode 100644 packages/web/src/assets/fonts/inter-v20-latin-regular.woff2 diff --git a/docs/custom.css b/docs/custom.css index 12cdf27c1342..1826c656f85f 100644 --- a/docs/custom.css +++ b/docs/custom.css @@ -52,7 +52,7 @@ .pp-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 40px; border: 1px solid var(--pp-border); border-radius: 6px; padding: 6px 8px; } .pp-chips .pp-ph { color: var(--pp-faint); font-size: 14px; } -.pp-code { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.6; background: var(--pp-soft); border: 1px solid var(--pp-border); border-radius: 6px; padding: 10px 12px; color: #3f3f46; white-space: pre; overflow-x: auto; } +.pp-code { font-family: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; font-size: 12.5px; line-height: 1.6; background: var(--pp-soft); border: 1px solid var(--pp-border); border-radius: 6px; padding: 10px 12px; color: #3f3f46; white-space: pre; overflow-x: auto; } .pp-key { color: hsl(257 74% 45%); } .pp-str { color: hsl(160 84% 30%); } @@ -86,7 +86,7 @@ .pp-cards { display: flex; gap: 8px; flex-wrap: wrap; } .pp-rcard { flex: 1 1 0; min-width: 120px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--pp-border); border-radius: 8px; padding: 11px 12px; } .pp-rcard.pp-sel { border-color: var(--pp-primary); background: hsl(257 74% 57% / 0.05); } -.pp-rcard .pp-ic { width: 28px; height: 28px; border-radius: 6px; background: var(--pp-soft); display: flex; align-items: center; justify-content: center; color: #52525b; flex: none; font-family: ui-monospace, monospace; font-size: 12px; } +.pp-rcard .pp-ic { width: 28px; height: 28px; border-radius: 6px; background: var(--pp-soft); display: flex; align-items: center; justify-content: center; color: #52525b; flex: none; font-family: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; font-size: 12px; } .pp-rcard.pp-sel .pp-ic { background: var(--pp-primary-wash); color: var(--pp-primary); } .pp-rcard .pp-t { font-size: 13.5px; font-weight: 600; } .pp-rcard .pp-d { font-size: 11.5px; color: var(--pp-muted); } diff --git a/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx b/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx index 2f25506ca609..306926545b61 100644 --- a/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx +++ b/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx @@ -152,7 +152,7 @@ function Greeting({ animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.4 }} > -
L0)$4TL@B0O%c|@ROddXU+
zS`!&9GYZ(lXETJQC#87>oq;aBiwtz7FhGhLFfTC95z9K&sghn1VY0%p8XV-;7NPC~
zo+_!5Lynj#igf4DMgzsseOrCTkySfg<)McjgU|HcP7$_j%Od(dx;#)&>=hz>!WAZ*
zDAys3$Zf(z5ZP3kVKU)7SB9fMw`B|QEli;>ukg)U(AN?oDNLFmR$(Bllr&QIoyvO?Q-(|r|%#6Ad(W)h-nzkqAk~1zl#Lw;Dy(MFe9xw-t=#eQILW?+%Zc$*O
zA~7SuMnJ?bQ6CkIL_|fUTDqj%j>oC~-4l=rLtMZSIVp`0I*#m&06q@6YoNd>WeGcE
zkR{ocWr=_I_9OJ&fxjFA7Zu|Hg(fbMFg?Cfu(5S&hkqcu{`p_Ky86tMLx8^bDPlx0
zq9bJboEoA{`=3Q~Nt)VKJXJlDF3_B)^u6=GivQjUEG~;Ku!sf-K?Bj!G;MPst)Erw
z#D05X!{es^e~^~8Yd7z_+ZA)#U43G{C;R%u_AcYfGubtncb!z6wrH?mAqoK!NP>g}
zDPnD5c-*vqs3w6BBaje6a4D3QcD0#zCu)q{eG!?QxbMWKcGH?tMu)&{U7CuFEtqJI
zIhhIqDu@e2aNqzH1XNTUD2_2(+Az~hYinhF?f 0P1fN&@
z_$4rWNtpd?^KL7~MB-sq-o`)hp8y)IMmx@Uwz*!;@=AWQ&Fna*ge{Atgq^|6RXfCR
z-lTG7XuZ8@U5P5!;{tt2fCc5uK?r94`6=?mq>q)D)%s0&H;2Da>Xuj@C}8Kx0Tmsz
z=;TtKb5~Q!VPF##mnO$wYeYAkaX!@qb^e8$4niyl6HYmh?!04&Qq6gRRP(91?L91=
z{fe~BEO27{Zq_G5DO$RFskZjqJP3x+Nu@CXS;P5Ny+k=Le;*bEE~lX6yIiJ(F7>^=tPaCY
zH|CzG0$J`6QMj57k@jcyQj}X4W+I;%bAS8;}n`oVwdsP$CUOq(%&h)=*&4L6$`Qy_o`Pb
z>gO7g**R9<=3aQ#y#9|UnMYE&; nS{Lnmj%~Aw;3
DpVh
z^&J<_toAQwVwj%P$yYhrJ=H