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

Merge pull request woocommerce/woocommerce-admin#327 from woocommerce/fix/datepicker-1px-shift 

Segmented-selection: remove focus outline in favor of inset box-shadow
This commit is contained in:
Paul Sealock 2018-08-30 09:51:15 +12:00 committed by GitHub
parent 52a0a9690c f48fdd2dea
commit 22e3d962ad
2 changed files with 4 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
plugins/woocommerce-admin/client/components/filters/date/index.js
View File

@ -59,6 +59,9 @@ class DatePicker extends Component {
if ( 'custom' === selectedTab ) {
data.after = after ? after.format( isoDateFormat ) : '';
data.before = before ? before.format( isoDateFormat ) : '';
} else {
data.after = undefined;
data.before = undefined;
}
updateQueryString( data, path, query );
onClose( event );

13
plugins/woocommerce-admin/client/components/segmented-selection/style.scss
View File

@ -56,17 +56,6 @@
}
&:focus + label .woocommerce-segmented-selection__label {
/**
Must use outline instead of border here to avoid having the
elements below shift by 2 pixel on focus. This trickery is needed
so that left and right edges can be seen as those borders are actually
part of the parent CSS grid.
*/
outline: 1px solid $black;
width: calc(100% - 1px);
}
&:nth-child(4n + 1):focus + label .woocommerce-segmented-selection__label {
transform: translateX(1px);
box-shadow: inset 0 0 0 1px $black;
}
}