Update to Tailwind v4
parent
b9c1d6628c
commit
b80bd6d784
|
@ -1,7 +1,7 @@
|
||||||
html {
|
html {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
font-family: "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||||
font-feature-settings: "cv02","cv03","cv04","cv11";
|
font-feature-settings: "cv02", "cv03", "cv04", "cv11";
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
@ -29,7 +29,12 @@ a {
|
||||||
color: var(--selection-text-color);
|
color: var(--selection-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
margin-block: 1.5rem 1rem;
|
margin-block: 1.5rem 1rem;
|
||||||
margin-inline: 0;
|
margin-inline: 0;
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
|
@ -75,20 +80,4 @@ p {
|
||||||
.p-toast.p-toast-top-right,
|
.p-toast.p-toast-top-right,
|
||||||
.p-toast.p-toast-top-left {
|
.p-toast.p-toast-top-left {
|
||||||
top: 7rem;
|
top: 7rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
|
||||||
font-family: inherit;
|
|
||||||
font-feature-settings: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
*,
|
|
||||||
::before,
|
|
||||||
::after {
|
|
||||||
border-width: 0;
|
|
||||||
border-style: solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
resize: none;
|
|
||||||
}
|
|
|
@ -1,3 +1,36 @@
|
||||||
@tailwind base;
|
@import "tailwindcss";
|
||||||
@tailwind components;
|
@import "tailwindcss-primeui";
|
||||||
@tailwind utilities;
|
@custom-variant dark (&:where(.p-dark, .p-dark *));
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--breakpoint-sm: '576px';
|
||||||
|
--breakpoint-md: '768px';
|
||||||
|
--breakpoint-lg: '992px';
|
||||||
|
--breakpoint-xl: '1200px';
|
||||||
|
--breakpoint-2xl: '1920px';
|
||||||
|
}
|
||||||
|
|
||||||
|
@custom-variant p-invalid (&[data-p~="invalid"]);
|
||||||
|
@custom-variant p-small (&[data-p~="small"]);
|
||||||
|
@custom-variant p-large (&[data-p~="large"]);
|
||||||
|
@custom-variant p-xlarge (&[data-p~="xlarge"]);
|
||||||
|
@custom-variant p-fluid (&[data-p~="fluid"]);
|
||||||
|
@custom-variant p-filled (&[data-p~="filled"]);
|
||||||
|
@custom-variant p-horizontal (&[data-p~="horizontal"]);
|
||||||
|
@custom-variant p-vertical (&[data-p~="vertical"]);
|
||||||
|
@custom-variant p-stacked (&[data-p~="stacked"]);
|
||||||
|
@custom-variant p-checked (&[data-p~="checked"]);
|
||||||
|
@custom-variant p-disabled (&[data-p~="disabled"]);
|
||||||
|
@custom-variant p-enabled (&:not([data-p~="disabled"]));
|
||||||
|
@custom-variant p-left (&[data-p~="left"]);
|
||||||
|
@custom-variant p-right (&[data-p~="right"]);
|
||||||
|
@custom-variant p-top (&[data-p~="top"]);
|
||||||
|
@custom-variant p-bottom (&[data-p~="bottom"]);
|
||||||
|
@custom-variant p-alternate (&[data-p~="alternate"]);
|
||||||
|
@custom-variant p-active (&[data-p~="active"]);
|
||||||
|
@custom-variant p-focus-visible (&[data-p~="focus-visible"]);
|
||||||
|
@custom-variant p-readonly (&[data-p~="readonly"]);
|
||||||
|
@custom-variant p-removable (&[data-p~="removable"]);
|
||||||
|
@custom-variant p-circle (&[data-p~="circle"]);
|
||||||
|
@custom-variant p-determinate (&[data-p~="determinate"]);
|
||||||
|
@custom-variant p-indeterminate (&[data-p~="indeterminate"]);
|
|
@ -1,5 +1,7 @@
|
||||||
const baseUrl = '/';
|
const baseUrl = '/';
|
||||||
|
|
||||||
|
import tailwindcss from '@tailwindcss/vite';
|
||||||
|
|
||||||
// https://nuxt.com/docs/api/configuration/nuxt-config
|
// https://nuxt.com/docs/api/configuration/nuxt-config
|
||||||
export default defineNuxtConfig({
|
export default defineNuxtConfig({
|
||||||
compatibilityDate: '2024-11-01',
|
compatibilityDate: '2024-11-01',
|
||||||
|
@ -29,7 +31,8 @@ export default defineNuxtConfig({
|
||||||
silenceDeprecations: ['legacy-js-api'] //@todo
|
silenceDeprecations: ['legacy-js-api'] //@todo
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
plugins: [tailwindcss()]
|
||||||
},
|
},
|
||||||
runtimeConfig: {
|
runtimeConfig: {
|
||||||
GITHUB_TOKEN: ''
|
GITHUB_TOKEN: ''
|
||||||
|
@ -71,13 +74,6 @@ export default defineNuxtConfig({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
css: ['@/assets/styles/tailwind.css', '@/assets/styles/app/app.scss', '@/assets/styles/demo/flags.css', 'primeicons/primeicons.css'],
|
css: ['@/assets/styles/tailwind.css', '@/assets/styles/app/app.scss', '@/assets/styles/demo/flags.css', 'primeicons/primeicons.css'],
|
||||||
postcss: {
|
|
||||||
plugins: {
|
|
||||||
'postcss-import': {},
|
|
||||||
tailwindcss: {},
|
|
||||||
autoprefixer: {}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
layouts: {
|
layouts: {
|
||||||
default: '~/layouts/default.vue'
|
default: '~/layouts/default.vue'
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,8 +57,9 @@
|
||||||
"sass": "catalog:app",
|
"sass": "catalog:app",
|
||||||
"sass-loader": "catalog:app",
|
"sass-loader": "catalog:app",
|
||||||
"tailwind-merge": "^3.0.2",
|
"tailwind-merge": "^3.0.2",
|
||||||
"tailwindcss": "^3",
|
"tailwindcss": "^4",
|
||||||
"tailwindcss-primeui": "catalog:",
|
"tailwindcss-primeui": "catalog:",
|
||||||
|
"@tailwindcss/vite": "4.0.9",
|
||||||
"typedoc": "0.27.9",
|
"typedoc": "0.27.9",
|
||||||
"vite": "catalog:app"
|
"vite": "catalog:app"
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,46 +0,0 @@
|
||||||
/** @type {import('tailwindcss').Config} */
|
|
||||||
import PrimeUI from 'tailwindcss-primeui';
|
|
||||||
import plugin from 'tailwindcss/plugin';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
darkMode: ['selector', '[class~="p-dark"]'],
|
|
||||||
content: ['./components/**/*.{js,vue,ts}', './doc/**/*.{js,vue,ts}', './volt/**/*.{js,vue,ts}', './layouts/**/*.vue', './pages/**/*.vue', './plugins/**/*.{js,ts}', './nuxt.config.{js,ts}', './app.vue', './error.vue'],
|
|
||||||
plugins: [
|
|
||||||
PrimeUI,
|
|
||||||
plugin(function ({ addVariant }) {
|
|
||||||
addVariant('p-invalid', '&[data-p~="invalid"]');
|
|
||||||
addVariant('p-small', '&[data-p~="small"]');
|
|
||||||
addVariant('p-large', '&[data-p~="large"]');
|
|
||||||
addVariant('p-xlarge', '&[data-p~="xlarge"]');
|
|
||||||
addVariant('p-fluid', '&[data-p~="fluid"]');
|
|
||||||
addVariant('p-filled', '&[data-p~="filled"]');
|
|
||||||
addVariant('p-horizontal', '&[data-p~="horizontal"]');
|
|
||||||
addVariant('p-vertical', '&[data-p~="vertical"]');
|
|
||||||
addVariant('p-stacked', '&[data-p~="stacked"]');
|
|
||||||
addVariant('p-checked', '&[data-p~="checked"]');
|
|
||||||
addVariant('p-disabled', '&[data-p~="disabled"]');
|
|
||||||
addVariant('p-enabled', '&:not([data-p~="disabled"])');
|
|
||||||
addVariant('p-left', '&[data-p~="left"]');
|
|
||||||
addVariant('p-right', '&[data-p~="right"]');
|
|
||||||
addVariant('p-top', '&[data-p~="top"]');
|
|
||||||
addVariant('p-bottom', '&[data-p~="bottom"]');
|
|
||||||
addVariant('p-alternate', '&[data-p~="alternate"]');
|
|
||||||
addVariant('p-active', '&[data-p~="active"]');
|
|
||||||
addVariant('p-focus-visible', '&[data-p~="focus-visible"]');
|
|
||||||
addVariant('p-readonly', '&[data-p~="readonly"]');
|
|
||||||
addVariant('p-removable', '&[data-p~="removable"]');
|
|
||||||
addVariant('p-circle', '&[data-p~="circle"]');
|
|
||||||
addVariant('p-determinate', '&[data-p~="determinate"]');
|
|
||||||
addVariant('p-indeterminate', '&[data-p~="indeterminate"]');
|
|
||||||
})
|
|
||||||
],
|
|
||||||
theme: {
|
|
||||||
screens: {
|
|
||||||
sm: '576px',
|
|
||||||
md: '768px',
|
|
||||||
lg: '992px',
|
|
||||||
xl: '1200px',
|
|
||||||
'2xl': '1920px'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
502
pnpm-lock.yaml
502
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue