Skip to content

Commit 6efeca2

Browse files
bjohansebasbjohansebas
authored
chore(tailwind): update to v4
1 parent 1b2acc4 commit 6efeca2

File tree

68 files changed

+1246
-856
lines changed

Some content is hidden

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

68 files changed

+1246
-856
lines changed

‎apps/site/.postcssrc.json‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,6 @@
33
"postcss-mixins": {},
44
"postcss-simple-vars": {},
55
"postcss-calc": {},
6-
"postcss-import": {},
7-
"tailwindcss/nesting": {},
8-
"tailwindcss": {},
9-
"autoprefixer": {}
6+
"@tailwindcss/postcss": {}
107
}
118
}

‎apps/site/.stylelintrc.mjs‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ const CUSTOM_AT_RULES = [
44
'apply',
55
'layer',
66
'responsive',
7+
'reference',
8+
'utility',
9+
'theme',
10+
'custom-variant',
711
'screen',
812
'tailwind',
913
'variants',
@@ -42,6 +46,6 @@ export default {
4246
// Adopts the import notation from `postcss-import`
4347
'import-notation': 'string',
4448
// Allow the `@apply` at rule as its part of Tailwind
45-
'at-rule-no-deprecated': [true, { ignoreAtRules: ['apply'] }],
49+
'at-rule-no-deprecated': [true, { ignoreAtRules: CUSTOM_AT_RULES }],
4650
},
4751
};

‎apps/site/app/[locale]/next-data/og/[category]/[title]/route.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,12 @@ import { ImageResponse } from 'next/og';
44

55
import { DEFAULT_CATEGORY_OG_TYPE } from '@/next.constants.mjs';
66
import { defaultLocale } from '@/next.locales.mjs';
7-
import tailwindConfig from '@/tailwind.config';
87
import { hexToRGBA } from '@/util/hexToRGBA';
98

109
const CATEGORY_TO_THEME_COLOUR_MAP = {
11-
announcement: tailwindConfig.theme.colors.green['700'],
12-
release: tailwindConfig.theme.colors.info['600'],
13-
vulnerability: tailwindConfig.theme.colors.warning['600'],
10+
announcement: '#1a3f1d',
11+
release: '#0c7bb3',
12+
vulnerability: '#ae5f00',
1413
};
1514

1615
type Category = keyof typeof CATEGORY_TO_THEME_COLOUR_MAP;

