Skip to content

Commit 22b8aa7

Browse files
committed
install deps
1 parent 5248f9e commit 22b8aa7

File tree

8 files changed

+462
-15
lines changed

8 files changed

+462
-15
lines changed

components.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "default",
4+
"rsc": false,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "tailwind.config.ts",
8+
"css": "src/styles/main.css",
9+
"baseColor": "neutral",
10+
"cssVariables": true,
11+
"prefix": ""
12+
},
13+
"aliases": {
14+
"components": "@/components",
15+
"utils": "@/lib/utils"
16+
}
17+
}

package.json

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@
3636
"@socialgouv/matomo-next": "^1.8.0",
3737
"chart.js": "^4.4.2",
3838
"chartjs-plugin-datalabels": "^2.2.0",
39+
"class-variance-authority": "^0.7.0",
40+
"clsx": "^2.1.1",
3941
"embla-carousel-react": "^7.0.0",
4042
"ethereum-blockies-base64": "^1.0.2",
4143
"framer-motion": "^10.13.0",
@@ -61,6 +63,8 @@
6163
"react-select": "5.8.0",
6264
"reading-time": "^1.5.0",
6365
"remark-gfm": "^3.0.1",
66+
"tailwind-merge": "^2.3.0",
67+
"tailwindcss-animate": "^1.0.7",
6468
"yaml-loader": "^0.8.0"
6569
},
6670
"devDependencies": {
@@ -81,24 +85,27 @@
8185
"@types/react-dom": "18.2.19",
8286
"@typescript-eslint/eslint-plugin": "^6.19.0",
8387
"@typescript-eslint/parser": "^6.19.0",
88+
"autoprefixer": "^10.4.19",
8489
"chromatic": "10.9.6",
8590
"decompress": "^4.2.1",
8691
"eslint": "^8.45.0",
8792
"eslint-config-next": "^14.2.2",
8893
"eslint-config-prettier": "^9.0.0",
8994
"eslint-plugin-simple-import-sort": "^10.0.0",
95+
"eslint-plugin-storybook": "0.8.0",
9096
"eslint-plugin-unused-imports": "^3.0.0",
9197
"husky": "^9.0.11",
92-
"eslint-plugin-storybook": "0.8.0",
9398
"image-size": "^1.0.2",
9499
"lint-staged": "^15.2.5",
95100
"mdast-util-toc": "^7.0.0",
96101
"minimist": "^1.2.8",
97102
"plaiceholder": "^3.0.0",
98103
"polished": "^4.2.2",
104+
"postcss": "^8.4.39",
99105
"raw-loader": "^4.0.2",
100106
"storybook": "8.1.10",
101107
"storybook-react-i18next": "3.1.1",
108+
"tailwindcss": "^3.4.4",
102109
"ts-node": "^10.9.1",
103110
"tsconfig-paths-webpack-plugin": "4.1.0",
104111
"typescript": "^5.5.2",
@@ -109,4 +116,4 @@
109116
"jackspeak": "2.1.1",
110117
"sharp": "0.32.6"
111118
}
112-
}
119+
}

postcss.config.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
plugins: {
3+
tailwindcss: {},
4+
autoprefixer: {},
5+
},
6+
}

src/lib/utils/cn.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { type ClassValue, clsx } from "clsx"
2+
import { twMerge } from "tailwind-merge"
3+
4+
export function cn(...inputs: ClassValue[]) {
5+
return twMerge(clsx(inputs))
6+
}

src/pages/_app.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@ import customTheme from "@/@chakra-ui/theme"
1010

1111
import { AppPropsWithLayout } from "@/lib/types"
1212

13-
import "../styles/global.css"
13+
import "@/styles/global.css"
14+
import "@/styles/main.css"
1415

1516
import { useLocaleDirection } from "@/hooks/useLocaleDirection"
1617
import { RootLayout } from "@/layouts/RootLayout"

