Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update chart header layout according to design (https://github.com/woocommerce/woocommerce-admin/pull/476) 

* Update chart header layout according to design

* Add RTL support
This commit is contained in:
Albert Juhé Lluveras 2018-09-26 14:17:45 +02:00 committed by GitHub
parent 80449c6c57
commit 3e3dbad408
1 changed files with 32 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
plugins/woocommerce-admin/client/components/chart/style.scss
View File

@ -19,8 +19,7 @@
min-height: 50px; min-height: 50px;
border-bottom: 1px solid $core-grey-light-700; border-bottom: 1px solid $core-grey-light-700;
display: flex; display: flex;
flex-wrap: nowrap; flex-flow: row wrap;
flex-direction: row;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
width: 100%; width: 100%;
@ -196,14 +195,43 @@
} }
.woocommerce-chart__interval-select { .woocommerce-chart__interval-select {
margin: 0; align-items: start;
border-right: 1px solid $core-grey-light-700;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 0 0 auto;
min-height: 50px;
padding: 0 $gap;
.components-select-control__input { .rtl & {
margin: 0 auto 0 0;
border-right: 0;
border-left: 1px solid $core-grey-light-700;
@include breakpoint( '<782px' ) {
border-left: 0;
}
}
@include breakpoint( '<782px' ) {
border-right: 0;
min-height: 0;
order: 1;
width: 100%;
}
#wpbody & .components-select-control__input {
@include font-size( 13 );
border: 0; border: 0;
box-shadow: none; box-shadow: none;
} }
} }
.woocommerce-chart__types {
padding: 0 8px;
}
.woocommerce-chart__container { .woocommerce-chart__container {
position: relative; position: relative;
width: 100%; width: 100%;