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

Make SummaryListPlaceholder height match SummaryNumber height (https://github.com/woocommerce/woocommerce-admin/pull/2088) 

* Make SummaryListPlaceholder height match SummaryNumber height

* Add CHANGELOG message

* Fix mobile
This commit is contained in:
Albert Juhé Lluveras 2019-04-22 09:56:54 +02:00 committed by GitHub
parent 68f97d214c
commit 6b43af2035
2 changed files with 38 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
plugins/woocommerce-admin/packages/components/CHANGELOG.md
View File

@ -1,3 +1,6 @@
# unreleased
- Tweaks to `<SummaryListPlaceholder>` height in order to better match `<SummaryNumber>`.
# 2.0.0
- Chart legend component now uses withInstanceId HOC so the ids used in several HTML elements are unique.
- Chart component now accepts data with negative values.

43
plugins/woocommerce-admin/packages/components/src/summary/style.scss
View File

@ -23,6 +23,12 @@ $inner-border: $core-grey-light-500;
.woocommerce-summary__item-prev-value {
display: block;
}
&.is-placeholder {
.woocommerce-summary__item-prev-label {
margin-right: calc( 100% - 80px );
}
}
}
@mixin reset-wrap() {
@ -35,6 +41,12 @@ $inner-border: $core-grey-light-500;
.woocommerce-summary__item-prev-value {
display: inline;
}
&.is-placeholder {
.woocommerce-summary__item-prev-label {
margin-right: 0;
}
}
}
.woocommerce-summary {
@ -97,7 +109,7 @@ $inner-border: $core-grey-light-500;
max-height: 100%;
margin-top: 0;
margin-bottom: 0;
overflow-y: scroll;
overflow-y: auto;
border: none;
}
@ -215,10 +227,10 @@ $inner-border: $core-grey-light-500;
&.is-dropdown-button {
padding: 0;
list-style: none;
border-bottom: 1px solid $outer-border;
border-right: 1px solid $outer-border;
.components-button {
border-bottom: 1px solid $outer-border;
text-align: left;
display: block;
}
@ -233,6 +245,7 @@ $inner-border: $core-grey-light-500;
@include placeholder();
display: inline-block;
height: 16px;
margin-top: 2.2px;
max-width: 110px;
width: 70%;
}
@ -242,19 +255,31 @@ $inner-border: $core-grey-light-500;
}
.woocommerce-summary__item-value,
.woocommerce-summary__item-delta-value,
.woocommerce-summary__item-prev-label,
.woocommerce-summary__item-prev-value {
@include placeholder();
display: inline-block;
height: 16px;
max-width: 140px;
width: 80%;
min-width: auto;
}
.woocommerce-summary__item-value {
margin-top: 2.2px;
max-width: 60px;
}
.woocommerce-summary__item-delta-value {
@include placeholder();
display: inline-block;
height: 16px;
width: 20px;
margin-top: 2.2px;
width: 50px;
}
.woocommerce-summary__item-prev-label {
width: 80px;
}
.woocommerce-summary__item-prev-value {
width: 40px;
}
}
}
@ -265,6 +290,7 @@ $inner-border: $core-grey-light-500;
background-color: $core-grey-light-100;
border-bottom: 1px solid $outer-border;
border-right: 1px solid $inner-border;
line-height: 1.4em;
text-decoration: none;
&:hover {
@ -359,6 +385,7 @@ $inner-border: $core-grey-light-500;
.woocommerce-summary__item-prev-value {
@include font-size( 13 );
color: $core-grey-dark-500;
display: inline-block;
}
.woocommerce-summary__toggle {