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

Fix misalignment between value and label in form components (https://github.com/woocommerce/woocommerce-blocks/pull/2518) 

* Fix misalignment between value and label in form components

* Do the calculation in SCSS
This commit is contained in:
Albert Juhé Lluveras 2020-05-20 15:54:37 +02:00 committed by GitHub
parent d6779c4a8b
commit 60c0ebfdb7
3 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plugins/woocommerce-blocks/assets/js/base/components/payment-methods/style.scss
View File

@ -100,7 +100,7 @@
transform-origin: top left;
color: $gray-50;
transition: transform 200ms ease;
margin: 0 $gap;
margin: 0 0 0 #{$gap + 1px};
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(100% - #{2 * $gap});

4
plugins/woocommerce-blocks/assets/js/base/components/select/style.scss
View File

@ -12,10 +12,10 @@
transition: all 200ms ease;
color: $gray-50;
z-index: 1;
margin: 0 $gap;
margin: 0 0 0 #{$gap + 1px};
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(100% - #{ 2 * $gap });
max-width: calc(100% - #{2 * $gap});
white-space: nowrap;
@media screen and (prefers-reduced-motion: reduce) {

4
plugins/woocommerce-blocks/assets/js/base/components/text-input/style.scss
View File

@ -14,10 +14,10 @@
line-height: 1.375;
color: $gray-50;
transition: transform 200ms ease;
margin: 0 $gap;
margin: 0 0 0 #{$gap + 1px};
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(100% - #{ 2 * $gap });
max-width: calc(100% - #{2 * $gap});
@media screen and (prefers-reduced-motion: reduce) {
transition: none;