chore: update tailwindcss (#1061)

Update TailwindCSS to v3.4 and refactor some arbitrary values.
saleor · Dec 20, 2023 · becbe47 · becbe47
1 parent d2af3cf
commit becbe47
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 19 deletions.
diff --git a/package.json b/package.json
@@ -73,7 +73,7 @@
 		"prettier": "3.1.1",
 		"prettier-plugin-tailwindcss": "0.5.9",
 		"schema-dts": "1.1.2",
-		"tailwindcss": "3.3.6",
+		"tailwindcss": "3.4.0",
 		"typescript": "5.3.3",
 		"wonka": "6.3.4"
 	},

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
@@ -17,8 +17,8 @@ export default function CheckoutPage({
 	}
 
 	return (
-		<div className="min-h-[100dvh] bg-white">
-			<section className="mx-auto flex min-h-[100dvh] max-w-7xl flex-col p-8">
+		<div className="min-h-dvh bg-white">
+			<section className="mx-auto flex min-h-dvh max-w-7xl flex-col p-8">
 				<div className="flex items-center font-bold">
 					<a aria-label="homepage" href="/">
 						ACME

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -18,8 +18,8 @@ export default function RootLayout(props: { children: ReactNode }) {
 	const { children } = props;
 
 	return (
-		<html lang="en" className="min-h-[100dvh]">
-			<body className={`${inter.className} min-h-[100dvh]`}>
+		<html lang="en" className="min-h-dvh">
+			<body className={`${inter.className} min-h-dvh`}>
 				{children}
 				<DraftModeNotification />
 			</body>

diff --git a/src/ui/components/nav/components/MobileMenu.tsx b/src/ui/components/nav/components/MobileMenu.tsx
@@ -19,7 +19,7 @@ export const MobileMenu = ({ children }: Props) => {
 			<OpenButton onClick={openMenu} aria-controls="mobile-menu" />
 			<Transition show={isOpen}>
 				<Dialog onClose={closeMenu}>
-					<Dialog.Panel className="fixed inset-0 z-20 flex h-[100dvh] w-screen flex-col overflow-y-scroll">
+					<Dialog.Panel className="fixed inset-0 z-20 flex h-dvh w-screen flex-col overflow-y-scroll">
 						<Transition.Child
 							className="sticky top-0 z-10 flex h-16 shrink-0 bg-neutral-100/50 px-3 backdrop-blur-md sm:px-8"
 							enter="motion-safe:transition-all motion-safe:duration-150"