folinhilo/defgov
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: Re-connected to Gitea

Browse Source
This commit is contained in:
folinhilo
2026-03-22 04:39:45 +08:00
commit 8e76dd7a7b
103 changed files with 7132 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
packages/ui/src/styles/theme/theme-base.css Normal file
View File

@@ -0,0 +1,36 @@
@theme {
--danger-fg: var(--base-fg);
--danger-bg-low-hover: var(--color-red-100);
--danger-bg-low-active: var(--color-red-200);
--danger-bg: var(--color-red-600);
--danger-bg-high-hover: var(--color-red-700);
--danger-bg-high-active: var(--color-red-800);
--danger-border-color: var(--color-transparent);
--success-fg: var(--base-fg);
--success-bg-low-hover: var(--color-green-100);
--success-bg-low-active: var(--color-green-200);
--success-bg: var(--color-green-600);
--success-bg-high-hover: var(--color-green-700);
--success-bg-high-active: var(--color-green-800);
--info-fg: var(--base-fg);
--info-bg-low-hover: var(--color-sky-100);
--info-bg-low-active: var(--color-sky-200);
--info-bg: var(--color-sky-600);
--info-bg-high-hover: var(--color-sky-700);
--info-bg-high-active: var(--color-sky-800);
--info-border-color: var(--color-transparent);
--warning-fg: var(--base-fg);
--warning-bg-low-hover: var(--color-amber-100);
--warning-bg-low-active: var(--color-amber-200);
--warning-bg: var(--color-amber-600);
--warning-bg-high-hover: var(--color-amber-700);
--warning-bg-high-active: var(--color-amber-800);
--warning-border-color: var(--color-transparent);
--emphasis-fg: var(--base-fg);
--emphasis-bg-low-hover: var(--color-gray-100);
--emphasis-bg-low-active: var(--color-gray-200);
--emphasis-bg: var(--color-gray-600);
--emphasis-bgr-high-hover: var(--color-gray-700);
--emphasis-bg-high-active: var(--color-gray-800);
--emphasis-border-color: var(--color-transparent);
}

25
packages/ui/src/styles/theme/theme-variant.css Normal file
View File

@@ -0,0 +1,25 @@
@theme {
--filled-fg: var(--color-white);
--filled-fg-hover: var(--brand-fg);
--filled-fg-active: var(--brand-fg);
--filled-bg: var(--brand-bg);
--filled-bg-hover: var(--brand-bg-high-hover);
--filled-bg-active: var(--brand-bg-high-active);
--filled-border-color: var(--brand-border-color);
--outline-fg: var(--brand-bg);
--outline-fg-hover: var(--brand-bg);
--outline-fg-active: var(--brand-bg);
--outline-bg: var(--brand-border-color);
--outline-bg-hover: var(--brand-bg-low-hover);
--outline-bg-active: var(--brand-bg-low-active);
--outline-border-color: var(--brand-bg);
--subtle-fg: var(--brand-bg);
--subtle-fg-hover: var(--brand-bg);
--subtle-fg-active: var(--brand-bg);
--subtle-bg: var(--brand-border-color);
--subtle-bg-hover: var(--brand-bg-low-hover);
--subtle-bg-active: var(--brand-bg-low-active);
--subtle-border-color: var(--brand-border-color);
}

45
packages/ui/src/styles/utility/brand.css Normal file
View File

@@ -0,0 +1,45 @@
@utility brand-info {
--brand-fg: var(--info-fg);
--brand-bg-low-hover: var(--info-bg-low-hover);
--brand-bg-low-active: var(--info-bg-low-active);
--brand-bg: var(--info-bg);
--brand-bg-high-hover: var(--info-bg-high-hover);
--brand-bg-high-active: var(--info-bg-high-active);
--brand-border-color: var(--info-border-color);
}
@utility brand-danger {
--brand-fg: var(--danger-fg);
--brand-bg-low-hover: var(--danger-bg-low-hover);
--brand-bg-low-active: var(--danger-bg-low-active);
--brand-bg: var(--danger-bg);
--brand-bg-high-hover: var(--danger-bg-high-hover);
--brand-bg-high-active: var(--danger-bg-high-active);
--brand-border-color: var(--danger-border-color);
}
@utility brand-success {
--brand-fg: var(--success-fg);
--brand-bg-low-hover: var(--success-bg-low-hover);
--brand-bg-low-active: var(--success-bg-low-active);
--brand-bg: var(--success-bg);
--brand-bg-high-hover: var(--success-bg-high-hover);
--brand-bg-high-active: var(--success-bg-high-active);
--brand-border-color: var(--success-border-color);
}
@utility brand-warning {
--brand-fg: var(--warning-fg);
--brand-bg-low-hover: var(--warning-bg-low-hover);
--brand-bg-low-active: var(--warning-bg-low-active);
--brand-bg: var(--warning-bg);
--brand-bg-high-hover: var(--warning-bg-high-hover);
--brand-bg-high-active: var(--warning-bg-high-active);
--brand-border-color: var(--warning-border-color);
}
@utility brand-emphasis {
--brand-fg: var(--emphasis-fg);
--brand-bg-low-hover: var(--emphasis-bg-low-hover);
--brand-bg-low-active: var(--emphasis-bg-low-active);
--brand-bg: var(--emphasis-bg);
--brand-bg-high-hover: var(--emphasis-bg-high-hover);
--brand-bg-high-active: var(--emphasis-bg-high-active);
--brand-border-color: var(--emphasis-border-color);
}

