bnilsen/custom_ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add theme store and input, update some components to use theme

Browse source
This commit is contained in:
Casey 2025-12-12 14:21:42 -06:00
parent 43c205e577
commit 0c55c9996f
12 changed files with 459 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

16
frontend/src/components/SideBar.vue
View file

@ -204,15 +204,15 @@ const handleCategoryClick = (category) => {
<style lang="css">
.sidebar-button.active,
.sidebar-button.active:hover{
background-color: var(--primary-color);
background-color: var(--theme-primary);
color: white;
border-left: 3px solid var(--primary-600);
border-left: 3px solid var(--theme-primary-strong);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}
.sidebar-button:hover {
background-color: var(--surface-hover);
color: var(--primary-color);
color: var(--theme-primary);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.24);
transform: translateX(1px);
}
@ -234,7 +234,7 @@ const handleCategoryClick = (category) => {
}
.sidebar-button:hover .button-icon {
opacity: 1;
color: black;
color: var(--theme-primary);
}
.button-text {
@ -285,7 +285,7 @@ const handleCategoryClick = (category) => {
min-width: 170px;
align-self: flex-start;
gap: 5px;
background-color: var(--surface-ground);
background-color: var(--theme-surface-alt);
padding: 10px;
border-radius: 8px;
margin-top: 10px;
@ -306,9 +306,9 @@ const handleCategoryClick = (category) => {
width: 28px;
height: 28px;
border-radius: 50%;
border: 2px solid var(--primary-color);
border: 2px solid var(--theme-primary);
background-color: var(--surface-0);
color: var(--primary-color);
color: var(--theme-primary);
display: flex;
align-items: center;
justify-content: center;
@ -319,7 +319,7 @@ const handleCategoryClick = (category) => {
}
.sidebar-toggle:hover {
background-color: var(--primary-color);
background-color: var(--theme-primary);
color: white;
transform: scale(1.15);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);