mirror of
https://github.com/bitwarden/help
synced 2025-12-06 00:03:30 +00:00
* crazy egg script * Client gs guides (#398) * JS for intra-article tabbing * Combine Android/iOS guide to tabbable "Getting Started with Mobile" + image. * Link changes -> redirect. * b.e. & mobile edits * GS w/ Desktop App + Images * tagging * video cleanup * header improvements * GS w/ Web Vault + reorder * orgs name change * web vault article frame * web vault article * Landing (#399) * poc * "Home" sidebar option * Events into Resources card * events <-> suggest an edit * tweaks * card fix * fix video icons * video size * margin/border on secondary cards * added table items * links & drop a stray item * more responsive secondary cards * fixed linking * link fixes * crazy egg script merge * mobile view for alignment of columns in help * mobile image width issue fix * responsiveness fixes * final edits * link check Co-authored-by: David Choi <davidgumzchoi@gmail.com>
128 lines
2.4 KiB
SCSS
128 lines
2.4 KiB
SCSS
.bd-sidebar {
|
|
order: 0;
|
|
background-color: $light;
|
|
border-bottom: 1px solid rgba(0, 0, 0, .1);
|
|
|
|
@include media-breakpoint-up(md) {
|
|
@supports (position: sticky) {
|
|
position: sticky;
|
|
top: 4rem;
|
|
z-index: 1000;
|
|
height: subtract(100vh, 4rem);
|
|
}
|
|
border-right: 1px solid rgba(0, 0, 0, .1);
|
|
}
|
|
|
|
@include media-breakpoint-up(xl) {
|
|
flex: 0 1 320px;
|
|
}
|
|
}
|
|
|
|
.bd-links {
|
|
margin-right: -15px;
|
|
margin-left: -15px;
|
|
|
|
@include media-breakpoint-up(md) {
|
|
display: block !important;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
|
|
@supports (position: sticky) {
|
|
max-height: subtract(100vh, 4rem);
|
|
overflow-y: auto;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bd-sidenav {
|
|
li {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.bd-toc-link {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: .25rem 1.5rem;
|
|
font-weight: 600;
|
|
color: rgba(0, 0, 0, .65);
|
|
transition: all 0.5s ease;
|
|
|
|
&:hover {
|
|
color: rgba(0, 0, 0, .85);
|
|
text-decoration: none;
|
|
}
|
|
|
|
&[aria-expanded="true"] {
|
|
.fa-chevron-down {
|
|
transform: rotate(180deg);
|
|
}
|
|
}
|
|
}
|
|
|
|
.bd-toc-item {
|
|
border-top: 1px solid $border-color;
|
|
padding: 0.5rem 0;
|
|
|
|
&:first-child {
|
|
border-top: 0;
|
|
}
|
|
|
|
&.active {
|
|
padding-bottom: 1.5rem;
|
|
|
|
&:not(:first-child) {
|
|
padding-top: 1rem;
|
|
}
|
|
|
|
> .bd-toc-link {
|
|
color: rgba(0, 0, 0, .85);
|
|
|
|
&:hover {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.search-header {
|
|
background-color: $light;
|
|
padding: 0.5rem;
|
|
|
|
.btn {
|
|
border: solid;
|
|
border-color: #ccd2d7;
|
|
border-width: thin;
|
|
background-color: #fff;
|
|
|
|
&:hover {
|
|
background-color: #F2F2F2;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bd-sidebar .nav {
|
|
> li > a {
|
|
border-left: 2px solid transparent;
|
|
display: block;
|
|
margin: .25rem 1.5rem;
|
|
padding-left: 1rem;
|
|
@include font-size(90%);
|
|
color: rgba(0, 0, 0, .65);
|
|
|
|
&:hover {
|
|
background-color: transparent;
|
|
color: $primary;
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
> .active > a,
|
|
> .active:hover > a {
|
|
font-weight: 600;
|
|
color: $primary;
|
|
background-color: transparent;
|
|
border-left-color: $primary;
|
|
}
|
|
}
|