CSS optimization
This commit is contained in:
parent
e739ce2ac7
commit
29f9c79764
22 changed files with 1175 additions and 642 deletions
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
||||
/* ===========================================
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue