refactor: use tailwind custom colors for themes
Use tailwind v4 @theme block so we can use bg-layer-0 instead of bg-[--layer-0] for theme colors.
This commit is contained in:
@@ -71,22 +71,22 @@
|
||||
user-select: none !important;
|
||||
cursor: pointer;
|
||||
width: 200px;
|
||||
color: var(--text-color);
|
||||
color: var(--color-text);
|
||||
transform: translate3d(var(--nx), var(--ny), 0);
|
||||
z-index: 1;
|
||||
opacity: calc((var(--cz) - 2.5) / 3.5);
|
||||
font-weight: 300;
|
||||
--stroke: var(--outline);
|
||||
--stroke: var(--color-outline);
|
||||
--stroke-width: 2px;
|
||||
}
|
||||
|
||||
.node.active {
|
||||
--stroke: var(--active);
|
||||
--stroke: var(--color-active);
|
||||
--stroke-width: 2px;
|
||||
}
|
||||
|
||||
.node.selected {
|
||||
--stroke: var(--selected);
|
||||
--stroke: var(--color-selected);
|
||||
--stroke-width: 2px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -109,7 +109,7 @@
|
||||
svg path {
|
||||
stroke-width: 0.2px;
|
||||
transition: d 0.3s ease, fill 0.3s ease;
|
||||
fill: var(--layer-2);
|
||||
fill: var(--color-layer-2);
|
||||
stroke: var(--stroke);
|
||||
stroke-width: var(--stroke-width);
|
||||
d: var(--path);
|
||||
|
||||
@@ -175,7 +175,7 @@
|
||||
|
||||
svg path {
|
||||
transition: d 0.3s ease, fill 0.3s ease;
|
||||
fill: var(--layer-1);
|
||||
fill: var(--color-layer-1);
|
||||
stroke: var(--stroke);
|
||||
stroke-width: var(--stroke-width);
|
||||
d: var(--path);
|
||||
|
||||
Reference in New Issue
Block a user