mirror of
https://github.com/explosion/spaCy.git
synced 2024-12-29 11:26:28 +03:00
66 lines
1.9 KiB
Sass
66 lines
1.9 KiB
Sass
|
// Sidebar - Variables
|
||
|
// ============================================================================
|
||
|
|
||
|
$sidebar-breakpoint : 900px
|
||
|
$sidebar-highlight-color : color($theme)
|
||
|
$sidebar-margin-left : 4rem
|
||
|
$sidebar-margin-right : 6rem
|
||
|
$sidebar-margin-top : $height-navbar
|
||
|
$sidebar-menu-spacing : 3rem
|
||
|
$sidebar-small-border : 1px solid color(grey, light)
|
||
|
$sidebar-small-padding : 2rem 3rem
|
||
|
$sidebar-width : $width-sidebar
|
||
|
|
||
|
|
||
|
// Sidebar - Style
|
||
|
// ============================================================================
|
||
|
|
||
|
// .sidebar - sidebar
|
||
|
// .fixed - sticky version
|
||
|
// .menu - menu list in sidebar
|
||
|
// .active - active menu item
|
||
|
// .sidebar-label - menu label
|
||
|
|
||
|
.sidebar
|
||
|
@media (min-width: #{$sidebar-breakpoint})
|
||
|
flex: 0 0 $sidebar-width
|
||
|
margin-right: $sidebar-margin-right
|
||
|
margin-left: $sidebar-margin-left
|
||
|
padding-top: $height-navbar
|
||
|
width: $sidebar-width
|
||
|
|
||
|
&.fixed .sidebar-body
|
||
|
@include position(fixed, top, left, $sidebar-margin-top, $sidebar-margin-left)
|
||
|
@include size($sidebar-width, calc(100vh - #{$sidebar-margin-top}))
|
||
|
overflow: auto
|
||
|
transition: none
|
||
|
|
||
|
@media (max-width: #{$sidebar-breakpoint})
|
||
|
border-bottom: $sidebar-small-border
|
||
|
flex: 100%
|
||
|
width: 100%
|
||
|
|
||
|
.sidebar-body
|
||
|
display: flex
|
||
|
flex-flow: row wrap
|
||
|
|
||
|
.sidebar-menu
|
||
|
@media (min-width: #{$sidebar-breakpoint})
|
||
|
margin-bottom: $sidebar-menu-spacing
|
||
|
|
||
|
@media (max-width: #{$sidebar-breakpoint})
|
||
|
flex: 1
|
||
|
margin: 0
|
||
|
padding: $sidebar-small-padding
|
||
|
border-top: $sidebar-small-border
|
||
|
|
||
|
&:not(:last-child)
|
||
|
border-right: $sidebar-small-border
|
||
|
|
||
|
.active
|
||
|
color: $sidebar-highlight-color
|
||
|
font-weight: bold
|
||
|
|
||
|
.sidebar-menu[data-label]:before
|
||
|
@extend .label
|