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#318 from woocommerce/update/datepicker-styles-updates 

Updates to presets / custom toggle and segmented selection
This commit is contained in:
David Levin 2018-08-23 12:15:59 -07:00 committed by GitHub
parent d007105ec1 c39e6f1edb
commit c06c3b0cef
3 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -12,7 +12,7 @@
}
.components-tab-panel__tab-content {
height: calc(100% - 38px);
height: calc(100% - $gap-larger);
}
}
}
@ -37,13 +37,19 @@
.woocommerce-filters-date__tab {
outline: none;
border: 1px solid $woocommerce;
padding: 10px;
padding: $gap-smaller;
margin: 0;
border-radius: 5px 0 0 5px;
border-radius: 4px 0 0 4px;
color: $woocommerce;
background-color: transparent;
&:hover {
background-color: lighten($woocommerce, 50%);
cursor: pointer;
}
&:last-child {
border-radius: 0 5px 5px 0;
border-radius: 0 4px 4px 0;
}
&.is-active {
@ -91,10 +97,11 @@
display: flex;
justify-content: center;
width: 100%;
}
.woocommerce-filters-date__button {
justify-content: center;
width: 50%;
margin: 0 1em;
.woocommerce-filters-date__button.is-button {
justify-content: center;
width: 40%;
height: 34px;
margin: 0 $gap-small;
}
}

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

@ -17,7 +17,7 @@
.woocommerce-segmented-selection__label {
background-color: $core-grey-light-100;
padding: 12px 12px 12px 24px;
padding: $gap-small $gap-small $gap-small $gap-larger;
position: relative;
display: block;
height: 100%;
@ -42,6 +42,7 @@
&:checked + label .woocommerce-segmented-selection__label {
background-color: $white;
font-weight: 600;
&::before {
content: '';
@ -50,7 +51,7 @@
background-color: $woocommerce;
position: absolute;
top: 50%;
transform: translate(-16px, -50%);
transform: translate(-20px, -50%);
}
}

1
plugins/woocommerce-admin/client/stylesheets/abstracts/_variables.scss
View File

@ -4,6 +4,7 @@ $gutter: var(--main-gap);
$gutter-large: var(--large-gap);
$gap-largest: 40px;
$gap-larger: 36px;
$gap-large: 24px;
$gap: 16px;
$gap-small: 12px;