This commit is contained in:
@ -17,6 +17,10 @@
|
|||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="/src/assets/main.css"
|
href="/src/assets/main.css"
|
||||||
>
|
>
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="/src/assets/tailwind.css"
|
||||||
|
>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
@ -1,7 +1,3 @@
|
|||||||
/* @tailwind base; */
|
|
||||||
/* @tailwind components; */
|
|
||||||
/* @tailwind utilities; */
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background-color: #f3f4f6;
|
background-color: #f3f4f6;
|
||||||
color: #1f2937;
|
color: #1f2937;
|
||||||
@ -14,7 +10,6 @@ body {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.attributes-group {
|
.attributes-group {
|
||||||
padding: 1.5rem;
|
padding: 1.5rem;
|
||||||
border: 1px solid #e5e7eb;
|
border: 1px solid #e5e7eb;
|
||||||
@ -28,4 +23,4 @@ body {
|
|||||||
border-color: #374151;
|
border-color: #374151;
|
||||||
background-color: #1f2937;
|
background-color: #1f2937;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
3
src/assets/tailwind.css
Normal file
3
src/assets/tailwind.css
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
|
|
Before Width: | Height: | Size: 496 B |
@ -5,7 +5,7 @@ import formKitConfig from '../formkit.config'
|
|||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
|
|
||||||
// import '@unocss/reset/tailwind-compat.css'
|
// import '@unocss/reset/tailwind-compat.css'
|
||||||
import '@unocss/reset/tailwind.css'
|
// import '@unocss/reset/tailwind.css'
|
||||||
import 'virtual:uno.css'
|
import 'virtual:uno.css'
|
||||||
|
|
||||||
const app = createApp(App)
|
const app = createApp(App)
|
||||||
|
@ -1,79 +0,0 @@
|
|||||||
:root {
|
|
||||||
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
||||||
line-height: 1.5;
|
|
||||||
font-weight: 400;
|
|
||||||
|
|
||||||
color-scheme: light dark;
|
|
||||||
color: rgba(255, 255, 255, 0.87);
|
|
||||||
background-color: #242424;
|
|
||||||
|
|
||||||
font-synthesis: none;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
font-weight: 500;
|
|
||||||
color: #646cff;
|
|
||||||
text-decoration: inherit;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #535bf2;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
display: flex;
|
|
||||||
place-items: center;
|
|
||||||
min-width: 320px;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 3.2em;
|
|
||||||
line-height: 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
border-radius: 8px;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
padding: 0.6em 1.2em;
|
|
||||||
font-size: 1em;
|
|
||||||
font-weight: 500;
|
|
||||||
font-family: inherit;
|
|
||||||
background-color: #1a1a1a;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: border-color 0.25s;
|
|
||||||
}
|
|
||||||
button:hover {
|
|
||||||
border-color: #646cff;
|
|
||||||
}
|
|
||||||
button:focus,
|
|
||||||
button:focus-visible {
|
|
||||||
outline: 4px auto -webkit-focus-ring-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
padding: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#app {
|
|
||||||
max-width: 1280px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 2rem;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: light) {
|
|
||||||
:root {
|
|
||||||
color: #213547;
|
|
||||||
background-color: #ffffff;
|
|
||||||
}
|
|
||||||
a:hover {
|
|
||||||
color: #747bff;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
background-color: #f9f9f9;
|
|
||||||
}
|
|
||||||
}
|
|
@ -2,8 +2,8 @@
|
|||||||
export default {
|
export default {
|
||||||
prefix: '',
|
prefix: '',
|
||||||
content: [
|
content: [
|
||||||
"./index.html",
|
// "./index.html",
|
||||||
"./src/**/*.vue",
|
// "./src/**/*.vue",
|
||||||
"./formkit.config.theme.ts",
|
"./formkit.config.theme.ts",
|
||||||
"./formkit.config.ts",
|
"./formkit.config.ts",
|
||||||
],
|
],
|
||||||
|
@ -4,55 +4,8 @@ import {
|
|||||||
presetUno,
|
presetUno,
|
||||||
transformerVariantGroup
|
transformerVariantGroup
|
||||||
} from "unocss";
|
} from "unocss";
|
||||||
import { fkLibrary } from "./formkit.config.fkLibrary";
|
|
||||||
import { classes, globals } from "./formkit.config.theme";
|
|
||||||
|
|
||||||
const familyList = [
|
|
||||||
...new Set(Object.values(fkLibrary).map((lib) => lib.family)),
|
|
||||||
].filter((f) => f) as string[];
|
|
||||||
const typeList = [
|
|
||||||
...new Set(Object.values(fkLibrary).map((lib) => lib.type)),
|
|
||||||
].filter((f) => f) as string[];
|
|
||||||
|
|
||||||
console.debug(`familyList :>> `, familyList);
|
|
||||||
console.debug(`typeList :>> `, typeList);
|
|
||||||
|
|
||||||
const globalsR = [
|
|
||||||
...new Set(Object.values(globals).flatMap((v) => Object.keys(v))),
|
|
||||||
];
|
|
||||||
const classesR = [
|
|
||||||
...new Set(
|
|
||||||
Object.keys(classes)
|
|
||||||
.filter(
|
|
||||||
(k) =>
|
|
||||||
familyList.some((f) => k.includes(f)) ||
|
|
||||||
typeList.some((t) => k.includes(t))
|
|
||||||
)
|
|
||||||
.map((k) => classes[k])
|
|
||||||
.flatMap((v) => Object.keys(v))
|
|
||||||
.filter((className) => !className.includes("[]"))
|
|
||||||
.filter((className) => !className.includes("&::"))
|
|
||||||
),
|
|
||||||
];
|
|
||||||
// console.debug(`classesR :>> `, classesR);
|
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
content: {
|
|
||||||
filesystem: ["xx.ts"],
|
|
||||||
inline: [
|
|
||||||
"!border-none", // for: "range__inner"
|
|
||||||
classesR.join(" "),
|
|
||||||
globalsR.join(" "),
|
|
||||||
async () => {
|
|
||||||
return "";
|
|
||||||
},
|
|
||||||
],
|
|
||||||
pipeline: {
|
|
||||||
// include: [
|
|
||||||
// /xx.ts($|\?)/,
|
|
||||||
// ],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
presets: [
|
presets: [
|
||||||
presetUno({
|
presetUno({
|
||||||
dark: "media",
|
dark: "media",
|
||||||
|
Reference in New Issue
Block a user