18
packages/ui/src/styles/utility/gap.css Normal file
View File

@@ -0,0 +1,18 @@
@utility gap-xs {
gap: calc(var(--spacing) * 0.5);
}
@utility gap-sm {
gap: calc(var(--spacing) * 2);
}
@utility gap-md {
gap: calc(var(--spacing) * 3);
}
@utility gap-lg {
gap: calc(var(--spacing) * 4);
}
@utility gap-xl {
gap: calc(var(--spacing) * 5);
}
@utility gap-2xl {
gap: calc(var(--spacing) * 6);
}

36
packages/ui/src/styles/utility/height.css Normal file
View File

@@ -0,0 +1,36 @@
@utility h-xs {
height: calc(var(--spacing) * 5);
}
@utility h-sm {
height: calc(var(--spacing) * 6);
}
@utility h-md {
height: calc(var(--spacing) * 8);
}
@utility h-lg {
height: calc(var(--spacing) * 9);
}
@utility h-xl {
height: calc(var(--spacing) * 11);
}
@utility h-2xl {
height: calc(var(--spacing) * 16);
}
@utility h-inline-xs {
height: var(--text-xs--line-height);
}
@utility h-inline-sm {
height: var(--text-sm--line-height);
}
@utility h-inline-md {
height: var(--text-base--line-height);
}
@utility h-inline-lg {
height: var(--text-lg--line-height);
}
@utility h-inline-xl {
height: var(--text-xl--line-height);
}
@utility h-inline-2xl {
height: var(--text-2xl--line-height);
}

16
packages/ui/src/styles/utility/loading.css Normal file
View File

@@ -0,0 +1,16 @@
@utility loading-true {
position: "absolute";
top: "50%";
left: "50%";
transform: "translate(-50%, -50%)";
opacity: 1;
transition: "top 0.15s ease-in, opacity 0.1s ease-in";
}
@utility loading-false {
position: "absolute";
top: "-50%";
left: "50%";
transform: "translate(-50%, -50%)";
opacity: 0;
transition: "top 0.15s ease-out, opacity 0.1s ease-out";
}

21
packages/ui/src/styles/utility/margin.css Normal file
View File

@@ -0,0 +1,21 @@
@utility mr-none {
margin-right: 0;
}
@utility mr-xs {
margin-right: calc(var(--spacing) * 1);
}
@utility mr-sm {
margin-right: calc(var(--spacing) * 2);
}
@utility mr-md {
margin-right: calc(var(--spacing) * 3);
}
@utility mr-lg {
margin-right: calc(var(--spacing) * 4);
}
@utility mr-xl {
margin-right: calc(var(--spacing) * 2);
}
@utility mr-2xl {
margin-right: calc(var(--spacing) * 2);
}

36
packages/ui/src/styles/utility/padding.css Normal file
View File

@@ -0,0 +1,36 @@
@utility px-xs {
padding-inline: calc(var(--spacing) * 2);
}
@utility px-sm {
padding-inline: calc(var(--spacing) * 3);
}
@utility px-md {
padding-inline: calc(var(--spacing) * 4);
}
@utility px-lg {
padding-inline: calc(var(--spacing) * 5);
}
@utility px-xl {
padding-inline: calc(var(--spacing) * 6);
}
@utility px-2xl {
padding-inline: calc(var(--spacing) * 8);
}
@utility py-xs {
padding-block: calc(var(--spacing) * 1);
}
@utility py-sm {
padding-block: calc(var(--spacing) * 2);
}
@utility py-md {
padding-block: calc(var(--spacing) * 3);
}
@utility py-lg {
padding-block: calc(var(--spacing) * 4);
}
@utility py-xl {
padding-block: calc(var(--spacing) * 5);
}
@utility py-2xl {
padding-block: calc(var(--spacing) * 6);
}

