tonyair/silverstripe-framework
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-framework synced 2024-09-30 13:19:11 +02:00
Code Issues Projects Releases Wiki Activity

Remove some legacy layout styles

Browse Source
This commit is contained in:
Paul Clarke 2016-10-20 16:20:37 +13:00
parent a95781e66e
commit 50af94099e
1 changed files with 34 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
admin/client/src/styles/_layout.scss
View File

@ -1,19 +1,28 @@
.cms-content__inner { // INITIATE FLEXBOX LAYOUT
height: 100%; // TODO Convert layout to BEM
*,
*:before,
*:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
} }
.cms-content__right, html,
.cms-content__left { body {
width: 100%;
height: 100%; height: 100%;
overflow: hidden; margin: 0;
background-color: $body-bg; padding: 0;
transition: width .2s; display: -ms-flexbox;
display: flex;
} }
// .cms-content can be split into different left/right zones @include media-breakpoint-down(md) {
// Exampale modifier: --left-sm = small left side panel with right panel width set to auto. .cms-content.has-panel .cms-content-tools {
.cms-content__split { display: none;
height: 100%; }
} }
.campaign-items { .campaign-items {
@ -23,7 +32,7 @@
} }
} }
.campaigns { .campaigns { // TODO move to campaign container
position: relative; position: relative;
height: 100%; height: 100%;
@ -58,16 +67,16 @@
} }
@include media-breakpoint-up(lg) { @include media-breakpoint-up(lg) {
// padding-left: $cms-panel-sm; padding-left: $cms-panel-sm;
.cms-content__left { // .cms-content__left {
width: $cms-panel-sm; // width: $cms-panel-sm;
} // }
//
.cms-content__right { // .cms-content__right {
display: block; // display: block;
border-left: 1px solid $border-color; // border-left: 1px solid $border-color;
} // }
.cms-content__back-btn { .cms-content__back-btn {
display: none; display: none;
@ -75,11 +84,11 @@
} }
@include media-breakpoint-up(xl) { @include media-breakpoint-up(xl) {
// padding-left: $cms-panel-md; padding-left: $cms-panel-md;
.cms-content__left { // .cms-content__left {
width: $cms-panel-md; // width: $cms-panel-md;
} // }
} }
} }
@ -136,28 +145,6 @@
} }
// TEMPORY FLEXBOX STYLES
// Reference https://css-tricks.com/boxes-fill-height-dont-squish/
// Reference http://codepen.io/clarkepaul/pen/qaNWAY
*,
*:before,
*:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
display: -ms-flexbox;
display: flex;
}
// Flex magic // Flex magic
// Nested items take up height // Nested items take up height
.fill-height { .fill-height {