| $dashboard-panel-width: 25rem !default |
| $dashboard-panel-padding: 2rem 1.5rem !default |
| $dashboard-panel-height: 100% !default |
| $dashboard-panel-header-bottom-margin: 2rem !default |
| $dashboard-panel-footer-top-margin: 2rem !default |
| $dashboard-panel-width-left: $dashboard-panel-width !default |
| $dashboard-panel-width-right: $dashboard-panel-width !default |
| |
| =flex |
| display: flex |
| |
| =row |
| +flex |
| flex-direction: row |
| |
| =column |
| +flex |
| flex-direction: column |
| |
| =fill |
| flex: 1 |
| |
| =panel($width) |
| flex: 0 0 $width |
| |
| =x-centered |
| +flex |
| justify-content: center |
| |
| .is-scrollable |
| overflow-y: auto |
| |
| .dashboard |
| +row |
| |
| &.is-full-height |
| height: 100vh |
| |
| &-panel |
| +column |
| padding: $dashboard-panel-padding |
| flex: 0 0 $dashboard-panel-width |
| height: $dashboard-panel-height |
| |
| &.left |
| +panel($dashboard-panel-width-left) |
| |
| &.right |
| +panel($dashboard-panel-width-right) |
| |
| &.has-thick-padding |
| padding: 3rem 2rem |
| |
| &.is-one-quarter |
| +panel(25%) |
| &.is-half |
| +panel(50%) |
| &.is-one-third |
| +panel(percentage(1 / 3)) |
| &.is-small |
| +panel(15rem) |
| &.is-medium |
| +panel(20rem) |
| &.is-large |
| +panel(30rem) |
| |
| &-header, &-content, &-footer |
| &.is-centered |
| +x-centered |
| |
| &-header |
| margin-bottom: $dashboard-panel-header-bottom-margin |
| |
| &-main |
| +fill |
| |
| &-footer |
| margin-top: $dashboard-panel-footer-top-margin |
| |
| &-main |
| +flex |
| +fill |
| +column |
| min-height: 100vh |
| |
| .navbar |
| &.is-fixed-top |
| position: -webkit-sticky |
| position: sticky |
| top: 0 |
| |
| .footer |
| +fill |