CSS optimization

This commit is contained in:
Janus C. H. Knudsen 2026-01-14 00:47:06 +01:00
parent e739ce2ac7
commit 29f9c79764
22 changed files with 1175 additions and 642 deletions

View file

@ -55,17 +55,17 @@ swp-menu-toggle {
cursor: pointer;
color: var(--color-text-secondary);
transition: all var(--transition-fast);
}
swp-menu-toggle:hover {
background: var(--color-background-hover);
color: var(--color-text);
}
swp-menu-toggle i {
font-size: 18px;
color: inherit;
transition: transform var(--transition-normal);
& i {
font-size: 18px;
color: inherit;
transition: transform var(--transition-normal);
}
&:hover {
background: var(--color-background-hover);
color: var(--color-text);
}
}
/* ===========================================
@ -106,26 +106,23 @@ a[is="swp-side-menu-item"] {
transition: all var(--transition-fast);
border-left: 3px solid transparent;
text-decoration: none;
}
swp-side-menu-item:hover,
a[is="swp-side-menu-item"]:hover {
background: var(--color-background-hover);
text-decoration: none;
}
swp-side-menu-item[data-active="true"],
a[is="swp-side-menu-item"][data-active="true"] {
background: var(--color-teal-light);
border-left-color: var(--color-teal);
color: var(--color-teal);
font-weight: 500;
}
swp-side-menu-item i,
a[is="swp-side-menu-item"] i {
font-size: 20px;
flex-shrink: 0;
& i {
font-size: 20px;
flex-shrink: 0;
}
&:hover {
background: var(--color-background-hover);
text-decoration: none;
}
&[data-active="true"] {
background: var(--color-teal-light);
border-left-color: var(--color-teal);
color: var(--color-teal);
font-weight: 500;
}
}
/* ===========================================
@ -155,24 +152,24 @@ swp-side-menu-action {
cursor: pointer;
transition: all var(--transition-fast);
font-family: var(--font-family);
}
swp-side-menu-action:hover {
background: var(--color-background-hover);
}
swp-side-menu-action.lock:hover {
color: var(--color-amber);
border-color: var(--color-amber);
}
swp-side-menu-action.logout:hover {
color: var(--color-red);
border-color: var(--color-red);
}
swp-side-menu-action i {
font-size: 18px;
& i {
font-size: 18px;
}
&:hover {
background: var(--color-background-hover);
}
&.lock:hover {
color: var(--color-amber);
border-color: var(--color-amber);
}
&.logout:hover {
color: var(--color-red);
border-color: var(--color-red);
}
}
/* ===========================================