‎apps/site/components/Blog/BlogHeader/index.module.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@reference "../../../styles/index.css";
2+
13
.blogHeader {
24
h1 {
35
@apply inline-flex

‎apps/site/components/Blog/BlogPostCard/index.module.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@reference "../../../styles/index.css";
2+
13
.container {
24
@apply max-w-full
35
flex-1;

‎apps/site/components/Common/Search/utils.ts‎

Lines changed: 32 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,43 @@
1-
import tailwindConfig from '@/tailwind.config';
2-
3-
const colors = tailwindConfig.theme.colors;
41
export const themeConfig = {
52
typography: {
63
'--font-primary': 'var(--font-open-sans)',
74
},
85
colors: {
96
light: {
10-
'--text-color-primary': colors.neutral[900],
11-
'--text-color-accent': colors.green[600],
12-
'--background-color-secondary': colors.neutral[100],
13-
'--background-color-tertiary': colors.neutral[300],
14-
'--border-color-accent': colors.green[600],
15-
'--border-color-primary': colors.neutral[200],
16-
'--border-color-tertiary': colors.green[700],
17-
'--button-background-color-primary': colors.green[600],
18-
'--button-background-color-secondary': colors.white,
19-
'--button-background-color-secondary-hover': colors.neutral[100],
20-
'--button-border-color-secondary': colors.neutral[300],
21-
'--button-text-color-secondary': colors.neutral[900],
22-
'--chat-button-border-color-gradientThree': colors.green[400],
23-
'--chat-button-border-color-gradientFour': colors.green[700],
24-
'--chat-button-background-color-gradientOne': colors.green[600],
25-
'--chat-button-background-color-gradientTwo': colors.green[300],
7+
'--text-color-primary': 'var(--color-neutral-900)',
8+
'--text-color-accent': 'var(--color-green-600)',
9+
'--background-color-secondary': 'var(--color-neutral-100)',
10+
'--background-color-tertiary': 'var(--color-neutral-300)',
11+
'--border-color-accent': 'var(--color-green-600)',
12+
'--border-color-primary': 'var(--color-neutral-200)',
13+
'--border-color-tertiary': 'var(--color-green-700)',
14+
'--button-background-color-primary': 'var(--color-green-600)',
15+
'--button-background-color-secondary': 'var(--color-white)',
16+
'--button-background-color-secondary-hover': 'var(--color-neutral-100)',
17+
'--button-border-color-secondary': 'var(--color-neutral-300)',
18+
'--button-text-color-secondary': 'var(--color-neutral-900)',
19+
'--chat-button-border-color-gradientThree': 'var(--color-green-400)',
20+
'--chat-button-border-color-gradientFour': 'var(--color-green-700)',
21+
'--chat-button-background-color-gradientOne': 'var(--color-green-600)',
22+
'--chat-button-background-color-gradientTwo': 'var(--color-green-300)',
2623
},
2724
dark: {
28-
'--text-color-primary': colors.neutral[100],
29-
'--text-color-accent': colors.green[400],
30-
'--background-color-secondary': colors.neutral[950],
31-
'--background-color-tertiary': colors.neutral[900],
32-
'--border-color-accent': colors.green[400],
33-
'--border-color-primary': colors.neutral[900],
34-
'--border-color-tertiary': colors.green[300],
35-
'--button-background-color-primary': colors.green[400],
36-
'--button-background-color-secondary': colors.neutral[950],
37-
'--button-background-color-secondary-hover': colors.neutral[900],
38-
'--button-border-color-secondary': colors.neutral[900],
39-
'--button-text-color-secondary': colors.neutral[200],
40-
'--chat-button-border-color-gradientThree': colors.green[400],
41-
'--chat-button-border-color-gradientFour': colors.green[700],
42-
'--chat-button-background-color-gradientOne': colors.green[400],
43-
'--chat-button-background-color-gradientTwo': colors.green[800],
25+
'--text-color-primary': 'var(--color-neutral-100)',
26+
'--text-color-accent': 'var(--color-green-400)',
27+
'--background-color-secondary': 'var(--color-neutral-950)',
28+
'--background-color-tertiary': 'var(--color-neutral-900)',
29+
'--border-color-accent': 'var(--color-green-400)',
30+
'--border-color-primary': 'var(--color-neutral-900)',
31+
'--border-color-tertiary': 'var(--color-green-300)',
32+
'--button-background-color-primary': 'var(--color-green-400)',
33+
'--button-background-color-secondary': 'var(--color-neutral-950)',
34+
'--button-background-color-secondary-hover': 'var(--color-neutral-900)',
35+
'--button-border-color-secondary': 'var(--color-neutral-900)',
36+
'--button-text-color-secondary': 'var(--color-neutral-200)',
37+
'--chat-button-border-color-gradientThree': 'var(--color-green-400)',
38+
'--chat-button-border-color-gradientFour': 'var(--color-green-700)',
39+
'--chat-button-background-color-gradientOne': 'var(--color-green-400)',
40+
'--chat-button-background-color-gradientTwo': 'var(--color-green-800)',
4441
},
4542
},
4643
};

‎apps/site/components/Downloads/DownloadButton/index.module.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@reference "../../../styles/index.css";
2+
13
.downloadButton {
24
@apply justify-center;
35

‎apps/site/components/MDX/Calendar/Event/index.module.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@reference "../../../../styles/index.css";
2+
13
.event {
24
@apply flex
35
w-fit

‎apps/site/components/MDX/Calendar/calendar.module.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
@reference "../../../styles/index.css";
2+
13
.events {
24
@apply flex
35
flex-col

‎apps/site/components/withBlogCategories.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const WithBlogCategories: FC<WithBlogCategoriesProps> = ({
3030
tabs={categories}
3131
activeTab={blogData.category}
3232
>
33-
<div className="max-xs:grid-cols-[1fr] grid grid-cols-[repeat(auto-fill,minmax(theme(spacing.80),1fr))] [grid-gap:theme(spacing.12)_theme(spacing.8)]">
33+
<div className="max-xs:grid-cols-[1fr] grid grid-cols-[repeat(auto-fill,minmax(--spacing(80),1fr))] [grid-gap:--spacing(12)_--spacing(8)]">
3434
{blogData.posts.map(post => (
3535
<BlogPostCard
3636
key={post.slug}

0 commit comments

Comments
 (0)