tree-sitter/docs/assets/css/style.scss
2018-06-12 17:43:55 -07:00

117 lines
1.7 KiB
SCSS

---
---
@import 'jekyll-theme-cayman';
$padding: 20px;
$sidebar-width: 300px;
$sidebar-transition: left 0.25s;
$container-width: 1024px;
body {
overflow-y: scroll;
overflow-x: hidden;
}
#container {
position: relative;
max-width: $container-width;
margin: 0 auto;
}
#main-content, #sidebar {
padding: $padding 0;
}
#sidebar {
position: fixed;
top: 0;
bottom: 0;
width: $sidebar-width;
overflow-y: auto;
border-right: 1px solid #ccc;
z-index: 1;
}
#sidebar-toggle-link {
font-size: 24px;
position: fixed;
background-color: white;
box-shadow: 1px 1px 5px #aaa;
left: $sidebar-width;
padding: 5px 10px;
display: none;
z-index: 100;
text-decoration: none !important;
color: #aaa;
}
#main-content {
position: relative;
padding: $padding;
padding-left: $sidebar-width + $padding;
}
.nav-link.active {
text-decoration: underline;
}
.table-of-contents-section {
border-bottom: 1px solid #ccc;
}
.logo {
display: block;
}
.table-of-contents-section.active {
background-color: #edffcb;
}
.table-of-contents-section {
padding: 10px 20px;
}
#table-of-contents {
ul {
padding: 0;
margin: 0;
}
li {
display: block;
padding: 5px 20px;
}
}
@media (max-width: 900px) {
#sidebar {
left: 0;
transition: $sidebar-transition;
}
#sidebar-toggle-link {
display: block;
transition: $sidebar-transition;
}
#main-content {
left: $sidebar-width;
padding-left: $padding;
transition: $sidebar-transition;
}
body.sidebar-hidden {
#sidebar {
left: -$sidebar-width;
}
#main-content {
left: 0;
}
#sidebar-toggle-link {
left: 0;
}
}
}