max/nodarium
1
0
Fork 0
Code Issues 9 Pull Requests 1 Actions Packages Projects Releases 5 Wiki Activity

refactor: use tailwind custom colors for themes

Browse Source 
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:
Max Richter
2026-02-03 12:16:12 +01:00
parent 89e4cf8364
commit b19da950a6
35 changed files with 379 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/src/lib/sidebar/Sidebar.svelte
View File

@@ -8,7 +8,6 @@
<div class="wrapper" class:visible={state.activePanel.value}>
<div class="tabs">
<button aria-label="Close" onclick={() => state.toggleOpen()}>
<span class="icon-[tabler--settings]"></span>
<span class="absolute i-[tabler--chevron-left] w-6 h-6 block"></span>
</button>
{#each state.keys as panelId (panelId)}
@@ -45,7 +44,7 @@
}
.content {
background: var(--layer-1);
background: var(--color-layer-1);
z-index: 10;
position: relative;
max-height: 100vh;
@@ -55,7 +54,7 @@
.tabs {
display: flex;
flex-direction: column;
border-right: solid thin var(--outline);
border-right: solid thin var(--color-outline);
}
.tabs > button {
@@ -66,9 +65,9 @@
border: none;
display: flex;
align-items: center;
border-bottom: solid thin var(--outline);
border-left: solid thin var(--outline);
background: var(--layer-1);
border-bottom: solid thin var(--color-outline);
border-left: solid thin var(--color-outline);
background: var(--color-layer-1);
}
.tabs > button > span {
@@ -76,7 +75,7 @@
}
.tabs > button.active {
background: var(--layer-2);
background: var(--color-layer-2);
}
.tabs > button.active span {