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

@ -32,40 +32,40 @@ swp-topbar-search {
border-radius: var(--border-radius);
width: 320px;
transition: border-color var(--transition-fast);
}
swp-topbar-search:focus-within {
border-color: var(--color-teal);
}
swp-topbar-search i {
font-size: 18px;
color: var(--color-text-secondary);
flex-shrink: 0;
}
swp-topbar-search input {
flex: 1;
border: none;
outline: none;
background: transparent;
font-size: var(--font-size-md);
font-family: var(--font-family);
color: var(--color-text);
}
swp-topbar-search input::placeholder {
color: var(--color-text-secondary);
}
swp-topbar-search kbd {
font-size: var(--font-size-xs);
font-family: var(--font-mono);
padding: 2px 6px;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: 4px;
color: var(--color-text-secondary);
&:focus-within {
border-color: var(--color-teal);
}
& i {
font-size: 18px;
color: var(--color-text-secondary);
flex-shrink: 0;
}
& input {
flex: 1;
border: none;
outline: none;
background: transparent;
font-size: var(--font-size-md);
font-family: var(--font-family);
color: var(--color-text);
&::placeholder {
color: var(--color-text-secondary);
}
}
& kbd {
font-size: var(--font-size-xs);
font-family: var(--font-mono);
padding: 2px 6px;
background: var(--color-surface);
border: 1px solid var(--color-border);
border-radius: 4px;
color: var(--color-text-secondary);
}
}
/* ===========================================
@ -91,14 +91,14 @@ swp-topbar-btn {
transition: background var(--transition-fast);
position: relative;
color: var(--color-text-secondary);
}
swp-topbar-btn:hover {
background: var(--color-background-hover);
}
swp-topbar-btn i {
font-size: 22px;
& i {
font-size: 22px;
}
&:hover {
background: var(--color-background-hover);
}
}
/* Notification Badge */
@ -140,11 +140,11 @@ swp-topbar-profile {
border-radius: var(--border-radius);
cursor: pointer;
transition: all var(--transition-fast);
}
swp-topbar-profile:hover {
background: var(--color-background-hover);
border-color: var(--color-border);
&:hover {
background: var(--color-background-hover);
border-color: var(--color-border);
}
}
swp-profile-avatar {