[v4] Switch default breakpoints to rem (#13469)
* Switch breakpoints to rem #8378 * Fix broken test * Update snapshots --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com>
This commit is contained in:
parent
ce0a7347da
commit
7347cddb9a
3 changed files with 17 additions and 17 deletions
|
|
@ -11,11 +11,11 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
|
|||
--default-mono-font-family: var(--font-family-mono);
|
||||
--default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
|
||||
--default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
|
||||
--breakpoint-sm: 640px;
|
||||
--breakpoint-md: 768px;
|
||||
--breakpoint-lg: 1024px;
|
||||
--breakpoint-xl: 1280px;
|
||||
--breakpoint-2xl: 1536px;
|
||||
--breakpoint-sm: 40rem;
|
||||
--breakpoint-md: 48rem;
|
||||
--breakpoint-lg: 64rem;
|
||||
--breakpoint-xl: 80rem;
|
||||
--breakpoint-2xl: 96rem;
|
||||
--color-black: #000;
|
||||
--color-white: #fff;
|
||||
--color-slate-50: #f8fafc;
|
||||
|
|
@ -599,7 +599,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
|
|||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
@media (width >= 1536px) {
|
||||
@media (width >= 96rem) {
|
||||
.\\32 xl\\:font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,11 +10,11 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
|
|||
--default-mono-font-family: var(--font-family-mono);
|
||||
--default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
|
||||
--default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
|
||||
--breakpoint-sm: 640px;
|
||||
--breakpoint-md: 768px;
|
||||
--breakpoint-lg: 1024px;
|
||||
--breakpoint-xl: 1280px;
|
||||
--breakpoint-2xl: 1536px;
|
||||
--breakpoint-sm: 40rem;
|
||||
--breakpoint-md: 48rem;
|
||||
--breakpoint-lg: 64rem;
|
||||
--breakpoint-xl: 80rem;
|
||||
--breakpoint-2xl: 96rem;
|
||||
--color-black: #000;
|
||||
--color-white: #fff;
|
||||
--color-slate-50: #f8fafc;
|
||||
|
|
@ -417,7 +417,7 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
|
|||
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
||||
}
|
||||
|
||||
@media (width >= 640px) {
|
||||
@media (width >= 40rem) {
|
||||
.sm\\:flex {
|
||||
display: flex;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,11 +10,11 @@
|
|||
--default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
|
||||
|
||||
/* Breakpoints */
|
||||
--breakpoint-sm: 640px;
|
||||
--breakpoint-md: 768px;
|
||||
--breakpoint-lg: 1024px;
|
||||
--breakpoint-xl: 1280px;
|
||||
--breakpoint-2xl: 1536px;
|
||||
--breakpoint-sm: 40rem;
|
||||
--breakpoint-md: 48rem;
|
||||
--breakpoint-lg: 64rem;
|
||||
--breakpoint-xl: 80rem;
|
||||
--breakpoint-2xl: 96rem;
|
||||
|
||||
/* Colors */
|
||||
--color-black: #000;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue