mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-14 01:11:25 +08:00
2caac7906e
* refactor(docs): adjust style details * refactor(docs): add toc width * refactor(docs): remove unused var * fix(docs): typography & button etc pages width unify
84 lines
1.6 KiB
SCSS
84 lines
1.6 KiB
SCSS
@use './mixins' as *;
|
|
// @use './sidebar-link.scss';
|
|
|
|
.sidebar {
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
z-index: var(--sidebar-z-index);
|
|
width: var(--sidebar-width-xs);
|
|
background-color: var(--bg-color);
|
|
overflow-y: auto;
|
|
transform: translate(-100%);
|
|
transition: background-color 0.5s, opacity 0.25s,
|
|
transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
|
|
|
|
&.open {
|
|
transform: translate(0);
|
|
}
|
|
|
|
// .nav.sponsors {
|
|
// padding: 2rem 1.5rem 0 1.5rem;
|
|
|
|
// .sponsors-list {
|
|
// display: flex;
|
|
// align-items: center;
|
|
// padding: 0;
|
|
// margin: 0;
|
|
// }
|
|
|
|
// .sponsors-title {
|
|
// margin-top: 0;
|
|
// color: #777;
|
|
// font-weight: 300;
|
|
// font-size: 0.9rem;
|
|
// }
|
|
|
|
// .sponsor-item {
|
|
// margin-right: 0.5rem;
|
|
// }
|
|
|
|
// img {
|
|
// width: 2.2rem;
|
|
// }
|
|
// }
|
|
|
|
.sidebar-groups {
|
|
padding: 0.75rem 0 5rem;
|
|
|
|
.sidebar-group__title {
|
|
padding: 0.35rem 1.5rem 0.35rem 1.25rem;
|
|
font-size: 1rem;
|
|
font-weight: 700;
|
|
margin: 0;
|
|
}
|
|
|
|
.sidebar-group + .sidebar-group {
|
|
padding-top: 24px;
|
|
}
|
|
}
|
|
|
|
@include respond-to('md') {
|
|
width: var(--sidebar-width-sm);
|
|
}
|
|
|
|
@include respond-to('md') {
|
|
width: var(--vp-sidebar-width-small);
|
|
}
|
|
|
|
@include respond-to('lg') {
|
|
top: var(--header-height);
|
|
transform: translate(0);
|
|
border-right: 1px solid var(--border-color);
|
|
width: var(--vp-sidebar-width-small);
|
|
}
|
|
|
|
@include respond-to('xxl') {
|
|
padding: 0 32px 96px calc((100% - var(--vp-screen-max-width)) / 2.2);
|
|
width: calc(
|
|
(100% - var(--vp-screen-max-width)) / 2 + var(--vp-sidebar-width-small)
|
|
);
|
|
}
|
|
}
|