13
packages/ui/src/styles/utility/skin.css Normal file
View File

@@ -0,0 +1,13 @@
@utility light {
--base-fg: var(--color-gray-950);
--base-bg: var(--color-white);
--base-fg-subtext: var(--color-gray-500);
--base-bg-subtext: var(--color-gray-200);
}
@utility dark {
--base-fg: var(--color-gray-50);
--base-bg: var(--color-black);
--base-fg-subtext: var(--color-gray-400);
--base-bg-subtext: var(--color-gray-600);
}

137
packages/ui/src/styles/utility/variant.css Normal file
View File

@@ -0,0 +1,137 @@
@utility variant-filled {
color: var(--filled-fg);
background-color: var(--filled-bg);
border-color: var(--filled-border-color);
&:hover {
background-color: var(--filled-bg-hover);
}
&:active {
background-color: var(--filled-bg-active);
}
&:focus-visible {
background-color: var(--filled-bg-hover);
}
}
@utility variant-outline {
color: var(--outline-fg);
background-color: var(--outline-bg);
border-color: var(--outline-border-color);
&:hover {
background-color: var(--outline-bg-hover);
}
&:active {
background-color: var(--outline-bg-active);
}
&:focus-visible {
background-color: var(--outline-bg-hover);
}
}
@utility variant-subtle {
color: var(--subtle-fg);
background-color: var(--subtle-bg);
border-color: var(--subtle-border-color);
&:hover {
background-color: var(--subtle-bg-hover);
}
&:active {
background-color: var(--subtle-bg-active);
}
&:focus-visible {
background-color: var(--subtle-bg-hover);
}
}
@utility variant-filled-disabled {
color: var(--filled-fg);
background-color: var(--filled-bg);
border-color: var(--filled-border-color);
filter: grayscale(50%);
&:hover {
color: var(--filled-fg);
background-color: var(--filled-bg);
border-color: var(--filled-border-color);
filter: grayscale(50%);
}
&:active {
color: var(--filled-fg);
background-color: var(--filled-bg);
border-color: var(--filled-border-color);
filter: grayscale(50%);
}
&:focus-visible {
color: var(--filled-fg);
background-color: var(--filled-bg);
border-color: var(--filled-border-color);
filter: grayscale(50%);
}
}
@utility variant-outline-disabled {
color: var(--outline-fg);
background-color: var(--outline-bg);
border-color: var(--outline-border-color);
filter: grayscale(50%);
&:hover {
color: var(--outline-fg);
background-color: var(--outline-bg);
border-color: var(--outline-border-color);
filter: grayscale(50%);
}
&:active {
color: var(--outline-fg);
background-color: var(--outline-bg);
border-color: var(--outline-border-color);
filter: grayscale(50%);
}
&:focus-visible {
color: var(--outline-fg);
background-color: var(--outline-bg);
border-color: var(--outline-border-color);
filter: grayscale(50%);
}
}
@utility variant-subtle-disabled {
color: var(--subtle-fg);
background-color: var(--subtle-bg);
border-color: var(--subtle-border-color);
filter: grayscale(50%);
&:hover {
color: var(--subtle-fg);
background-color: var(--subtle-bg);
border-color: var(--subtle-border-color);
filter: grayscale(50%);
}
&:active {
color: var(--subtle-fg);
background-color: var(--subtle-bg);
border-color: var(--subtle-border-color);
filter: grayscale(50%);
}
&:focus-visible {
color: var(--subtle-fg);
background-color: var(--subtle-bg);
border-color: var(--subtle-border-color);
filter: grayscale(50%);
}
}

36
packages/ui/src/styles/utility/width.css Normal file
View File

@@ -0,0 +1,36 @@
@utility w-xs {
width: calc(var(--spacing) * 5);
}
@utility w-sm {
width: calc(var(--spacing) * 6);
}
@utility w-md {
width: calc(var(--spacing) * 8);
}
@utility w-lg {
width: calc(var(--spacing) * 9);
}
@utility w-xl {
width: calc(var(--spacing) * 11);
}
@utility w-2xl {
width: calc(var(--spacing) * 16);
}
@utility w-inline-xs {
width: var(--text-xs--line-height);
}
@utility w-inline-sm {
width: var(--text-sm--line-height);
}
@utility w-inline-md {
width: var(--text-base--line-height);
}
@utility w-inline-lg {
width: var(--text-lg--line-height);
}
@utility w-inline-xl {
width: var(--text-xl--line-height);
}
@utility w-inline-2xl {
width: var(--text-2xl--line-height);
}