Merge pull request #13898 from rellect/sass_woocommerce

Remove deep nesting where not necessary (woocommerce.scss)
This commit is contained in:
Mike Jolley 2017-04-27 12:07:29 +01:00 committed by GitHub
commit 8f5a8b0ede
1 changed files with 299 additions and 398 deletions

View File

@ -39,10 +39,8 @@ p.demo_store,
} }
} }
.admin-bar { .admin-bar p.demo_store {
p.demo_store { top: 32px;
top: 32px;
}
} }
/** /**
@ -103,11 +101,9 @@ p.demo_store,
} }
} }
.quantity { .quantity .qty {
.qty { width: 3.631em;
width: 3.631em; text-align: center;
text-align: center;
}
} }
/** /**
@ -435,10 +431,8 @@ p.demo_store,
} }
} }
.woocommerce-variation-description { .woocommerce-variation-description p {
p { margin-bottom: 1em;
margin-bottom: 1em;
}
} }
.reset_variations { .reset_variations {
@ -518,71 +512,69 @@ p.demo_store,
} }
} }
ul.products { ul.products li.product {
li.product { .onsale {
.onsale { top: 0;
top: 0; right: 0;
right: 0; left: auto;
left: auto; margin: -0.5em -0.5em 0 0;
margin: -0.5em -0.5em 0 0; }
}
h3, h3,
.woocommerce-loop-product__title, .woocommerce-loop-product__title,
.woocommerce-loop-category__title { .woocommerce-loop-category__title {
padding: 0.5em 0; padding: 0.5em 0;
margin: 0; margin: 0;
font-size: 1em; font-size: 1em;
} }
a { a {
text-decoration: none; text-decoration: none;
} }
a img { a img {
width: 100%; width: 100%;
height: auto; height: auto;
display: block; display: block;
margin: 0 0 1em; margin: 0 0 1em;
box-shadow: none; box-shadow: none;
} }
strong { strong {
display: block;
}
.star-rating {
font-size: 0.857em;
}
.button {
margin-top: 1em;
}
.price {
color: $highlight;
display: block;
font-weight: normal;
margin-bottom: 0.5em;
font-size: 0.857em;
del {
color: inherit;
opacity: 0.5;
display: block; display: block;
} }
.star-rating { ins {
font-size: 0.857em; background: none;
font-weight: 700;
} }
.button { .from {
margin-top: 1em; font-size: 0.67em;
} margin: -2px 0 0 0;
text-transform: uppercase;
.price { color: rgba(desaturate($highlight, 75%), 0.5);
color: $highlight;
display: block;
font-weight: normal;
margin-bottom: 0.5em;
font-size: 0.857em;
del {
color: inherit;
opacity: 0.5;
display: block;
}
ins {
background: none;
font-weight: 700;
}
.from {
font-size: 0.67em;
margin: -2px 0 0 0;
text-transform: uppercase;
color: rgba(desaturate($highlight, 75%), 0.5);
}
} }
} }
} }
@ -689,13 +681,11 @@ p.demo_store,
} }
} }
&.added { &.added::after {
&::after { font-family: 'WooCommerce';
font-family: 'WooCommerce'; content: '\e017';
content: '\e017'; margin-left: 0.53em;
margin-left: 0.53em; vertical-align: bottom;
vertical-align: bottom;
}
} }
&:hover { &:hover {
@ -915,44 +905,36 @@ p.demo_store,
} }
} }
.products { .products .star-rating {
.star-rating { display: block;
display: block; margin: 0 0 0.5em;
margin: 0 0 0.5em; float: none;
float: none;
}
} }
.hreview-aggregate { .hreview-aggregate .star-rating {
.star-rating { margin: 10px 0 0;
margin: 10px 0 0;
}
} }
#review_form { #review_form #respond {
#respond { @include clearfix();
@include clearfix(); position: static;
position: static; margin: 0;
margin: 0; width: auto;
width: auto; padding: 0;
padding: 0; background: transparent none;
background: transparent none; border: 0;
border: 0;
p { p {
margin: 0 0 10px; margin: 0 0 10px;
} }
.form-submit { .form-submit input {
input { left: auto;
left: auto; }
}
}
textarea { textarea {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
}
} }
} }
@ -978,19 +960,13 @@ p.demo_store,
text-indent: 0; text-indent: 0;
} }
&:hover { &:hover ~ a::before {
~ a::before { content: '\e021';
content: '\e021';
}
} }
} }
&:hover { &:hover a::before {
a { content: '\e020';
&::before {
content: '\e020';
}
}
} }
&.selected { &.selected {
@ -1004,10 +980,8 @@ p.demo_store,
} }
} }
a:not( .active ) { a:not( .active )::before {
&::before { content: '\e020';
content: '\e020';
}
} }
} }
} }
@ -1074,12 +1048,10 @@ p.demo_store,
} }
} }
tbody:first-child { tbody:first-child tr:first-child {
tr:first-child { th,
th, td {
td { border-top: 0;
border-top: 0;
}
} }
} }
@ -1125,11 +1097,9 @@ p.demo_store,
&:last-child { &:last-child {
text-align: left; text-align: left;
} }
.woocommerce-MyAccount-downloads-file { .woocommerce-MyAccount-downloads-file::before {
&::before { content: '\2193';
content: '\2193'; display: inline-block;
display: inline-block;
}
} }
} }
} }
@ -1165,7 +1135,6 @@ p.demo_store,
min-width: 80px; min-width: 80px;
} }
/** /**
* Cart sidebar * Cart sidebar
*/ */
@ -1241,17 +1210,15 @@ p.demo_store,
} }
} }
.cart_list { .cart_list li {
li { padding-left: 2em;
padding-left: 2em; position: relative;
position: relative; padding-top: 0;
padding-top: 0;
a.remove { a.remove {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
}
} }
} }
@ -1267,101 +1234,99 @@ p.demo_store,
/** /**
* Forms * Forms
*/ */
form { form .form-row {
.form-row { padding: 3px;
padding: 3px; margin: 0 0 6px;
margin: 0 0 6px;
[placeholder]:focus::-webkit-input-placeholder { [placeholder]:focus::-webkit-input-placeholder {
-webkit-transition: opacity 0.5s 0.5s ease; -webkit-transition: opacity 0.5s 0.5s ease;
-moz-transition: opacity 0.5s 0.5s ease; -moz-transition: opacity 0.5s 0.5s ease;
transition: opacity 0.5s 0.5s ease; transition: opacity 0.5s 0.5s ease;
opacity: 0; opacity: 0;
} }
label {
line-height: 2;
}
label.hidden {
visibility: hidden;
}
label.inline {
display: inline;
}
select {
cursor: pointer;
margin: 0;
}
.required {
color: red;
font-weight: 700;
border: 0;
}
.input-checkbox {
display: inline;
margin: -2px 8px 0 0;
text-align: center;
vertical-align: middle;
}
input.input-text,
textarea {
box-sizing: border-box;
width: 100%;
margin: 0;
outline: 0;
line-height: 1;
}
textarea {
height: 4em;
line-height: 1.5;
display: block;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.select2-container {
width: 100%;
line-height: 2em;
}
&.woocommerce-invalid {
label { label {
line-height: 2; color: $red;
} }
.select2-container,
label.hidden {
visibility: hidden;
}
label.inline {
display: inline;
}
select {
cursor: pointer;
margin: 0;
}
.required {
color: red;
font-weight: 700;
border: 0;
}
.input-checkbox {
display: inline;
margin: -2px 8px 0 0;
text-align: center;
vertical-align: middle;
}
input.input-text, input.input-text,
textarea { select {
box-sizing: border-box; border-color: $red;
width: 100%;
margin: 0;
outline: 0;
line-height: 1;
} }
}
textarea { &.woocommerce-validated {
height: 4em; .select2-container,
line-height: 1.5; input.input-text,
display: block; select {
-moz-box-shadow: none; border-color: $green - #111;
-webkit-box-shadow: none;
box-shadow: none;
} }
}
.select2-container { ::-webkit-input-placeholder {
width: 100%; line-height: normal;
line-height: 2em; }
}
&.woocommerce-invalid { :-moz-placeholder {
label { line-height: normal;
color: $red; }
}
.select2-container,
input.input-text,
select {
border-color: $red;
}
}
&.woocommerce-validated { :-ms-input-placeholder {
.select2-container, line-height: normal;
input.input-text,
select {
border-color: $green - #111;
}
}
::-webkit-input-placeholder {
line-height: normal;
}
:-moz-placeholder {
line-height: normal;
}
:-ms-input-placeholder {
line-height: normal;
}
} }
} }
@ -1442,56 +1407,48 @@ p.demo_store,
/** /**
* Layered nav widget * Layered nav widget
*/ */
.widget_layered_nav { .widget_layered_nav ul {
ul { margin: 0;
margin: 0; padding: 0;
padding: 0; border: 0;
border: 0; list-style: none outside;
list-style: none outside;
li { li {
@include clearfix(); @include clearfix();
padding: 0 0 1px; padding: 0 0 1px;
list-style: none; list-style: none;
a, a,
span { span {
padding: 1px 0; padding: 1px 0;
}
} }
}
li.chosen { li.chosen a::before {
a { @include iconbefore( '\e013' );
&::before { color: $red;
@include iconbefore( '\e013' );
color: $red;
}
}
}
} }
} }
.widget_layered_nav_filters { .widget_layered_nav_filters ul {
ul { margin: 0;
margin: 0; padding: 0;
padding: 0; border: 0;
border: 0; list-style: none outside;
list-style: none outside; overflow: hidden;
overflow: hidden; zoom: 1;
zoom: 1;
li { li {
float: left; float: left;
padding: 0 1px 1px 0; padding: 0 1px 1px 0;
list-style: none; list-style: none;
a { a {
text-decoration: none; text-decoration: none;
&::before { &::before {
@include iconbefore( '\e013' ); @include iconbefore( '\e013' );
color: $red; color: $red;
}
} }
} }
} }
@ -1512,9 +1469,6 @@ p.demo_store,
.button { .button {
font-size: 1.15em; font-size: 1.15em;
}
.button {
float: left; float: left;
} }
} }
@ -1577,38 +1531,32 @@ p.demo_store,
/** /**
* Rating Filter Widget * Rating Filter Widget
*/ */
.widget_rating_filter { .widget_rating_filter ul {
ul { margin: 0;
margin: 0; padding: 0;
padding: 0; border: 0;
border: 0; list-style: none outside;
list-style: none outside;
li { li {
@include clearfix(); @include clearfix();
padding: 0 0 1px; padding: 0 0 1px;
list-style: none; list-style: none;
a { a {
padding: 1px 0; padding: 1px 0;
text-decoration: none; text-decoration: none;
}
.star-rating {
float: none;
display: inline-block;
}
} }
li.chosen { .star-rating {
a { float: none;
&::before { display: inline-block;
@include iconbefore( '\e013' );
color: $red;
}
}
} }
} }
li.chosen a::before {
@include iconbefore( '\e013' );
color: $red;
}
} }
} }
@ -1690,18 +1638,8 @@ button.pswp__button--zoom:hover {
/** /**
* Right to left styles * Right to left styles
*/ */
.rtl { .rtl.woocommerce div.product div.images .flex-control-thumbs li {
&.woocommerce { float: right;
div.product {
div.images {
.flex-control-thumbs {
li {
float: right;
}
}
}
}
}
} }
.woocommerce-message { .woocommerce-message {
@ -1738,33 +1676,26 @@ button.pswp__button--zoom:hover {
@include clearfix(); @include clearfix();
} }
.addresses { .addresses .title {
.title { @include clearfix();
@include clearfix();
h3 { h3 {
float: left; float: left;
} }
.edit { .edit {
float: right; float: right;
}
} }
} }
ol.commentlist.notes { ol.commentlist.notes li.note {
li.note { p.meta {
font-weight: 700;
margin-bottom: 0;
}
p.meta { .description p:last-child {
font-weight: 700; margin-bottom: 0;
margin-bottom: 0;
}
.description {
p:last-child {
margin-bottom: 0;
}
}
} }
} }
ul.digital-downloads { ul.digital-downloads {
@ -1808,20 +1739,16 @@ button.pswp__button--zoom:hover {
vertical-align: middle; vertical-align: middle;
} }
td.actions { td.actions .coupon .input-text {
.coupon { float: left;
.input-text { -webkit-box-sizing: border-box;
float: left; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; box-sizing: border-box;
-moz-box-sizing: border-box; border: 1px solid darken( $secondary, 10% );
box-sizing: border-box; padding: 6px 6px 5px;
border: 1px solid darken( $secondary, 10% ); margin: 0 4px 0 0;
padding: 6px 6px 5px; outline: 0;
margin: 0 4px 0 0; line-height: 1;
outline: 0;
line-height: 1;
}
}
} }
input { input {
@ -1852,19 +1779,15 @@ button.pswp__button--zoom:hover {
display: block; display: block;
} }
.shipping-calculator-button { .shipping-calculator-button::after {
&::after { @include iconafter( '\e019' );
@include iconafter( '\e019' );
}
} }
} }
.cart_totals { .cart_totals {
p { p small {
small { color: $subtext;
color: $subtext; font-size: 0.83em;
font-size: 0.83em;
}
} }
table { table {
@ -1910,12 +1833,8 @@ button.pswp__button--zoom:hover {
} }
} }
.cross-sells { .cross-sells ul.products li.product {
ul.products { margin-top: 0;
li.product {
margin-top: 0;
}
}
} }
} }
.checkout { .checkout {
@ -2168,65 +2087,47 @@ button.pswp__button--zoom:hover {
/** /**
* Twenty Eleven specific styles * Twenty Eleven specific styles
*/ */
#content.twentyeleven { #content.twentyeleven .woocommerce-pagination a {
.woocommerce-pagination { font-size: 1em;
a { line-height: 1;
font-size: 1em;
line-height: 1;
}
}
} }
/** /**
* Twenty Thirteen specific styles * Twenty Thirteen specific styles
*/ */
.single-product { .single-product .twentythirteen {
.twentythirteen { .entry-summary,
.entry-summary, #reply-title,
#reply-title, #respond #commentform {
#respond #commentform { padding: 0;
padding: 0; }
}
p.stars { p.stars {
clear: both; clear: both;
}
} }
} }
.twentythirteen { .twentythirteen .woocommerce-breadcrumb {
.woocommerce-breadcrumb { padding-top: 40px;
padding-top: 40px;
}
} }
/** /**
* Twenty Fourteen specific styles * Twenty Fourteen specific styles
*/ */
.twentyfourteen { .twentyfourteen ul.products li.product {
ul.products { margin-top: 0 !important;
li.product {
margin-top: 0 !important;
}
}
} }
/** /**
* Twenty Sixteen specific styles * Twenty Sixteen specific styles
*/ */
body:not( .search-results ) { body:not( .search-results ) .twentysixteen .entry-summary {
.twentysixteen { color: inherit;
.entry-summary { font-size: inherit;
color: inherit; line-height: inherit;
font-size: inherit;
line-height: inherit;
}
}
} }
.twentysixteen { .twentysixteen .price ins {
.price ins { background: inherit;
background: inherit; color: inherit;
color: inherit;
}
} }