first draft of home page
This commit is contained in:
+101
-24
@@ -18,7 +18,6 @@
|
||||
--text-4xl: 2.25rem;
|
||||
--text-5xl: 3rem;
|
||||
--font-weight-bold: 700;
|
||||
--font-weight-black: 900;
|
||||
--radius-lg: var(--radius);
|
||||
--default-font-family: var(--font-sans);
|
||||
--default-mono-font-family: var(--font-mono);
|
||||
@@ -178,23 +177,29 @@
|
||||
.mt-\[1em\] {
|
||||
margin-top: 1em;
|
||||
}
|
||||
.mt-\[3em\] {
|
||||
margin-top: 3em;
|
||||
}
|
||||
.mb-\[1em\] {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.mb-\[3em\] {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.h-\[100\%\] {
|
||||
height: 100%;
|
||||
}
|
||||
.min-h-\[100\%\] {
|
||||
min-height: 100%;
|
||||
}
|
||||
.min-h-full {
|
||||
min-height: 100%;
|
||||
}
|
||||
.flex-grow-1 {
|
||||
flex-grow: 1;
|
||||
.max-w-\[50\%\] {
|
||||
max-width: 50%;
|
||||
}
|
||||
.max-w-full {
|
||||
max-width: 100%;
|
||||
}
|
||||
.grow {
|
||||
flex-grow: 1;
|
||||
@@ -211,14 +216,11 @@
|
||||
.items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
.gap-\[1em\] {
|
||||
gap: 1em;
|
||||
.justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
.overflow-auto {
|
||||
overflow: auto;
|
||||
}
|
||||
.overflow-x-auto {
|
||||
overflow-x: auto;
|
||||
.gap-y-\[2em\] {
|
||||
row-gap: 2em;
|
||||
}
|
||||
.overflow-x-scroll {
|
||||
overflow-x: scroll;
|
||||
@@ -226,21 +228,37 @@
|
||||
.overflow-y-hidden {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
.rounded-lg {
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
.border-\[1px\] {
|
||||
border-style: var(--tw-border-style);
|
||||
border-width: 1px;
|
||||
}
|
||||
.border-sidebar-border {
|
||||
border-color: var(--sidebar-border);
|
||||
}
|
||||
.bg-background {
|
||||
background-color: var(--background);
|
||||
}
|
||||
.bg-header {
|
||||
background-color: var(--base-200);
|
||||
.bg-card {
|
||||
background-color: var(--card);
|
||||
}
|
||||
.p-\[1em\] {
|
||||
padding: 1em;
|
||||
}
|
||||
.p-\[2em\] {
|
||||
padding: 2em;
|
||||
}
|
||||
.pt-\[1em\] {
|
||||
padding-top: 1em;
|
||||
}
|
||||
.pb-\[1em\] {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.text-lg {
|
||||
font-size: var(--text-lg);
|
||||
line-height: var(--tw-leading, var(--text-lg--line-height));
|
||||
@@ -249,10 +267,6 @@
|
||||
font-size: var(--text-xl);
|
||||
line-height: var(--tw-leading, var(--text-xl--line-height));
|
||||
}
|
||||
.font-black {
|
||||
--tw-font-weight: var(--font-weight-black);
|
||||
font-weight: var(--font-weight-black);
|
||||
}
|
||||
.font-bold {
|
||||
--tw-font-weight: var(--font-weight-bold);
|
||||
font-weight: var(--font-weight-bold);
|
||||
@@ -341,6 +355,44 @@
|
||||
--sidebar-accent-foreground: var(--base-800);
|
||||
--sidebar-border: var(--base-200);
|
||||
--sidebar-ring: var(--primary-300);
|
||||
--display-color: var(--foreground);
|
||||
--text-color: var(--foreground);
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--background: var(--base-950);
|
||||
--foreground: var(--base-200);
|
||||
--card: var(--base-900);
|
||||
--card-foreground: var(--base-200);
|
||||
--popover: var(--base-900);
|
||||
--popover-foreground: var(--base-200);
|
||||
--primary: var(--primary-300);
|
||||
--primary-foreground: var(--color-black);
|
||||
--secondary: var(--secondary-500);
|
||||
--secondary-foreground: var(--color-black);
|
||||
--muted: var(--base-800);
|
||||
--muted-foreground: var(--base-300);
|
||||
--accent: var(--base-800);
|
||||
--accent-foreground: var(--base-200);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--border: var(--base-800);
|
||||
--input: var(--base-700);
|
||||
--ring: var(--primary-300);
|
||||
--chart-1: var(--primary-300);
|
||||
--chart-2: var(--secondary-500);
|
||||
--chart-3: var(--primary-400);
|
||||
--chart-4: var(--secondary-300);
|
||||
--chart-5: var(--primary-300);
|
||||
--sidebar: var(--base-900);
|
||||
--sidebar-foreground: var(--base-200);
|
||||
--sidebar-primary: var(--primary-300);
|
||||
--sidebar-primary-foreground: var(--color-black);
|
||||
--sidebar-accent: var(--base-800);
|
||||
--sidebar-accent-foreground: var(--base-200);
|
||||
--sidebar-border: var(--base-800);
|
||||
--sidebar-ring: var(--primary-300);
|
||||
}
|
||||
}
|
||||
* {
|
||||
color: var(--foreground);
|
||||
}
|
||||
.dark {
|
||||
--background: var(--base-950);
|
||||
@@ -417,17 +469,41 @@
|
||||
font-weight: var(--text-weight);
|
||||
}
|
||||
}
|
||||
@layer theme {
|
||||
@layer component {
|
||||
header, footer {
|
||||
background-color: var(--base-200);
|
||||
background-color: var(--sidebar);
|
||||
}
|
||||
a.selected {
|
||||
background-color: var(--sidebar-accent);
|
||||
}
|
||||
}
|
||||
@layer base {
|
||||
header, footer {
|
||||
border-color: var(--sidebar-border);
|
||||
}
|
||||
header {
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
footer {
|
||||
border-top-width: 1px;
|
||||
}
|
||||
select {
|
||||
border-width: 2px;
|
||||
border-color: var(--border);
|
||||
border-radius: var(--radius-lg);
|
||||
}
|
||||
.border-thin {
|
||||
border-width: 1px;
|
||||
}
|
||||
.border-button {
|
||||
border-width: 2px;
|
||||
border-radius: var(--radius-lg);
|
||||
}
|
||||
}
|
||||
@property --tw-border-style {
|
||||
syntax: "*";
|
||||
inherits: false;
|
||||
initial-value: solid;
|
||||
}
|
||||
@property --tw-font-weight {
|
||||
syntax: "*";
|
||||
@@ -436,6 +512,7 @@
|
||||
@layer properties {
|
||||
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
||||
*, ::before, ::after, ::backdrop {
|
||||
--tw-border-style: solid;
|
||||
--tw-font-weight: initial;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user