Skip to content

Commit 989020f

Browse files
aslilacaslilac
committed
chore: upgrade to tailwind 4
1 parent 7bb52e1 commit 989020f

File tree

63 files changed

+504
-431
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+504
-431
lines changed

‎site/package.json

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -141,6 +141,7 @@
141141
"@swc/core": "1.3.38",
142142
"@swc/jest": "0.2.37",
143143
"@tailwindcss/typography": "0.5.16",
144+
"@tailwindcss/vite": "4.1.11",
144145
"@testing-library/jest-dom": "6.6.3",
145146
"@testing-library/react": "14.3.1",
146147
"@testing-library/user-event": "14.6.1",
@@ -164,7 +165,6 @@
164165
"@types/ua-parser-js": "0.7.36",
165166
"@types/uuid": "9.0.2",
166167
"@vitejs/plugin-react": "4.5.0",
167-
"autoprefixer": "10.4.20",
168168
"chromatic": "11.25.2",
169169
"dpdm": "3.14.0",
170170
"express": "4.21.2",
@@ -177,21 +177,24 @@
177177
"jest_workaround": "0.1.14",
178178
"knip": "5.51.0",
179179
"msw": "2.4.8",
180-
"postcss": "8.5.1",
181180
"protobufjs": "7.4.0",
182181
"rollup-plugin-visualizer": "5.14.0",
183182
"rxjs": "7.8.1",
184183
"ssh2": "1.16.0",
185184
"storybook": "8.5.3",
186185
"storybook-addon-remix-react-router": "3.1.0",
187-
"tailwindcss": "3.4.17",
186+
"tailwindcss": "4.1.11",
188187
"ts-proto": "1.164.0",
189188
"typescript": "5.6.3",
190189
"vite": "6.3.5",
191190
"vite-plugin-checker": "0.9.3",
192191
"vite-plugin-turbosnap": "1.0.3"
193192
},
194-
"browserslist": ["chrome 110", "firefox 111", "safari 16.0"],
193+
"browserslist": [
194+
"chrome 110",
195+
"firefox 111",
196+
"safari 16.0"
197+
],
195198
"resolutions": {
196199
"optionator": "0.9.3",
197200
"semver": "7.6.2"

‎site/pnpm-lock.yaml

Lines changed: 364 additions & 308 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎site/postcss.config.js

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎site/src/components/Avatar/Avatar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ const avatarVariants = cva(
2222
{
2323
variants: {
2424
size: {
25-
lg: "size-[--avatar-lg] rounded-[6px] text-sm font-medium",
26-
md: "size-[--avatar-default] text-2xs",
27-
sm: "size-[--avatar-sm] text-[8px]",
25+
lg: "size-(--avatar-lg) rounded-[6px] text-sm font-medium",
26+
md: "size-(--avatar-default) text-2xs",
27+
sm: "size-(--avatar-sm) text-[8px]",
2828
},
2929
variant: {
3030
default: null,

‎site/src/components/Badge/Badge.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,13 +17,13 @@ const badgeVariants = cva(
1717
variants: {
1818
variant: {
1919
default:
20-
"border-transparent bg-surface-secondary text-content-secondary shadow",
20+
"border-transparent bg-surface-secondary text-content-secondary shadow-sm",
2121
warning:
22-
"border border-solid border-border-warning bg-surface-orange text-content-warning shadow",
22+
"border border-solid border-border-warning bg-surface-orange text-content-warning shadow-sm",
2323
destructive:
24-
"border border-solid border-border-destructive bg-surface-red text-highlight-red shadow",
24+
"border border-solid border-border-destructive bg-surface-red text-highlight-red shadow-sm",
2525
green:
26-
"border border-solid border-surface-green bg-surface-green text-highlight-green shadow",
26+
"border border-solid border-surface-green bg-surface-green text-highlight-green shadow-sm",
2727
},
2828
size: {
2929
xs: "text-2xs font-regular h-5 [&_svg]:hidden rounded px-1.5",
@@ -36,7 +36,7 @@ const badgeVariants = cva(
3636
},
3737
hover: {
3838
false: null,
39-
true: "no-underline focus:outline-none focus-visible:ring-2 focus-visible:ring-content-link",
39+
true: "no-underline focus:outline-hidden focus-visible:ring-2 focus-visible:ring-content-link",
4040
},
4141
},
4242
compoundVariants: [

‎site/src/components/Button/Button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ const buttonVariants = cva(
1414
inline-flex items-center justify-center gap-1 whitespace-nowrap font-sans
1515
border-solid rounded-md transition-colors
1616
text-sm font-medium cursor-pointer no-underline
17-
focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-content-link
17+
focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-content-link
1818
disabled:pointer-events-none disabled:text-content-disabled
1919
[&:is(a):not([href])]:pointer-events-none [&:is(a):not([href])]:text-content-disabled
2020
[&>svg]:pointer-events-none [&>svg]:shrink-0 [&>svg]:p-0.5

‎site/src/components/Chart/Chart.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -58,14 +58,14 @@ export const ChartContainer = React.forwardRef<
5858
"[&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50",
5959
"[&_.recharts-curve.recharts-tooltip-cursor]:stroke-border",
6060
"[&_.recharts-dot[stroke='#fff']]:stroke-transparent",
61-
"[&_.recharts-layer]:outline-none",
61+
"[&_.recharts-layer]:outline-hidden",
6262
"[&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border",
6363
"[&_.recharts-radial-bar-background-sector]:fill-muted",
6464
"[&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted",
6565
"[&_.recharts-reference-line_[stroke='#ccc']]:stroke-border",
6666
"[&_.recharts-sector[stroke='#fff']]:stroke-transparent",
67-
"[&_.recharts-sector]:outline-none",
68-
"[&_.recharts-surface]:outline-none",
67+
"[&_.recharts-sector]:outline-hidden",
68+
"[&_.recharts-surface]:outline-hidden",
6969
"[&_.recharts-text]:fill-content-secondary [&_.recharts-text]:font-medium",
7070
"[&_.recharts-cartesian-axis-line]:stroke-[hsl(var(--border-default))]",
7171
className,
@@ -194,7 +194,7 @@ export const ChartTooltipContent = React.forwardRef<
194194
<div
195195
ref={ref}
196196
className={cn(
197-
"grid min-w-[8rem] items-start gap-1 rounded-lg border border-solid border-border bg-surface-primary px-3 py-2 text-xs shadow-xl",
197+
"grid min-w-32 items-start gap-1 rounded-lg border border-solid border-border bg-surface-primary px-3 py-2 text-xs shadow-xl",
198198
className,
199199
)}
200200
>
@@ -223,7 +223,7 @@ export const ChartTooltipContent = React.forwardRef<
223223
!hideIndicator && (
224224
<div
225225
className={cn(
226-
"shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
226+
"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)",
227227
{
228228
"h-2.5 w-2.5": indicator === "dot",
229229
"w-1": indicator === "line",

‎site/src/components/Checkbox/Checkbox.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export const Checkbox = React.forwardRef<
1919
ref={ref}
2020
className={cn(
2121
`peer h-5 w-5 shrink-0 rounded-sm border border-border border-solid
22-
focus-visible:outline-none focus-visible:ring-2
22+
focus-visible:outline-hidden focus-visible:ring-2
2323
focus-visible:ring-content-link focus-visible:ring-offset-4 focus-visible:ring-offset-surface-primary
2424
disabled:cursor-not-allowed disabled:bg-surface-primary disabled:data-[state=checked]:bg-surface-tertiary
2525
data-[state=unchecked]:bg-surface-primary

‎site/src/components/Collapsible/Collapsible.stories.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,14 +25,14 @@ const meta: Meta<typeof Collapsible> = {
2525
</Button>
2626
</CollapsibleTrigger>
2727
</div>
28-
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
28+
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-xs">
2929
@radix-ui/primitives
3030
</div>
3131
<CollapsibleContent className="space-y-2">
32-
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
32+
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-xs">
3333
@radix-ui/colors
3434
</div>
35-
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
35+
<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-xs">
3636
@stitches/react
3737
</div>
3838
</CollapsibleContent>

‎site/src/components/Combobox/Combobox.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ export const Combobox: FC<ComboboxProps> = ({
8888
<ChevronDown className="size-icon-sm text-content-secondary group-hover:text-content-primary" />
8989
</Button>
9090
</PopoverTrigger>
91-
<PopoverContent className="w-[var(--radix-popover-trigger-width)]">
91+
<PopoverContent className="w-(--radix-popover-trigger-width)">
9292
<Command>
9393
<CommandInput
9494
placeholder="Search or enter custom value"

0 commit comments

Comments
 (0)