101 lines
2.7 KiB
CSS
101 lines
2.7 KiB
CSS
:root {
|
|
--sidebarSpeed: 0.2s;
|
|
--sidebarDelay: 0.1s;
|
|
--actionBarDelay: 0.15s;
|
|
--sidebarEase: "ease";
|
|
--sidebarWidth: 360px;
|
|
}
|
|
/* Hide action bar */
|
|
{actionBarClass} {
|
|
max-width: 0;
|
|
overflow: hidden;
|
|
border-right-color: var(--web-wash);
|
|
transition: max-width var(--sidebarSpeed);
|
|
transition-delay: var(--actionBarDelay);
|
|
}
|
|
|
|
max-width: 211px;
|
|
border-right-color: var(--media-inner-border);
|
|
}
|
|
/* Header */
|
|
.x9f619.x1n2onr6.x1ja2u2z.x78zum5.x2lah0s.x1qughib.x6s0dn4.xozqiw3.x1q0g3np.x1sy10c2.xktsk01.xod5an3.x1d52u69 {
|
|
opacity: 0;
|
|
height: 0;
|
|
margin: 0 16px;
|
|
overflow: hidden;
|
|
transition: var(--sidebarSpeed);
|
|
}
|
|
/* Search */
|
|
.x9f619.x1n2onr6.x1ja2u2z.xsag5q8.x1yrsyyn {
|
|
opacity: 0;
|
|
height: 0;
|
|
overflow: hidden;
|
|
transition: var(--sidebarSpeed);
|
|
}
|
|
/* Text Header */
|
|
.x1cvmir6[role="navigation"] .x1heor9g.x1qlqyl8.x1pd3egz.x1a2a7pz {
|
|
width: 150px;
|
|
}
|
|
/* Unread Message Indicator */
|
|
.x1cvmir6[role="navigation"] .x1fsd2vl[data-visualcompletion="ignore"] {
|
|
position: relative;
|
|
right: 83px;
|
|
transition-delay: var(--sidebarDelay);
|
|
}
|
|
/* Notification bell */
|
|
.x1cvmir6[role="navigation"] .xozqiw3.x78zum5.x6s0dn4 svg {
|
|
display: none;
|
|
}
|
|
/* Hide contents */
|
|
.x9f619.x1n2onr6.x1ja2u2z.x78zum5.x1iyjqo2.xs83m0k.xeuugli.x1qughib.x6s0dn4.x1a02dak.x1q0g3np.xdl72j9 {
|
|
overflow: hidden;
|
|
}
|
|
/* Sidebar (not focused) */
|
|
.x1cvmir6 {
|
|
width: 80px;
|
|
min-width: 80px;
|
|
transition: width var(--sidebarSpeed) var(--sidebarEase);
|
|
transition-delay: var(--sidebarDelay);
|
|
}
|
|
@media only screen and (min-width: 900px) {
|
|
/* Sidebar (focused) */
|
|
.x1cvmir6[role="navigation"]:hover,
|
|
width: var(--sidebarWidth);
|
|
transition-delay: 0s;
|
|
}
|
|
/* Header (focused) */
|
|
if hideHeader == "withSidebar" {
|
|
opacity: 1;
|
|
height: auto;
|
|
overflow: visible;
|
|
margin: 20px 16px 12px 16px;
|
|
}
|
|
/* Search (focused) */
|
|
if hideSearch != "always" {
|
|
opacity: 1;
|
|
height: auto;
|
|
overflow: visible;
|
|
}
|
|
/* Unread Message Indicator (focused) */
|
|
.x1cvmir6[role="navigation"]:hover .x1fsd2vl[data-visualcompletion="ignore"],
|
|
right: 0;
|
|
transition-delay: 0s;
|
|
}
|
|
/* Notification bell (focused) */
|
|
.x1cvmir6[role="navigation"]:hover .xozqiw3.x78zum5.x6s0dn4 svg,
|
|
display: block;
|
|
}
|
|
/* Scrollbar */
|
|
.x1cvmir6[role="navigation"] .x78zum5.xdt5ytf.x1iyjqo2.xs83m0k.x1xzczws.x6ikm8r.x1rife3k.x1n2onr6.xh8yej3 {
|
|
overflow-y: hidden;
|
|
}
|
|
/* Scrollbar (focused) */
|
|
.x1cvmir6[role="navigation"]:hover .x78zum5.xdt5ytf.x1iyjqo2.xs83m0k.x1xzczws.x6ikm8r.x1rife3k.x1n2onr6.xh8yej3,
|
|
overflow-y: scroll;
|
|
}
|
|
/* Hide contents (focused) */
|
|
.x1cvmir6[role="navigation"]:hover .x9f619.x1n2onr6.x1ja2u2z.x78zum5.x1iyjqo2.xs83m0k.xeuugli.x1qughib.x6s0dn4.x1a02dak.x1q0g3np.xdl72j9,
|
|
overflow: visible;
|
|
}
|
|
}
|