Files
bulma/docs/_sass/main.sass
Jeremy Thomas e9dd9eb80e Update overview
2018-04-09 17:32:12 +01:00

115 lines
1.8 KiB
Sass

$main-spacing: 2.5rem
.bd-main
overflow: hidden
position: relative
// Lead
.bd-lead
position: relative
.bd-breadcrumb
display: flex
justify-content: space-between
margin-bottom: $main-spacing
.breadcrumb:not(:last-child)
margin-bottom: 0
.bd-prev-next
align-items: flex-start
color: $grey-light
display: none
flex-grow: 0
flex-shrink: 0
margin-left: 0.5rem
text-align: center
a,
span
border-radius: $radius
width: 1.5rem
a
&:hover
background-color: $background
.bd-header
border-bottom: 2px solid $background
margin-bottom: $main-spacing
padding-bottom: $main-spacing
.subtitle
color: $text-light
max-width: 21em
strong
color: currentColor
#meta
margin-top: -0.5rem
.bd-content
hr:first-child
display: none
& + .bd-anchor-title
padding-top: 0
// Side
.bd-side,
.bd-side-background
background-color: $white-bis
.bd-side
position: relative
.bd-side-background
bottom: 0
left: 50%
position: absolute
right: 0
top: 0
+touch
.bd-lead,
.bd-side
padding: 1.5rem
.bd-header-carbon
margin-top: 1.5rem
+mobile
.bd-side-background
display: none
$sidebar-width: 16rem
+tablet
.bd-duo
display: flex
.bd-lead
background-color: $white
overflow: hidden
flex-grow: 1
flex-shrink: 1
.bd-prev-next
display: flex
.bd-side
flex: 0 0 calc(#{$sidebar-width} + 1.5rem)
+desktop
.bd-main
padding: 0 3rem
.bd-lead
margin-left: -3rem
padding: 3rem
.bd-header
align-items: center
display: flex
min-height: 130px
.bd-header-titles
flex-grow: 1
flex-shrink: 1
.bd-header-carbon
flex-grow: 0
flex-shrink: 0
margin: -15px 0 -15px 1.5rem
width: $carbon-width
.bd-side
padding: 3rem 0 3rem 1.5rem