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

Chart: Add styling needed to not be wrapped by card. (https://github.com/woocommerce/woocommerce-admin/pull/408) 

* Chart: Add styling needed to not be wrapped by card.

* Add negative top margin back

* Fix placeholder css.
This commit is contained in:
Timmy Crawford 2018-09-14 09:17:39 -07:00 committed by GitHub
parent 70bb1d28c8
commit 8eb0906287
2 changed files with 24 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/woocommerce-admin/client/analytics/report/revenue/index.js
View File

@ -338,7 +338,6 @@ export class RevenueReport extends Component {
} ); } );
return ( return (
<Card title="">
<Chart <Chart
data={ chartData } data={ chartData }
title={ selectedChart.label } title={ selectedChart.label }
@ -349,7 +348,6 @@ export class RevenueReport extends Component {
x2Format={ formats.x2Format } x2Format={ formats.x2Format }
dateParser={ '%Y-%m-%dT%H:%M:%S' } dateParser={ '%Y-%m-%dT%H:%M:%S' }
/> />
</Card>
); );
} }

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

@ -1,15 +1,22 @@
/** @format */ /** @format */
.woocommerce-chart { .woocommerce-chart {
display: flex; margin-top: -$gap;
flex-direction: column; margin-bottom: $gap-large;
justify-content: flex-start; background: white;
align-items: flex-start; border: 1px solid $core-grey-light-700;
margin: -$gap; border-top: 0;
border-top: 1px solid $core-grey-light-700;
@include breakpoint( '<782px' ) {
margin-left: -16px;
margin-right: -16px;
margin-bottom: $gap-small;
border-left: none;
border-right: none;
width: auto;
}
.woocommerce-chart__header { .woocommerce-chart__header {
min-height: 50px; min-height: 50px;
border-top: 1px solid $core-grey-light-700;
border-bottom: 1px solid $core-grey-light-700; border-bottom: 1px solid $core-grey-light-700;
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
@ -181,13 +188,9 @@
&.is-placeholder { &.is-placeholder {
@include placeholder(); @include placeholder();
display: inline-block;
height: 200px; height: 200px;
width: 100%; width: 100%;
margin: 0;
padding: 0; padding: 0;
margin-bottom: $gap;
border: 1px solid $core-grey-light-700;
} }
} }