Skip to content

Upgrade TailwindCSS to v.4.1.12 #2153

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 9 commits into from
Aug 30, 2025
Merged

Upgrade TailwindCSS to v.4.1.12 #2153

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
0e7d8d4
Upgrade TailwindCSS to v.4
kasya Aug 28, 2025
e40542b
Update classes
kasya Aug 29, 2025
965b846
Merge branch 'main' into upgrade-tailwindcss
kasya Aug 29, 2025
8db3df4
Update classes and apply Code Rabbit suggestions
kasya Aug 29, 2025
343478e
Fix tests
kasya Aug 29, 2025
73f897d
Apply suggestions
kasya Aug 29, 2025
1aa4c7c
Merge branch 'main' into upgrade-tailwindcss
arkid15r Aug 29, 2025
9594082
Update code
arkid15r Aug 30, 2025
d504de2
Merge branch 'main' into upgrade-tailwindcss
kasya Aug 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion frontend/__tests__/unit/components/Footer.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -316,7 +316,7 @@ describe('Footer', () => {
expect(footer).toHaveClass(
'mt-auto',
'w-full',
'border-t',
'border-t-1',
'bg-slate-200',
'dark:bg-slate-800',
'xl:max-w-full'
Expand Down
4 changes: 3 additions & 1 deletion frontend/__tests__/unit/components/LoginPageContent.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -467,7 +467,9 @@ describe('LoginPageContent', () => {
expect(loginCard).toHaveClass(
'w-full',
'max-w-sm',
'space-y-6',
'flex',
'flex-col',
'gap-6',
'rounded-2xl',
'border',
'border-gray-200',
Expand Down
2 changes: 1 addition & 1 deletion frontend/__tests__/unit/components/MultiSearch.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,7 @@ describe('Rendering', () => {
'h-12',
'w-full',
'rounded-lg',
'border',
'border-1',
'border-gray-300',
'pl-10',
'pr-10',
Expand Down
4 changes: 2 additions & 2 deletions frontend/__tests__/unit/components/NavButton.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -213,7 +213,7 @@ describe('<NavButton />', () => {
'hover:ring-1',
'hover:ring-[#b0c7de]',
'hover:ring-offset-0',
'focus-visible:outline-none',
'focus-visible:outline-hidden',
'focus-visible:ring-1',
'focus-visible:ring-ring'
)
Expand Down Expand Up @@ -323,7 +323,7 @@ describe('<NavButton />', () => {
it('should maintain focus visibility with focus-visible classes', () => {
renderNavButton()
const link = screen.getByRole('link')
expect(link).toHaveClass('focus-visible:outline-none', 'focus-visible:ring-1')
expect(link).toHaveClass('focus-visible:outline-hidden', 'focus-visible:ring-1')
})
})

Expand Down
4 changes: 2 additions & 2 deletions frontend/__tests__/unit/components/Search.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -335,7 +335,7 @@ describe('SearchBar Component', () => {
render(<SearchBar {...defaultProps} isLoaded={false} />)
const input = screen.getByPlaceholderText('Search projects...')
expect(input).toHaveClass(
'h-12 w-full rounded-lg border border-gray-300 pl-10 pr-10 text-lg text-black focus:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800 dark:text-white dark:focus:border-blue-300 dark:focus:ring-blue-300'
'h-12 w-full rounded-lg border-1 border-gray-300 pl-10 pr-10 text-lg text-black focus:border-blue-500 focus:outline-hidden focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800 dark:text-white dark:focus:border-blue-300 dark:focus:ring-blue-300'
)
})

Expand All @@ -351,7 +351,7 @@ describe('SearchBar Component', () => {
fireEvent.change(input, { target: { value: 'test' } })
const clearButton = container.querySelector('button.absolute.rounded-full[class*="right-2"]')
expect(clearButton).toHaveClass(
'absolute right-2 top-1/2 -translate-y-1/2 rounded-full p-1 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-300'
'absolute right-2 top-1/2 -translate-y-1/2 rounded-full p-1 hover:bg-gray-100 focus:outline-hidden focus:ring-2 focus:ring-gray-300'
)
})

Expand Down
2 changes: 1 addition & 1 deletion frontend/__tests__/unit/components/UserMenu.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -691,7 +691,7 @@ describe('UserMenu Component', () => {
expect(container).toHaveClass('relative', 'flex', 'items-center', 'justify-center')

const avatarButton = screen.getByRole('button')
expect(avatarButton).toHaveClass('w-auto', 'focus:outline-none')
expect(avatarButton).toHaveClass('w-auto', 'focus:outline-hidden')
})

it('applies correct CSS classes to dropdown menu', async () => {
Expand Down
2 changes: 1 addition & 1 deletion frontend/docker/Dockerfile
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ COPY --chmod=444 package.json pnpm-lock.yaml ./
RUN --mount=type=cache,id=pnpm,target=/pnpm/store \
pnpm install --frozen-lockfile --ignore-scripts

COPY --chmod=444 .env .pnpmrc next.config.ts postcss.config.js tailwind.config.js tsconfig.json ./
COPY --chmod=444 .env .pnpmrc next.config.ts postcss.config.js tailwind.config.mjs tsconfig.json ./
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

⚠️ Potential issue

Don’t COPY .env into the image; also fix brittle rm

Copying .env bakes secrets into build layers and cache. In runner, rm .env will fail if the file isn’t present, breaking the build. Stop copying .env and make the removal resilient.

Apply:

-COPY --chmod=444 .env .pnpmrc next.config.ts postcss.config.js tailwind.config.mjs tsconfig.json ./
+COPY --chmod=444 .pnpmrc next.config.ts postcss.config.js tailwind.config.mjs tsconfig.json ./

And:

-RUN mkdir -p /app/.next/cache && chown -R nextjs:nodejs /app/.next/cache && chmod -R 755 /app/.next/cache && rm .env
+RUN mkdir -p /app/.next/cache && chown -R nextjs:nodejs /app/.next/cache && chmod -R 755 /app/.next/cache && rm -f .env

Optionally, if build-time env is required, use BuildKit secrets instead of COPY:

-RUN pnpm run build
+RUN --mount=type=secret,id=env,target=/app/.env pnpm run build

Build with: DOCKER_BUILDKIT=1 docker build --secret id=env,src=.env ...

🤖 Prompt for AI Agents 
In frontend/docker/Dockerfile around line 30, the Dockerfile currently copies
.env into the image which bakes secrets into build layers and the subsequent rm
will fail if the file is absent; remove .env from the COPY list so it is not
included in the image, and make the removal command resilient (e.g., use a
non-failing removal method such as rm -f or guard the rm with an existence
check) or better yet, stop attempting to remove .env in the Dockerfile and if
build-time env is required, use BuildKit secrets (docker build --secret ...)
instead of COPY.

COPY --chmod=555 public public
COPY --chmod=555 src src

Expand Down
2 changes: 1 addition & 1 deletion frontend/docker/Dockerfile.e2e.test
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,6 @@ RUN --mount=type=cache,id=pnpm,target=/pnpm/store \

COPY __tests__/e2e __tests__/e2e
COPY __tests__/unit/data __tests__/unit/data
COPY .pnpmrc next.config.ts postcss.config.js playwright.config.ts tailwind.config.js tsconfig.json ./
COPY .pnpmrc next.config.ts postcss.config.js playwright.config.ts tailwind.config.mjs tsconfig.json ./
COPY public public
COPY src src
5 changes: 2 additions & 3 deletions frontend/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@
"clsx": "^2.1.1",
"core-js": "^3.45.1",
"date-fns": "^4.1.0",
"dayjs": "^1.11.15",
"dayjs": "^1.11.17",
"dompurify": "^3.2.6",
"eslint-plugin-import": "^2.32.0",
"framer-motion": "^12.23.12",
Expand Down Expand Up @@ -85,7 +85,6 @@
"@types/react-gtm-module": "^2.0.4",
"@typescript-eslint/eslint-plugin": "^8.41.0",
"@typescript-eslint/parser": "^8.41.0",
"autoprefixer": "^10.4.21",
"eslint": "^9.34.0",
"eslint-config-next": "^15.5.2",
"eslint-config-prettier": "^10.1.8",
Expand All @@ -106,7 +105,7 @@
"prettier": "^3.6.2",
"prettier-plugin-tailwindcss": "^0.6.14",
"require-in-the-middle": "^7.5.2",
"tailwindcss": "^3.4.17",
"tailwindcss": "^4.1.12",
"ts-jest": "^29.4.1",
"ts-node": "^10.9.2",
"typescript": "~5.8.3",
Expand Down
Loading