insomnia/app/css/components/pane.scss
2016-07-27 13:07:50 -07:00

56 lines
1.1 KiB
SCSS

@import '../constants/colors';
@import '../constants/dimensions';
.pane {
height: 100%;
width: 100%;
display: grid;
grid-template-rows: $line-height-md 1fr;
grid-template-columns: 1fr;
.pane__header {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background: $bg-super-light;
color: $font-super-light-bg;
border-left: 1px solid $hl-md;
box-sizing: border-box;
&.pane__header--grey {
background: $bg-light;
border-left: 1px solid $hl-xs;
}
}
.pane__body {
border-left: 1px solid $hl-md;
box-sizing: border-box;
}
.pane__body--placeholder {
overflow: hidden;
padding: $padding-md;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: $hl-xxl;
& > * {
min-width: 20em;
}
.pane__body--placeholder__cta {
width: auto;
margin: $padding-lg auto;
display: block;
}
}
}
body[data-platform="win32"] .pane .pane__header {
border-top: 1px solid $hl-md;
}