src/styles/main.css

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
@layer base {
6+
:root {
7+
--background: 0 0% 100%;
8+
--foreground: 0 0% 3.9%;
9+
10+
--card: 0 0% 100%;
11+
--card-foreground: 0 0% 3.9%;
12+
13+
--popover: 0 0% 100%;
14+
--popover-foreground: 0 0% 3.9%;
15+
16+
--primary: 0 0% 9%;
17+
--primary-foreground: 0 0% 98%;
18+
19+
--secondary: 0 0% 96.1%;
20+
--secondary-foreground: 0 0% 9%;
21+
22+
--muted: 0 0% 96.1%;
23+
--muted-foreground: 0 0% 45.1%;
24+
25+
--accent: 0 0% 96.1%;
26+
--accent-foreground: 0 0% 9%;
27+
28+
--destructive: 0 84.2% 60.2%;
29+
--destructive-foreground: 0 0% 98%;
30+
31+
--border: 0 0% 89.8%;
32+
--input: 0 0% 89.8%;
33+
--ring: 0 0% 3.9%;
34+
35+
--radius: 0.5rem;
36+
}
37+
38+
.dark {
39+
--background: 0 0% 3.9%;
40+
--foreground: 0 0% 98%;
41+
42+
--card: 0 0% 3.9%;
43+
--card-foreground: 0 0% 98%;
44+
45+
--popover: 0 0% 3.9%;
46+
--popover-foreground: 0 0% 98%;
47+
48+
--primary: 0 0% 98%;
49+
--primary-foreground: 0 0% 9%;
50+
51+
--secondary: 0 0% 14.9%;
52+
--secondary-foreground: 0 0% 98%;
53+
54+
--muted: 0 0% 14.9%;
55+
--muted-foreground: 0 0% 63.9%;
56+
57+
--accent: 0 0% 14.9%;
58+
--accent-foreground: 0 0% 98%;
59+
60+
--destructive: 0 62.8% 30.6%;
61+
--destructive-foreground: 0 0% 98%;
62+
63+
--border: 0 0% 14.9%;
64+
--input: 0 0% 14.9%;
65+
--ring: 0 0% 83.1%;
66+
}
67+
}
68+
69+
@layer base {
70+
* {
71+
@apply border-border;
72+
}
73+
body {
74+
@apply bg-background text-foreground;
75+
}
76+
}

tailwind.config.ts

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import type { Config } from "tailwindcss"
2+
3+
const config = {
4+
darkMode: ["class"],
5+
content: [
6+
'./pages/**/*.{ts,tsx}',
7+
'./components/**/*.{ts,tsx}',
8+
'./app/**/*.{ts,tsx}',
9+
'./src/**/*.{ts,tsx}',
10+
],
11+
prefix: "",
12+
theme: {
13+
container: {
14+
center: true,
15+
padding: "2rem",
16+
screens: {
17+
"2xl": "1400px",
18+
},
19+
},
20+
extend: {
21+
colors: {
22+
border: "hsl(var(--border))",
23+
input: "hsl(var(--input))",
24+
ring: "hsl(var(--ring))",
25+
background: "hsl(var(--background))",
26+
foreground: "hsl(var(--foreground))",
27+
primary: {
28+
DEFAULT: "hsl(var(--primary))",
29+
foreground: "hsl(var(--primary-foreground))",
30+
},
31+
secondary: {
32+
DEFAULT: "hsl(var(--secondary))",
33+
foreground: "hsl(var(--secondary-foreground))",
34+
},
35+
destructive: {
36+
DEFAULT: "hsl(var(--destructive))",
37+
foreground: "hsl(var(--destructive-foreground))",
38+
},
39+
muted: {
40+
DEFAULT: "hsl(var(--muted))",
41+
foreground: "hsl(var(--muted-foreground))",
42+
},
43+
accent: {
44+
DEFAULT: "hsl(var(--accent))",
45+
foreground: "hsl(var(--accent-foreground))",
46+
},
47+
popover: {
48+
DEFAULT: "hsl(var(--popover))",
49+
foreground: "hsl(var(--popover-foreground))",
50+
},
51+
card: {
52+
DEFAULT: "hsl(var(--card))",
53+
foreground: "hsl(var(--card-foreground))",
54+
},
55+
},
56+
borderRadius: {
57+
lg: "var(--radius)",
58+
md: "calc(var(--radius) - 2px)",
59+
sm: "calc(var(--radius) - 4px)",
60+
},
61+
keyframes: {
62+
"accordion-down": {
63+
from: { height: "0" },
64+
to: { height: "var(--radix-accordion-content-height)" },
65+
},
66+
"accordion-up": {
67+
from: { height: "var(--radix-accordion-content-height)" },
68+
to: { height: "0" },
69+
},
70+
},
71+
animation: {
72+
"accordion-down": "accordion-down 0.2s ease-out",
73+
"accordion-up": "accordion-up 0.2s ease-out",
74+
},
75+
},
76+
},
77+
plugins: [require("tailwindcss-animate")],
78+
} satisfies Config
79+
80+
export default config

0 commit comments

Comments
 (0)