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

50 lines
943 B
SCSS
Raw Normal View History

2018-05-17 04:44:58 +00:00
/** @format */
.woocommerce-segmented-selection {
2018-05-17 04:44:58 +00:00
width: 100%;
2018-05-28 10:55:19 +00:00
}
.woocommerce-segmented-selection__container {
width: 100%;
2018-05-17 04:44:58 +00:00
grid-template-columns: 1fr 1fr;
display: grid;
border-top: 1px solid $gray;
border-bottom: 1px solid $gray;
2018-05-17 04:44:58 +00:00
grid-gap: 1px;
background-color: $gray;
}
.woocommerce-segmented-selection__label {
2018-05-17 04:44:58 +00:00
background-color: $white;
padding: 1em;
position: relative;
display: block;
height: 100%;
2018-05-17 04:44:58 +00:00
}
.woocommerce-segmented-selection__input {
2018-05-17 04:44:58 +00:00
opacity: 0;
position: absolute;
left: -9999px;
&:checked + label .woocommerce-segmented-selection__label {
2018-05-17 04:44:58 +00:00
background-color: $gray-light-10;
padding-left: calc(1em + 20px);
&::before {
content: '';
width: 8px;
height: 8px;
background-color: #444;
border-radius: 4px;
position: absolute;
top: 50%;
transform: translate(-20px, -50%);
}
}
&:focus + label .woocommerce-segmented-selection__label {
2018-05-17 04:44:58 +00:00
outline: 1px solid lightseagreen;
}
}