Macrame/panels/test_panel/output.css
2025-04-13 13:07:15 +02:00

69 lines
1.3 KiB
CSS

/*! tailwindcss v4.1.2 | MIT License | https://tailwindcss.com */
@layer theme, utilities;
@layer theme {
:root, :host {
--color-red-500: oklch(63.7% 0.237 25.331);
--color-sky-400: oklch(74.6% 0.16 232.661);
--color-rose-400: oklch(71.2% 0.194 13.428);
--color-slate-400: oklch(70.4% 0.04 256.788);
--color-slate-500: oklch(55.4% 0.046 257.417);
--spacing: 0.25rem;
}
}
@layer utilities {
.m-0 {
margin: calc(var(--spacing) * 0);
}
.flex {
display: flex;
}
.grid {
display: grid;
}
.aspect-\[9\/20\] {
aspect-ratio: 9/20;
}
.size-full {
width: 100%;
height: 100%;
}
.h-full {
height: 100%;
}
.h-screen {
height: 100vh;
}
.w-screen {
width: 100vw;
}
.grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-rows-8 {
grid-template-rows: repeat(8, minmax(0, 1fr));
}
.items-center {
align-items: center;
}
.justify-center {
justify-content: center;
}
.gap-2 {
gap: calc(var(--spacing) * 2);
}
.bg-rose-400 {
background-color: var(--color-rose-400);
}
.bg-sky-400 {
background-color: var(--color-sky-400);
}
.bg-slate-400 {
background-color: var(--color-slate-400);
}
.bg-slate-500 {
background-color: var(--color-slate-500);
}
}
body * {
box-sizing: border-box;
}