diff --git a/.stylelintignore b/.stylelintignore new file mode 100644 index 00000000000..653d14e06c5 --- /dev/null +++ b/.stylelintignore @@ -0,0 +1 @@ +assets/css/select2.scss diff --git a/.stylelintrc b/.stylelintrc index 1c2ab319d43..4c93dd4476d 100644 --- a/.stylelintrc +++ b/.stylelintrc @@ -1,5 +1,6 @@ { "rules": { + "indentation": "tab", "color-hex-case": "lower", "color-no-invalid-hex": true, @@ -19,7 +20,7 @@ "unit-case": "lower", "unit-no-unknown": true, - "unit-whitelist": ["px", "%", "deg", "ms", "em", "vh", "vw", "rem"], + "unit-whitelist": ["px", "%", "deg", "ms", "em", "vh", "vw", "rem", "s", "ex", "pt", "cm"], "value-list-comma-space-after": "always-single-line", "value-list-comma-space-before": "never", @@ -28,8 +29,8 @@ "property-case": "lower", - "declaration-block-no-duplicate-properties": true, - "declaration-block-no-ignored-properties": true, + "declaration-block-no-duplicate-properties": [true, { "severity": "warning" } ], + "declaration-block-no-ignored-properties": [true, { "severity": "warning" } ], "declaration-block-trailing-semicolon": "always", "declaration-block-single-line-max-declarations": 0, "declaration-block-semicolon-space-before": "never", @@ -54,6 +55,6 @@ "selector-pseudo-element-colon-notation": "double", "selector-pseudo-element-no-unknown": true, "selector-type-case": "lower", - "selector-no-id": true + "selector-no-id": [true, { "severity": "warning" } ], } } diff --git a/assets/css/_animation.scss b/assets/css/_animation.scss index 25e89301561..6d32fb10298 100644 --- a/assets/css/_animation.scss +++ b/assets/css/_animation.scss @@ -4,6 +4,6 @@ */ @include keyframes( spin ) { 100% { - @include transform( rotate(360deg) ); + @include transform( rotate( 360deg ) ); } } diff --git a/assets/css/_mixins.scss b/assets/css/_mixins.scss index 43ea1677618..53396db2908 100644 --- a/assets/css/_mixins.scss +++ b/assets/css/_mixins.scss @@ -5,13 +5,13 @@ @mixin clearfix() { *zoom: 1; - &:before, - &:after { - content: " "; + &::before, + &::after { + content: ' '; display: table; } - &:after { + &::after { clear: both; } } @@ -105,7 +105,7 @@ * Deprecated * Vendor prefix no longer required. */ -@mixin transition($selector: all, $animation: ease-in-out, $duration: .2s) { +@mixin transition($selector: all, $animation: ease-in-out, $duration: 0.2s) { transition: $selector $animation $duration; } @@ -126,10 +126,11 @@ box-sizing: border-box; } -@mixin darkorlighttextshadow($a, $opacity: .8) { +@mixin darkorlighttextshadow($a, $opacity: 0.8) { @if lightness($a) >= 65% { @include text_shadow(0, -1px, 0, rgba(0, 0, 0, $opacity)); - } @else { + } + @else { @include text_shadow(0, 1px, 0, rgba(255, 255, 255, $opacity)); } } @@ -171,7 +172,7 @@ width: 1em; } -@mixin icon( $glyph: "\e001" ) { +@mixin icon( $glyph: '\e001' ) { font-family: 'WooCommerce'; speak: none; font-weight: normal; @@ -190,7 +191,7 @@ content: $glyph; } -@mixin icon_dashicons( $glyph: "\f333" ) { +@mixin icon_dashicons( $glyph: '\f333' ) { font-family: 'Dashicons'; speak: none; font-weight: normal; @@ -209,7 +210,7 @@ content: $glyph; } -@mixin iconbefore( $glyph: "\e001" ) { +@mixin iconbefore( $glyph: '\e001' ) { font-family: 'WooCommerce'; speak: none; font-weight: normal; @@ -217,12 +218,12 @@ text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; - margin-right: .618em; + margin-right: 0.618em; content: $glyph; text-decoration: none; } -@mixin iconbeforedashicons( $glyph: "\f333" ) { +@mixin iconbeforedashicons( $glyph: '\f333' ) { font-family: 'Dashicons'; speak: none; font-weight: normal; @@ -230,12 +231,12 @@ text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; - margin-right: .618em; + margin-right: 0.618em; content: $glyph; text-decoration: none; } -@mixin iconafter( $glyph: "\e001" ) { +@mixin iconafter( $glyph: '\e001' ) { font-family: 'WooCommerce'; speak: none; font-weight: normal; @@ -243,29 +244,28 @@ text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; - margin-left: .618em; + margin-left: 0.618em; content: $glyph; text-decoration: none; } @mixin loader() { - &:before { + &::before { height: 1em; width: 1em; display: block; position: absolute; top: 50%; left: 50%; - margin-left: -.5em; - margin-top: -.5em; - display: block; - content: ""; + margin-left: -0.5em; + margin-top: -0.5em; + content: ''; @include animation( spin 1s ease-in-out infinite ); - background: url(../images/icons/loader.svg) center center; + background: url('../images/icons/loader.svg') center center; background-size: cover; line-height: 1; text-align: center; font-size: 2em; - color: rgba(#000,0.75); + color: rgba(#000, 0.75); } } diff --git a/assets/css/activation.scss b/assets/css/activation.scss index 50ff1f914a6..3d8140534a1 100644 --- a/assets/css/activation.scss +++ b/assets/css/activation.scss @@ -6,7 +6,7 @@ /** * Imports */ -@import "bourbon"; +@import 'bourbon'; /** * Styling begins @@ -24,17 +24,17 @@ p.woocommerce-actions, .woocommerce-message { a.button-primary { background: #bb77ae; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; color: #fff; - text-shadow: 0px -1px 1px #A36597, 1px 0px 1px #A36597, 0px 1px 1px #A36597, -1px 0px 1px #A36597; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; &:hover, &:focus, &:active { - background: #A36597; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + background: #a36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; } } @@ -46,12 +46,12 @@ p.woocommerce-actions, font-size: 13px; line-height: 1.23076923; text-decoration: none; - &:before { + &::before { position: absolute; - top: 8px; - left: 0; - -webkit-transition: all .1s ease-in-out; - transition: all .1s ease-in-out; + top: 8px; + left: 0; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; } } @@ -87,12 +87,12 @@ div.woocommerce-no-shipping-methods-notice { font-size: 1.1em; } } - &:before { - content: "\e01b"; - font-family: "WooCommerce"; + &::before { + content: '\e01b'; + font-family: 'WooCommerce'; text-align: center; line-height: 1; - color: #F7F1F6; + color: #f7f1f6; display: block; width: 1em; font-size: 20em; diff --git a/assets/css/admin.scss b/assets/css/admin.scss index 902893d4fd3..82cfc9d3525 100644 --- a/assets/css/admin.scss +++ b/assets/css/admin.scss @@ -7,12 +7,12 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; -@import "animation"; -@import "select2"; -@import "fonts"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; +@import 'animation'; +@import 'select2'; +@import 'fonts'; /** * Styling begins @@ -41,11 +41,11 @@ overflow: hidden; background: #f5f5f5; -webkit-box-shadow: - inset 0 1px 0 rgba(255,255,255,0.2), - inset 0 -1px 0 rgba(0,0,0,0.1); + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.1); box-shadow: - inset 0 1px 0 rgba(255,255,255,0.2), - inset 0 -1px 0 rgba(0,0,0,0.1); + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.1); img { max-width: 258px; @@ -57,7 +57,7 @@ border-right: 260px solid #fff; } - img.extension-thumb+h3 { + img.extension-thumb + h3 { display: none; } @@ -86,7 +86,7 @@ } .storefront { - background: url(../images/storefront-bg.jpg) bottom right #f6f6f6; + background: url('../images/storefront-bg.jpg') bottom right #f6f6f6; border: 1px solid #ddd; padding: 20px; overflow: hidden; @@ -97,7 +97,7 @@ height: auto; float: left; margin: 0 20px 0 0; - box-shadow: 0 1px 6px rgba(0,0,0,0.1); + box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); } p { @@ -111,17 +111,17 @@ a.button-primary, button.button-primary { background: #bb77ae; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; color: #fff; - text-shadow: 0px -1px 1px #A36597, 1px 0px 1px #A36597, 0px 1px 1px #A36597, -1px 0px 1px #A36597; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; &:hover, &:focus, &:active { - background: #A36597; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + background: #a36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; } } } @@ -144,12 +144,12 @@ font-size: 13px; line-height: 1.23076923; text-decoration: none; - &:before { + &::before { position: absolute; - top: 8px; - left: 0; - -webkit-transition: all .1s ease-in-out; - transition: all .1s ease-in-out; + top: 8px; + left: 0; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; } } @@ -211,15 +211,15 @@ mark.amount { vertical-align: middle; width: 16px; - &:after { - @include icon_dashicons( "\f223" ); + &::after { + @include icon_dashicons( '\f223' ); cursor: help; } } h2 .woocommerce-help-tip { margin-top: -5px; - margin-left: .25em; + margin-left: 0.25em; } table.wc_status_table { @@ -231,7 +231,7 @@ table.wc_status_table { } tr { - &:nth-child(2n) { + &:nth-child( 2n ) { th, td { background: #fcfcfc; @@ -339,7 +339,7 @@ table.wc_status_table { .dimensions { div { display: block; - margin: .2em 0; + margin: 0.2em 0; span.title { display: block; @@ -379,7 +379,7 @@ table.wc_status_table { label { clear: none; width: 49%; - margin: .2em 0; + margin: 0.2em 0; } &.dimensions { label { @@ -426,12 +426,12 @@ ul.wc_coupon_list { &.code { display: inline-block; - &:after { - content: ", "; + &::after { + content: ', '; } &:last-of-type { - &:after { + &::after { display: none; } } @@ -452,7 +452,7 @@ ul.wc_coupon_list_block { border-bottom: 1px solid #ccc; line-height: 2.5em; margin: 0; - padding: .5em 0; + padding: 0.5em 0; } li:first-child { @@ -473,8 +473,8 @@ ul.wc_coupon_list_block { width: 28px !important; display: inline-block; - &:after { - @include icon_dashicons( "\f345" ); + &::after { + @include icon_dashicons( '\f345' ); line-height: 28px; } } @@ -504,11 +504,11 @@ ul.wc_coupon_list_block { } #order_data { - padding: 23px 24px 12px 24px; + padding: 23px 24px 12px; h2 { margin: 0; - font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif; + font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; font-size: 21px; font-weight: normal; line-height: 1.2; @@ -531,7 +531,7 @@ ul.wc_coupon_list_block { p.order_number { margin: 0; - font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif; + font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; font-weight: normal; line-height: 1.6em; font-size: 16px; @@ -564,7 +564,7 @@ ul.wc_coupon_list_block { float: left; width: 48%; padding: 0; - margin: 9px 0 0 0; + margin: 9px 0 0; label { display: block; @@ -595,7 +595,7 @@ ul.wc_coupon_list_block { small { display: block; - margin: 5px 0 0 0; + margin: 5px 0 0; color: #999; } } @@ -653,7 +653,7 @@ ul.wc_coupon_list_block { } ._billing_email_field { - clear: left + clear: left; } div.edit_address { @@ -670,7 +670,7 @@ ul.wc_coupon_list_block { a.edit_address, .billing-same-as-shipping, .load_customer_shipping, .load_customer_billing { width: 14px; height: 0; - padding: 14px 0 0 0; + padding: 14px 0 0; margin: 0 0 0 6px; overflow: hidden; position: relative; @@ -680,7 +680,7 @@ ul.wc_coupon_list_block { &:hover, &:focus { color: #000; } - &:after { + &::after { font-family: 'WooCommerce'; position: absolute; top: 0; @@ -694,24 +694,24 @@ ul.wc_coupon_list_block { } } .billing-same-as-shipping { - &:after { - content: "\e008"; + &::after { + content: '\e008'; } } .load_customer_shipping { - &:after { - content: "\e03a"; + &::after { + content: '\e03a'; } } .load_customer_billing { - &:after { - content: "\e03a"; + &::after { + content: '\e03a'; } } a.edit_address { - &:after { - font-family: "Dashicons"; - content: "\f464"; + &::after { + font-family: 'Dashicons'; + content: '\f464'; } } } @@ -784,8 +784,7 @@ ul.wc_coupon_list_block { } .wc-order-data-row { - border-bottom: 1px solid #DFDFDF; - background: #fff; + border-bottom: 1px solid #dfdfdf; padding: 1.5em 2em; background: #f8f8f8; @include clearfix(); @@ -855,10 +854,10 @@ ul.wc_coupon_list_block { .total { font-size: 1em !important; width: 10em; - margin: 0 0 0 .5em; + margin: 0 0 0 0.5em; box-sizing: border-box; - input[type="text"] { + input[type='text'] { width: 96%; float: right; } @@ -872,7 +871,7 @@ ul.wc_coupon_list_block { .refund-actions { margin-top: 5px; padding-top: 12px; - border-top: 1px solid #DFDFDF; + border-top: 1px solid #dfdfdf; .button { float: right; @@ -885,7 +884,7 @@ ul.wc_coupon_list_block { } } - .wc-order-item-bulk-edit { + .wc-order-item-bulk-edit { .cancel-action { float: left; margin-left: 0; @@ -910,7 +909,7 @@ ul.wc_coupon_list_block { } .button { float: left; - margin-right: .25em; + margin-right: 0.25em; } .button-primary { float: none; @@ -996,9 +995,9 @@ ul.wc_coupon_list_block { cursor: pointer; } &.selected { - background: #F5EBF3; + background: #f5ebf3; td { - border-color: #E6CCE1; + border-color: #e6cce1; opacity: 0.8; } } @@ -1030,8 +1029,8 @@ ul.wc_coupon_list_block { font-size: 21px; display: block; text-align: center; - &:before { - @include icon_dashicons( "\f128" ); + &::before { + @include icon_dashicons( '\f128' ); width: 38px; line-height: 38px; display: block; @@ -1048,7 +1047,7 @@ ul.wc_coupon_list_block { td.name { .wc-order-item-sku, .wc-order-item-variation { display: block; - margin-top: .5em; + margin-top: 0.5em; font-size: 0.92em !important; color: #888; } @@ -1099,7 +1098,7 @@ ul.wc_coupon_list_block { display: inline-block; background: #fff; border: 1px solid #ddd; - box-shadow: inset 0 1px 2px rgba(0,0,0,.07); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07); margin: 1px 0; min-width: 80px; overflow: hidden; @@ -1142,7 +1141,7 @@ ul.wc_coupon_list_block { } .view { - white-space: nowrap + white-space: nowrap; } .edit { @@ -1163,11 +1162,11 @@ ul.wc_coupon_list_block { .wc-order-item-discount { display: block; - margin-top: .5em; + margin-top: 0.5em; } small.times { - margin-right: .25em; + margin-right: 0.25em; } } @@ -1200,19 +1199,19 @@ ul.wc_coupon_list_block { table.meta, table.display_meta { - margin: .5em 0 0 0; + margin: 0.5em 0 0; font-size: 0.92em !important; color: #888; tr { th { border: 0; - padding: 0 4px .5em 0; + padding: 0 4px 0.5em 0; line-height: 1.5em; width: 20%; } td { - padding: 0 4px .5em 0; + padding: 0 4px 0.5em 0; border: 0; line-height: 1.5em; @@ -1236,7 +1235,7 @@ ul.wc_coupon_list_block { } p { - margin: 0 0 .5em; + margin: 0 0 0.5em; line-height: 1.5em; } @@ -1259,8 +1258,8 @@ ul.wc_coupon_list_block { vertical-align: middle; margin: 0; - &:before { - @include icon( "\e007" ); + &::before { + @include icon( '\e007' ); color: #ccc; } } @@ -1274,8 +1273,8 @@ ul.wc_coupon_list_block { vertical-align: middle; margin: 0; - &:before { - @include icon( "\e014" ); + &::before { + @include icon( '\e014' ); color: #ccc; } } @@ -1289,15 +1288,15 @@ ul.wc_coupon_list_block { vertical-align: middle; margin: 0; - &:before { - @include icon( "\e01a" ); + &::before { + @include icon( '\e01a' ); color: #ccc; } } .shipping_method_name, .shipping_method { width: 100%; - margin: 0 0 .5em; + margin: 0 0 0.5em; } } @@ -1314,13 +1313,13 @@ ul.wc_coupon_list_block { visibility: hidden; margin: 3px -18px 0 0; - &:before { - @include icon_dashicons( "\f153" ); + &::before { + @include icon_dashicons( '\f153' ); color: #999; } &:hover { - &:before { + &::before { color: $red; } } @@ -1337,9 +1336,9 @@ ul.wc_coupon_list_block { display: block; color: $red; white-space: nowrap; - margin-top: .5em; - &:before { - @include icon_dashicons( "\f171" ); + margin-top: 0.5em; + &::before { + @include icon_dashicons( '\f171' ); position: relative; top: auto; left: auto; @@ -1362,14 +1361,14 @@ ul.wc_coupon_list_block { color: #ccc; display: inline-block; cursor: pointer; - padding: 0 0 .5em 0; + padding: 0 0 0.5em; margin: 0 0 0 12px; vertical-align: middle; text-decoration: none; line-height: 16px; width: 16px; overflow: hidden; - &:before { + &::before { margin: 0; padding: 0; font-size: 16px; @@ -1377,7 +1376,7 @@ ul.wc_coupon_list_block { height: 16px; } &:hover { - &:before { + &::before { color: #999; } } @@ -1387,20 +1386,20 @@ ul.wc_coupon_list_block { } .edit-order-item { - &:before { - @include icon_dashicons( "\f464" ); + &::before { + @include icon_dashicons( '\f464' ); position: relative; } } .delete-order-item, .delete_refund { - &:before { - @include icon_dashicons( "\f158" ); + &::before { + @include icon_dashicons( '\f158' ); position: relative; } &:hover { - &:before { + &::before { color: $red; } } @@ -1439,7 +1438,7 @@ ul.wc_coupon_list_block { } button { - margin: 2px 0 0 0; + margin: 2px 0 0; } } @@ -1485,7 +1484,7 @@ ul.wc_coupon_list_block { float: left; } - .tablenav { + .tablenav { float: right; clear: none; } @@ -1568,43 +1567,43 @@ ul.wc_coupon_list_block { mark.cancelled, mark.processing, mark.refunded { - &:after { + &::after { @include icon; } } - mark.pending:after { - content: "\e012"; + mark.pending::after { + content: '\e012'; color: $orange; } - mark.completed:after { - content: "\e015"; + mark.completed::after { + content: '\e015'; color: $blue; } - mark.on-hold:after { - content: "\e033"; + mark.on-hold::after { + content: '\e033'; color: #999; } - mark.failed:after { - content: "\e016"; + mark.failed::after { + content: '\e016'; color: #d0c21f; } - mark.cancelled:after { - content: "\e013"; + mark.cancelled::after { + content: '\e013'; color: $red; } - mark.processing:after { - content: "\e011"; + mark.processing::after { + content: '\e011'; color: #73a724; } - mark.refunded:after { - content: "\e014"; + mark.refunded::after { + content: '\e014'; color: #999; } } @@ -1620,8 +1619,8 @@ ul.wc_coupon_list_block { margin: 0 auto; color: #999; - &:after { - @include icon( "\e026" ); + &::after { + @include icon( '\e026' ); line-height: 16px; } } @@ -1633,8 +1632,8 @@ ul.wc_coupon_list_block { margin: 0 auto; color: #999; - &:after { - @include icon( "\e027" ); + &::after { + @include icon( '\e027' ); line-height: 16px; } } @@ -1650,18 +1649,18 @@ ul.wc_coupon_list_block { width: 2em; } - .processing:after { - @include icon( "\e00f" ); + .processing::after { + @include icon( '\e00f' ); line-height: 1.85; } - .complete:after { - @include icon_dashicons( "\f147" ); + .complete::after { + @include icon_dashicons( '\f147' ); line-height: 1.85; } - .view:after { - @include icon_dashicons( "\f177" ); + .view::after { + @include icon_dashicons( '\f177' ); line-height: 1.85; } } @@ -1676,27 +1675,27 @@ ul.wc_coupon_list_block { height: 2em !important; width: 2em; - &:after { + &::after { @include icon; line-height: 1.85; } } - .edit:after { - font-family: "Dashicons"; - content: "\f464"; + .edit::after { + font-family: 'Dashicons'; + content: '\f464'; } - .link:after { - content: "\e00d"; + .link::after { + content: '\e00d'; } - .view:after { - content: "\e010"; + .view::after { + content: '\e010'; } - .refresh:after { - content: "\e031"; + .refresh::after { + content: '\e031'; } } @@ -1720,8 +1719,8 @@ ul.wc_coupon_list_block { height: 2em !important; width: 2em; - &:after { - @include icon("\f111"); + &::after { + @include icon('\f111'); font-family: 'Dashicons'; line-height: 1.85; } @@ -1731,7 +1730,7 @@ ul.wc_coupon_list_block { /* Order notes */ ul.order_notes { - padding: 2px 0 0 0; + padding: 2px 0 0; li { .note_content { @@ -1758,35 +1757,35 @@ ul.order_notes { } a.delete_note { - color: $red + color: $red; } - .note_content:after { - content: ""; - display: block; - position: absolute; - bottom: -10px; - left: 20px; - width: 0; - height: 0; - border-width: 10px 10px 0 0; - border-style: solid; - border-color: #efefef transparent; + .note_content::after { + content: ''; + display: block; + position: absolute; + bottom: -10px; + left: 20px; + width: 0; + height: 0; + border-width: 10px 10px 0 0; + border-style: solid; + border-color: #efefef transparent; } } li.customer-note { .note_content { - background: #A7CEDC; + background: #a7cedc; } - .note_content:after { - border-color: #A7CEDC transparent; + .note_content::after { + border-color: #a7cedc transparent; } } li.system-note { .note_content { background: #d7cad2; } - .note_content:after { + .note_content::after { border-color: #d7cad2 transparent; } } @@ -1810,7 +1809,7 @@ table.wp-list-table { .column-thumb { width: 52px; text-align: center; - white-space: nowrap + white-space: nowrap; } .column-name { @@ -1880,8 +1879,8 @@ table.wp-list-table { @include ir(); margin: 0 auto; - &:before { - @include icon_dashicons( "\f128" ); + &::before { + @include icon_dashicons( '\f128' ); } } @@ -1889,13 +1888,13 @@ table.wp-list-table { margin: 0; cursor: pointer; - &:before { - content: "\f155"; + &::before { + content: '\f155'; } &.not-featured { - &:before { - content: "\f154"; + &::before { + content: '\f154'; } } } @@ -1909,9 +1908,9 @@ table.wp-list-table { span.wc-type { margin: 0; - &:before { - font-family: "WooCommerce"; - content: "\e006"; + &::before { + font-family: 'WooCommerce'; + content: '\e006'; } } @@ -1919,28 +1918,28 @@ table.wp-list-table { @include ir(); font-size: 1.6em; - &:before { - @include icon( "\e006" ); + &::before { + @include icon( '\e006' ); } - &.grouped:before { - content: "\e002"; + &.grouped::before { + content: '\e002'; } - &.external:before { - content: "\e034"; + &.external::before { + content: '\e034'; } - &.variable:before { - content: "\e003"; + &.variable::before { + content: '\e003'; } - &.downloadable:before { - content: "\e001"; + &.downloadable::before { + content: '\e001'; } - &.virtual:before { - content: "\e000"; + &.virtual::before { + content: '\e000'; } } @@ -1964,21 +1963,21 @@ table.wp-list-table { @include ir(); margin: 0 auto; - &:after { + &::after { @include icon; } } - .order-notes_head:after { - content: "\e028"; + .order-notes_head::after { + content: '\e028'; } - .notes_head:after { - content: "\e026"; + .notes_head::after { + content: '\e026'; } - .status_head:after { - content: "\e011"; + .status_head::after { + content: '\e011'; } .column-order_items { @@ -1986,7 +1985,7 @@ table.wp-list-table { table.order_items { width: 100%; - margin: 3px 0 0 0; + margin: 3px 0 0; padding: 0; display: none; @@ -2028,7 +2027,7 @@ a.import_rates { } #rates-pagination { float: right; - margin-right: .5em; + margin-right: 0.5em; .tablenav { margin: 0; } @@ -2049,14 +2048,14 @@ table.wc_input_table { td { padding: 0; - border-right: 1px solid #DFDFDF; - border-bottom: 1px solid #DFDFDF; + border-right: 1px solid #dfdfdf; + border-bottom: 1px solid #dfdfdf; border-top: 0; background: #fff; cursor: default; - input[type="text"], - input[type="number"] { + input[type='text'], + input[type='number'] { width: 100%; padding: 8px 10px; margin: 0; @@ -2108,7 +2107,7 @@ table.wc_input_table { padding: 0 4px; } - .ui-sortable:not(.ui-sortable-disabled) { + .ui-sortable:not( .ui-sortable-disabled ) { td.sort { cursor: move; font-size: 15px; @@ -2116,8 +2115,8 @@ table.wc_input_table { text-align: center; vertical-align: middle; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'Dashicons'; text-align: center; line-height: 1; @@ -2129,7 +2128,7 @@ table.wc_input_table { } &:hover { - &:before { + &::before { color: #333; } } @@ -2186,7 +2185,7 @@ table.wc_shipping { line-height: 2em; } - tr:nth-child(odd) { + tr:nth-child( odd ) { td { background: #f9f9f9; } @@ -2229,8 +2228,8 @@ table.wc_shipping { text-align: center; vertical-align: middle; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'Dashicons'; text-align: center; line-height: 1; @@ -2263,8 +2262,8 @@ table.wc_shipping { height: 2em !important; width: 2em; - &:after { - @include icon("\f111"); + &::after { + @include icon('\f111'); font-family: 'Dashicons'; line-height: 1.85; } @@ -2275,7 +2274,7 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class td, th { vertical-align: top; line-height: 24px; - padding: 1em 1em; + padding: 1em; font-size: 14px; background: #fff; li { @@ -2284,11 +2283,11 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class } } td.wc-shipping-zones-blank-state, td.wc-shipping-zone-method-blank-state { - background: #F7F1F6 !important; + background: #f7f1f6 !important; overflow: hidden; position: relative; padding: 7.5em 7.5%; - border-bottom: 2px solid #EEE2EC; + border-bottom: 2px solid #eee2ec; p, li { color: #a46497; font-size: 1.5em; @@ -2306,12 +2305,12 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class margin-left: 1em; list-style: circle inside; } - &:before { - content: "\e01b"; - font-family: "WooCommerce"; + &::before { + content: '\e01b'; + font-family: 'WooCommerce'; text-align: center; line-height: 1; - color: #EEE2EC; + color: #eee2ec; display: block; width: 1em; font-size: 40em; @@ -2327,22 +2326,22 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class box-shadow: inset 0 1px 0 rgba( 255, 255, 255, 0.2 ), 0 1px 0 rgba( 0, 0, 0, 0.15 ); margin: 0; opacity: 1; - text-shadow: 0px -1px 1px #8a4f7f, 1px 0px 1px #8a4f7f, 0px 1px 1px #8a4f7f, -1px 0px 1px #8a4f7f; + text-shadow: 0 -1px 1px #8a4f7f, 1px 0 1px #8a4f7f, 0 1px 1px #8a4f7f, -1px 0 1px #8a4f7f; font-size: 1.5em; - padding: .75em 1em; + padding: 0.75em 1em; height: auto; position: relative; z-index: 1; } } tbody.wc-shipping-zone-rows, .wc-shipping-zone-method-rows { - tr:nth-child(odd) { + tr:nth-child( odd ) { td { background: #f9f9f9; } } } - tr.odd, .wc-shipping-class-rows tr:nth-child(odd) { + tr.odd, .wc-shipping-class-rows tr:nth-child( odd ) { td { background: #f9f9f9; } @@ -2355,8 +2354,8 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class font-size: 15px; text-align: center; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'Dashicons'; text-align: center; line-height: 1; @@ -2368,15 +2367,15 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class line-height: 24px; } &:hover { - &:before { + &::before { color: #333; } } } td.wc-shipping-zone-worldwide { text-align: center; - &:before { - content: "\f319"; + &::before { + content: '\f319'; font-family: 'dashicons'; text-align: center; line-height: 1; @@ -2436,12 +2435,12 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class display: inline; margin: 0; } - li:before { - content: ", "; + li::before { + content: ', '; } - li:first-child:before, - li:nth-child(2):before { - content: ""; + li:first-child::before, + li:nth-child( 2 )::before { + content: ''; } li:first-child { display: block; @@ -2455,15 +2454,15 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class .add_shipping_method { display: block; width: 24px; - padding: 24px 0 0 0; + padding: 24px 0 0; height: 0; overflow: hidden; cursor: pointer; - &:before { + &::before { @include icon; font-family: 'Dashicons'; - content: "\f502"; + content: '\f502'; color: #999; vertical-align: middle; line-height: 24px; @@ -2473,7 +2472,7 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class &.disabled { cursor: not-allowed; - &:before { + &::before { color: #ccc; } } @@ -2490,14 +2489,14 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class .status-enabled { margin-top: 1px; display: inline-block; - &:before { + &::before { line-height: inherit; } } .status-disabled { margin-top: 1px; display: inline-block; - &:before { + &::before { line-height: inherit; } } @@ -2531,7 +2530,7 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class position: relative; .woocommerce-help-tip { float: right; - margin: -8px -.5em 0 0; + margin: -8px -0.5em 0 0; vertical-align: middle; right: 0; top: 50%; @@ -2543,7 +2542,7 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class width: 50%; min-width: 250px; } - input[type="checkbox"] { + input[type='checkbox'] { width: auto; min-width: 16px; } @@ -2568,7 +2567,7 @@ table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-class margin-top: 0; } .wc-shipping-zone-method-description { - margin: .75em 1px 0; + margin: 0.75em 1px 0; line-height: 1.5em; color: #999; font-style: italic; @@ -2585,7 +2584,7 @@ img.help_tip { } .postbox img.help_tip { - margin-top: 0px; + margin-top: 0; } .postbox .woocommerce-help-tip { @@ -2600,22 +2599,22 @@ img.help_tip { } .status-manual { - &:before { - @include icon( "\e008" ); + &::before { + @include icon( '\e008' ); color: #999; } } .status-enabled { - &:before { - @include icon( "\e015" ); + &::before { + @include icon( '\e015' ); color: $woocommerce; } } .status-disabled { - &:before { - @include icon( "\e013" ); + &::before { + @include icon( '\e013' ); color: #ccc; } } @@ -2636,7 +2635,7 @@ img.help_tip { } .wc-admin-breadcrumb { - margin-left: .5em; + margin-left: 0.5em; a { color: #a46497; } @@ -2658,8 +2657,8 @@ img.help_tip { } } - textarea[disabled="disabled"] { - background: #DFDFDF !important; + textarea[disabled='disabled'] { + background: #dfdfdf !important; } table.form-table { @@ -2753,7 +2752,7 @@ img.help_tip { position: absolute; border: 1px solid #ccc; border-radius: 3px; - box-shadow: 0 1px 3px rgba(0,0,0,0.2); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); .ui-slider { border: 0 !important; @@ -2788,7 +2787,7 @@ img.help_tip { } .wc_emails_wrapper { - padding: 0 15px 10px 0; + padding: 0 15px 10px 0; } } } @@ -2863,8 +2862,8 @@ img.help_tip { border: 3px dashed #dddddd; position: relative; - &:after { - @include icon_dashicons( "\f161" ); + &::after { + @include icon_dashicons( '\f161' ); font-size: 2.618em; line-height: 72px; color: #ddd; @@ -2899,13 +2898,13 @@ img.help_tip { @include ir(); font-size: 1.4em; - &:before { - @include icon_dashicons( "\f153" ); + &::before { + @include icon_dashicons( '\f153' ); color: #999; } &:hover { - &:before { + &::before { color: $red; } } @@ -2953,7 +2952,7 @@ img.help_tip { } input, select { - margin: -3px 0 0 .5em; + margin: -3px 0 0 0.5em; vertical-align: middle; } } @@ -2974,7 +2973,7 @@ img.help_tip { height: auto; width: 100%; outline: 0; - margin: 10px 0 10px; + margin: 10px 0; display: block; &::-webkit-input-placeholder { @@ -3017,7 +3016,7 @@ img.help_tip { li { display: block; - padding: 0 0 10px 0; + padding: 0 0 10px; input { width: auto; @@ -3045,8 +3044,8 @@ img.help_tip { border-right: 1px solid #eee; box-sizing: border-box; - &:after { - content: ""; + &::after { + content: ''; display: block; width: 100%; height: 9999em; @@ -3072,73 +3071,73 @@ img.help_tip { line-height: 20px !important; border-bottom: 1px solid #eee; - &:before { - @include iconbeforedashicons( "\f107" ); + &::before { + @include iconbeforedashicons( '\f107' ); } } &.general_options { - a:before { - content: "\f107"; + a::before { + content: '\f107'; } } &.inventory_options { - a:before { - content: "\f481"; + a::before { + content: '\f481'; } } &.shipping_options { - a:before { - font-family: "WooCommerce"; - content: "\e01a"; + a::before { + font-family: 'WooCommerce'; + content: '\e01a'; } } &.linked_product_options { - a:before { - content: "\f103"; + a::before { + content: '\f103'; } } &.attribute_options { - a:before { - content: "\f175"; + a::before { + content: '\f175'; } } &.advanced_options { - a:before { + a::before { font-family: 'Dashicons'; - content: "\f111"; + content: '\f111'; } } &.variations_options { - a:before { - content: "\f509"; + a::before { + content: '\f509'; } } &.usage_restriction_options { - a:before { - font-family: "WooCommerce"; - content: "\e602"; + a::before { + font-family: 'WooCommerce'; + content: '\e602'; } } &.usage_limit_options { - a:before { - font-family: "WooCommerce"; - content: "\e601"; + a::before { + font-family: 'WooCommerce'; + content: '\e601'; } } &.general_coupon_data { - a:before { - font-family: "WooCommerce"; - content: "\e600"; + a::before { + font-family: 'WooCommerce'; + content: '\e600'; } } @@ -3168,8 +3167,8 @@ img.help_tip { } } - .add.button:before { - @include iconbefore( "\e007" ); + .add.button::before { + @include iconbefore( '\e007' ); } } @@ -3220,8 +3219,8 @@ img.help_tip { padding: 5px 9px; line-height: 24px; - &:after { - content: "."; + &::after { + content: '.'; display: block; height: 0; clear: both; @@ -3283,13 +3282,13 @@ img.help_tip { @include ir(); font-size: 1.2em; - &:before { - @include icon_dashicons( "\f153" ); + &::before { + @include icon_dashicons( '\f153' ); color: #999; } &:hover { - &:before { + &::before { color: $red; } } @@ -3304,8 +3303,8 @@ img.help_tip { background: #f9f9f9; padding-right: 7px !important; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'Dashicons'; text-align: center; line-height: 1; @@ -3317,7 +3316,7 @@ img.help_tip { } &:hover { - &:before { + &::before { color: #333; } } @@ -3334,13 +3333,13 @@ img.help_tip { float: right; font-size: 15px; font-weight: 400; - margin-right: .5em; + margin-right: 0.5em; visibility: hidden; text-align: center; vertical-align: middle; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'Dashicons'; text-align: center; line-height: 28px; @@ -3352,7 +3351,7 @@ img.help_tip { } &:hover { - &:before { + &::before { color: #777; } } @@ -3372,7 +3371,7 @@ img.help_tip { .downloadable_files { padding: 0 9px 0 162px; position: relative; - margin: 9px 0 9px; + margin: 9px 0; label { position: absolute; @@ -3396,7 +3395,7 @@ img.help_tip { margin-bottom: 1em; } - .short:nth-of-type(2) { + .short:nth-of-type( 2 ) { clear: left; } } @@ -3439,10 +3438,10 @@ img.help_tip { vertical-align: top; } - input[type="text"], - input[type="email"], - input[type="number"], - input[type="password"] { + input[type='text'], + input[type='email'], + input[type='number'], + input[type='password'] { width: 50%; float: left; } @@ -3456,10 +3455,10 @@ img.help_tip { float: left; } - input[type="text"].short, - input[type="email"].short, - input[type="number"].short, - input[type="password"].short, + input[type='text'].short, + input[type='email'].short, + input[type='number'].short, + input[type='password'].short, .short { width: 50%; } @@ -3644,12 +3643,12 @@ img.help_tip { .handlediv { width: 27px; - &:before { - content: "\f142" !important; + &::before { + content: '\f142' !important; cursor: pointer; display: inline-block; - font: 400 20px/1 "Dashicons"; - line-height: .5 !important; + font: 400 20px/1 'Dashicons'; + line-height: 0.5 !important; padding: 8px 10px; position: relative; right: 12px; @@ -3661,8 +3660,8 @@ img.help_tip { @include border-radius(3px); .handlediv { - &:before { - content: "\f140" !important; + &::before { + content: '\f140' !important; } } @@ -3673,7 +3672,7 @@ img.help_tip { h3 { margin: 0 !important; - padding: .75em .75em .75em 1em !important; + padding: 0.75em 0.75em 0.75em 1em !important; font-size: 1em !important; overflow: hidden; zoom: 1; @@ -3701,7 +3700,7 @@ img.help_tip { select { font-family: sans-serif; max-width: 20%; - margin: .25em .25em .25em 0; + margin: 0.25em 0.25em 0.25em 0; } .handlediv { @@ -3717,9 +3716,9 @@ img.help_tip { &.woocommerce_variation h3 { cursor: pointer; - padding: .5em .75em .5em 1em !important; + padding: 0.5em 0.75em 0.5em 1em !important; a.delete, .handlediv, .sort { - margin-top: .25em; + margin-top: 0.25em; } } @@ -3764,7 +3763,7 @@ img.help_tip { } select, - .select2-container { + .select2-container { width: 100% !important; } @@ -3812,7 +3811,7 @@ img.help_tip { } a { - padding: 0px 10px 3px; + padding: 0 10px 3px; background: rgba(0, 0, 0, 0.05); font-size: 16px; font-weight: 400; @@ -3823,7 +3822,7 @@ img.help_tip { a.disabled:active, a.disabled:focus, a.disabled:hover { - color: #A0A5AA; + color: #a0a5aa; background: rgba(0, 0, 0, 0.05); } } @@ -3831,7 +3830,7 @@ img.help_tip { .variations-defaults { float: left; select { - margin: .25em .25em .25em 0; + margin: 0.25em 0.25em 0.25em 0; } } @@ -3859,8 +3858,8 @@ img.help_tip { display: none; } - &:before { - content: "\f128"; + &::before { + content: '\f128'; font-family: 'Dashicons'; position: absolute; top: 0; @@ -3874,18 +3873,18 @@ img.help_tip { -webkit-font-smoothing: antialiased; } - &.remove{ + &.remove { img { display: block; } - &:before { - content: "\f335"; + &::before { + content: '\f335'; display: none; } &:hover { - &:before { + &::before { display: block; } } @@ -3895,7 +3894,7 @@ img.help_tip { .options { border: 1px solid #eee; border-width: 1px 0; - padding: .25em 0; + padding: 0.25em 0; label { display: inline-block; @@ -3957,7 +3956,7 @@ img.help_tip { } img.tips { - padding: 5px 0 0 0; + padding: 5px 0 0; } #tiptip_holder { @@ -4014,13 +4013,13 @@ img.tips { .chart-tooltip, .wc_error_tip { color: #fff; - font-size: .8em; + font-size: 0.8em; max-width: 150px; background: #333; text-align: center; border-radius: 3px; - padding: .618em 1em; - box-shadow: 0 1px 3px rgba(0,0,0,0.2); + padding: 0.618em 1em; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); code { padding: 1px; @@ -4047,8 +4046,8 @@ img.tips { margin: 1.5em 1px 0 -1em; z-index: 9999999; - &:after { - content: ""; + &::after { + content: ''; display: block; border: 8px solid #d82223; border-right-color: transparent; @@ -4067,7 +4066,7 @@ img.tips { img.ui-datepicker-trigger { vertical-align: middle; margin-top: -1px; - cursor: pointer + cursor: pointer; } .woocommerce_options_panel img.ui-datepicker-trigger, @@ -4079,7 +4078,7 @@ img.ui-datepicker-trigger { } #ui-datepicker-div { - display: none + display: none; } /** @@ -4101,16 +4100,16 @@ img.ui-datepicker-trigger { .widefat { td { vertical-align: top; - padding: 7px 7px; + padding: 7px; .description { - margin: 4px 0 0 0; + margin: 4px 0 0; } } } .postbox { - &:after { - content: "."; + &::after { + content: '.'; display: block; height: 0; clear: both; @@ -4140,8 +4139,8 @@ img.ui-datepicker-trigger { display: block; text-decoration: none; - &:before { - @include iconbeforedashicons( "\f346" ); + &::before { + @include iconbeforedashicons( '\f346' ); margin-right: 4px; } } @@ -4154,13 +4153,13 @@ img.ui-datepicker-trigger { background: #f5f5f5; border-bottom: 1px solid #ccc; - &:before, - &:after { - content: " "; + &::before, + &::after { + content: ' '; display: table; } - &:after { + &::after { clear: both; } @@ -4234,8 +4233,8 @@ img.ui-datepicker-trigger { background: #fafafa; border: 1px solid #dfdfdf; - &:after { - content: "."; + &::after { + content: '.'; display: block; height: 0; clear: both; @@ -4251,11 +4250,11 @@ img.ui-datepicker-trigger { margin: 0; color: $blue; border-top-width: 0; - background-image: -webkit-gradient(linear,left bottom,left top,from(#ececec),to(#f9f9f9)); - background-image: -webkit-linear-gradient(bottom,#ececec,#f9f9f9); - background-image: -moz-linear-gradient(bottom,#ececec,#f9f9f9); - background-image: -o-linear-gradient(bottom,#ececec,#f9f9f9); - background-image: linear-gradient(to top,#ececec,#f9f9f9); + background-image: -webkit-gradient(linear, left bottom, left top, from(#ececec), to(#f9f9f9)); + background-image: -webkit-linear-gradient(bottom, #ececec, #f9f9f9); + background-image: -moz-linear-gradient(bottom, #ececec, #f9f9f9); + background-image: -o-linear-gradient(bottom, #ececec, #f9f9f9); + background-image: linear-gradient(to top, #ececec, #f9f9f9); &.section_title:hover { color: $red; @@ -4268,10 +4267,10 @@ img.ui-datepicker-trigger { span { display: block; - &:after { - @include iconafter( "\e035" ); + &::after { + @include iconafter( '\e035' ); float: right; - font-size: .9em; + font-size: 0.9em; line-height: 1.618; } } @@ -4279,7 +4278,7 @@ img.ui-datepicker-trigger { &.open { color: #333; - span:after { + span::after { display: none; } } @@ -4378,7 +4377,7 @@ img.ui-datepicker-trigger { padding: 1em; display: block; margin: 0; - -webkit-transition: all ease .5s; + -webkit-transition: all ease 0.5s; box-shadow: inset 0 -1px 0 0 #dfdfdf; @@ -4388,7 +4387,7 @@ img.ui-datepicker-trigger { color: #464646; font-weight: normal; display: block; - font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif; + font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; del { color: #e74c3c; @@ -4408,13 +4407,13 @@ img.ui-datepicker-trigger { } .pie-chart-legend { - margin: 12px 0 0 0; + margin: 12px 0 0; overflow: hidden; li { float: left; margin: 0; - padding: 6px 0 0 0; + padding: 6px 0 0; border-top: 4px solid #999; text-align: center; box-sizing: border-box; @@ -4501,21 +4500,21 @@ img.ui-datepicker-trigger { height: 2em !important; width: 2em; - &:after { + &::after { @include icon_dashicons; line-height: 1.85; } } a.edit { - &:after { - content: "\f464"; + &::after { + content: '\f464'; } } a.view { - &:after { - content: "\f177"; + &::after { + content: '\f177'; } } } @@ -4628,20 +4627,20 @@ table.bar_chart { } .post-type-shop_order { - .woocommerce-BlankState-message:before { - @include icon( "\e01d" ); + .woocommerce-BlankState-message::before { + @include icon( '\e01d' ); } } .post-type-shop_coupon { - .woocommerce-BlankState-message:before { - @include icon( "\e600" ); + .woocommerce-BlankState-message::before { + @include icon( '\e600' ); } } .post-type-product { - .woocommerce-BlankState-message:before { - @include icon( "\e006" ); + .woocommerce-BlankState-message::before { + @include icon( '\e006' ); } } @@ -4656,22 +4655,22 @@ table.bar_chart { font-size: 1.2em; max-width: 500px; - &:before { + &::before { color: #ddd; - text-shadow: 0 -1px 1px rgba(0,0,0,0.2), 0 1px 0 rgba(255,255,255,0.8); + text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(255, 255, 255, 0.8); font-size: 8em; display: block; position: relative !important; top: auto; left: auto; line-height: 1em; - margin: 0 0 0.1875em 0; + margin: 0 0 0.1875em; } } .woocommerce-BlankState-cta { font-size: 1.2em; - padding: .75em 1.5em; + padding: 0.75em 1.5em; height: auto; } } @@ -4697,10 +4696,10 @@ table.bar_chart { } .short, - input[type="text"].short, - input[type="email"].short, - input[type="number"].short, - input[type="password"].short, + input[type='text'].short, + input[type='email'].short, + input[type='number'].short, + input[type='password'].short, .dimensions_field .wrap { width: 80%; } @@ -4718,7 +4717,7 @@ table.bar_chart { } table { - margin: 0 12px 24px 12px; + margin: 0 12px 24px; width: 94%; .sort { @@ -4762,7 +4761,7 @@ table.bar_chart { text-indent: -999px; padding: 10px; - &:before { + &::before { position: absolute; top: 0; right: 0; @@ -4831,7 +4830,7 @@ table.bar_chart { text-align: left; padding-bottom: 0; - &:before { + &::before { display: none !important; } @@ -4842,7 +4841,7 @@ table.bar_chart { .is-expanded { td { - &:not(.hidden) { + &:not( .hidden ) { overflow: visible; } } @@ -4865,7 +4864,7 @@ table.bar_chart { margin: 0; } - &:before { + &::before { display: none !important; } } @@ -4884,7 +4883,7 @@ table.bar_chart { .is-expanded { td { - &:not(.hidden) { + &:not( .hidden ) { overflow: visible; } } @@ -4908,7 +4907,7 @@ table.bar_chart { .woocommerce_options_panel fieldset.form-field, .woocommerce_options_panel p.form-field { - padding: 5px 20px 5px 20px !important; + padding: 5px 20px !important; } } @@ -4949,7 +4948,7 @@ table.bar_chart { bottom: 0; min-height: 360px; background: #000; - opacity: .7; + opacity: 0.7; z-index: 99900; } @@ -4988,10 +4987,10 @@ table.bar_chart { border: 0; border-left: 1px solid #ddd; background-color: transparent; - -webkit-transition: color .1s ease-in-out,background .1s ease-in-out; - transition: color .1s ease-in-out,background .1s ease-in-out; + -webkit-transition: color 0.1s ease-in-out, background 0.1s ease-in-out; + transition: color 0.1s ease-in-out, background 0.1s ease-in-out; - &:before { + &::before { font: normal 22px/50px 'dashicons' !important; color: #666; display: block; @@ -5040,7 +5039,7 @@ table.bar_chart { padding: 1em 1.5em; background: #fcfcfc; border-top: 1px solid #dfdfdf; - box-shadow: 0 -4px 4px -4px rgba(0,0,0,0.1); + box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1); .inner { float: right; diff --git a/assets/css/auth.scss b/assets/css/auth.scss index 8da348a6058..999da15afc4 100644 --- a/assets/css/auth.scss +++ b/assets/css/auth.scss @@ -18,7 +18,7 @@ body { .wc-auth-content { background: #fff; - box-shadow: 0 1px 3px rgba(0,0,0,0.13); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13); overflow: hidden; padding: 24px 24px 0; zoom: 1; @@ -43,7 +43,7 @@ body { } a { - color: #A16696; + color: #a16696; &:hover, &:focus { color: #111; } @@ -53,13 +53,13 @@ body { label { color: #999; display: block; - margin-bottom: .5em; + margin-bottom: 0.5em; } input { box-sizing: border-box; font-size: 1.3em; - padding: .5em; + padding: 0.5em; width: 100%; } @@ -133,10 +133,10 @@ body { color: #fff; float: right; opacity: 1; - text-shadow: 0px -1px 1px #8a4f7f, 1px 0px 1px #8a4f7f, 0px 1px 1px #8a4f7f, -1px 0px 1px #8a4f7f; + text-shadow: 0 -1px 1px #8a4f7f, 1px 0 1px #8a4f7f, 0 1px 1px #8a4f7f, -1px 0 1px #8a4f7f; &:hover, &:focus { - background: #B472A8; + background: #b472a8; color: #fff; } } diff --git a/assets/css/dashboard.scss b/assets/css/dashboard.scss index 619e07d339f..0ad8bf7908b 100644 --- a/assets/css/dashboard.scss +++ b/assets/css/dashboard.scss @@ -6,10 +6,10 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; -@import "fonts"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; +@import 'fonts'; /** * Styling begins @@ -26,7 +26,6 @@ ul.woocommerce_stats { font-size: 0.8em; border-left: 1px solid #fff; border-right: 1px solid #ececec; - text-align: center; box-sizing: border-box; } @@ -39,7 +38,7 @@ ul.woocommerce_stats { } strong { - font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif; + font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif; font-size: 4em; line-height: 1.2em; font-weight: normal; @@ -71,7 +70,7 @@ ul.woocommerce_stats { display: block; color: #aaa; padding: 9px 12px; - -webkit-transition: all ease .5s; + -webkit-transition: all ease 0.5s; position: relative; font-size: 12px; @@ -84,7 +83,7 @@ ul.woocommerce_stats { right: 0; top: 50%; margin-right: 12px; - margin-top: -1.25em + margin-top: -1.25em; } strong { @@ -98,13 +97,13 @@ ul.woocommerce_stats { &:hover { color: #2ea2cc; - &:before, + &::before, strong { color: #2ea2cc !important; } } - &:before { + &::before { @include icon(); font-size: 2em; position: relative; @@ -125,32 +124,32 @@ ul.woocommerce_stats { li.sales-this-month { width: 100%; - a:before { - font-family: "Dashicons"; - content: "\f185"; + a::before { + font-family: 'Dashicons'; + content: '\f185'; } } li.best-seller-this-month { width: 100%; - a:before { - content: "\e006"; + a::before { + content: '\e006'; } } li.processing-orders { border-right: 1px solid #ececec; - a:before { - content: "\e011"; + a::before { + content: '\e011'; color: $green; } } li.on-hold-orders { - a:before { - content: "\e033"; + a::before { + content: '\e033'; color: #999; } } @@ -158,15 +157,15 @@ ul.woocommerce_stats { li.low-in-stock { border-right: 1px solid #ececec; - a:before { - content: "\e016"; + a::before { + content: '\e016'; color: $orange; } } li.out-of-stock { - a:before { - content: "\e013"; + a::before { + content: '\e013'; color: $red; } } @@ -181,7 +180,7 @@ ul.woocommerce_stats { h4.meta { line-height: 1.4; - margin: -.2em 0 0 0; + margin: -0.2em 0 0 0; font-weight: normal; color: #999; } @@ -202,12 +201,12 @@ ul.woocommerce_stats { position: relative; height: 1.5em; line-height: 1.5; - margin-left: .5em; + margin-left: 0.5em; width: 5.4em; font-family: 'WooCommerce' !important; - &:before { - content: "\e021\e021\e021\e021\e021"; + &::before { + content: '\e021\e021\e021\e021\e021'; color: darken( #ccc, 10% ); float: left; top: 0; @@ -226,8 +225,8 @@ ul.woocommerce_stats { padding-top: 1.5em; } - span:before { - content: "\e020\e020\e020\e020\e020"; + span::before { + content: '\e020\e020\e020\e020\e020'; top: 0; position: absolute; left: 0; @@ -238,7 +237,7 @@ ul.woocommerce_stats { } } -#dash-right-now li.product-count a:before { +#dash-right-now li.product-count a::before { font-family: 'WooCommerce'; - content: "\e01d"; + content: '\e01d'; } diff --git a/assets/css/menu.scss b/assets/css/menu.scss index 8e025c56572..7f1773543c9 100644 --- a/assets/css/menu.scss +++ b/assets/css/menu.scss @@ -7,28 +7,28 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; -@import "fonts"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; +@import 'fonts'; /** * Styling begins */ -#adminmenu #toplevel_page_woocommerce .menu-icon-generic div.wp-menu-image:before { +#adminmenu #toplevel_page_woocommerce .menu-icon-generic div.wp-menu-image::before { font-family: 'WooCommerce' !important; - content: "\e03d"; + content: '\e03d'; } -#adminmenu #menu-posts-product .menu-icon-post div.wp-menu-image:before, -#adminmenu #menu-posts-product .menu-icon-product div.wp-menu-image:before { +#adminmenu #menu-posts-product .menu-icon-post div.wp-menu-image::before, +#adminmenu #menu-posts-product .menu-icon-product div.wp-menu-image::before { font-family: 'WooCommerce' !important; - content: "\e006"; + content: '\e006'; } -#adminmenu #toplevel_page_wc-reports .menu-icon-generic div.wp-menu-image:before { +#adminmenu #toplevel_page_wc-reports .menu-icon-generic div.wp-menu-image::before { font-family: 'WooCommerce' !important; - content: "\e023"; + content: '\e023'; font-size: 1.3em !important; } @@ -36,9 +36,9 @@ span.mce_woocommerce_shortcodes_button { background-image: none !important; @include ir(); - &:before { - @include icon( "\e01d" ); - font-size: .9em; + &::before { + @include icon( '\e01d' ); + font-size: 0.9em; line-height: 1.2; } } @@ -55,8 +55,8 @@ span.mce_woocommerce_shortcodes_button { text-decoration: underline; } - &:before { - content: "\f348"; + &::before { + content: '\f348'; display: inline-block; font: 400 18px/1 dashicons; speak: none; diff --git a/assets/css/prettyPhoto.scss b/assets/css/prettyPhoto.scss index 7070f7cda50..1fdeb077f39 100644 --- a/assets/css/prettyPhoto.scss +++ b/assets/css/prettyPhoto.scss @@ -7,10 +7,10 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; -@import "fonts"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; +@import 'fonts'; /** * Mixins @@ -19,7 +19,7 @@ border-radius: 100%; height: 1em; width: 1em; - text-shadow: 0 1px 2px rgba(0,0,0,0.5); + text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); background-color: #444; color: #fff !important; font-size: 16px !important; @@ -38,7 +38,7 @@ div.pp_woocommerce { .pp_content_container { background: #fff; border-radius: 3px; - box-shadow: 0 1px 30px rgba(0,0,0,0.25); + box-shadow: 0 1px 30px rgba(0, 0, 0, 0.25); padding: 20px 0; @include clearfix(); } @@ -55,9 +55,9 @@ div.pp_woocommerce { ul { li { a { - border: 1px solid rgba(0,0,0,0.5); + border: 1px solid rgba(0, 0, 0, 0.5); background: #fff; - box-shadow: 0 1px 2px rgba(0,0,0,0.2); + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); border-radius: 2px; display: block; @@ -77,10 +77,10 @@ div.pp_woocommerce { .pp_previous, .pp_next { - &:before { + &::before { @include button(); font-family: 'WooCommerce'; - content: "\e00b"; + content: '\e00b'; text-indent: 0; display: none; position: absolute; @@ -90,23 +90,23 @@ div.pp_woocommerce { } &:hover { - &:before { + &::before { display: block; } } } .pp_previous { - &:before { + &::before { left: 1em; } } .pp_next { - &:before { + &::before { right: 1em; font-family: 'WooCommerce'; - content: "\e008"; + content: '\e008'; } } @@ -136,13 +136,13 @@ div.pp_woocommerce { .pp_close { @include button(); - top: -.5em; - right: -.5em; + top: -0.5em; + right: -0.5em; font-size: 1.618em !important; - &:before { + &::before { font-family: 'WooCommerce'; - content: "\e013"; + content: '\e013'; display: block; position: absolute; top: 0; @@ -160,9 +160,9 @@ div.pp_woocommerce { position: relative; margin-top: -1px; - &:before { + &::before { font-family: 'WooCommerce'; - content: "\e00b"; + content: '\e00b'; display: block; position: absolute; top: 0; @@ -175,14 +175,14 @@ div.pp_woocommerce { } .pp_arrow_previous { - margin-right: .5em; + margin-right: 0.5em; } .pp_arrow_next { - margin-left: .5em; + margin-left: 0.5em; - &:before { - content: "\e008"; + &::before { + content: '\e008'; } } @@ -190,13 +190,13 @@ div.pp_woocommerce { a.pp_contract { @include button(); right: auto; - left: -.5em; - top: -.5em; + left: -0.5em; + top: -0.5em; font-size: 1.618em !important; - &:before { + &::before { font-family: 'WooCommerce'; - content: "\e005"; + content: '\e005'; display: block; position: absolute; top: 0; @@ -209,8 +209,8 @@ div.pp_woocommerce { } a.pp_contract { - &:before { - content: "\e004"; + &::before { + content: '\e004'; } } @@ -264,7 +264,7 @@ div.pp_woocommerce { font-size: 44px; line-height: 44px; - &:before { + &::before { font-size: 44px; } } @@ -281,12 +281,12 @@ div.pp_woocommerce { .pp_content { width: 100% !important; - #pp_full_res{ - & > img{ + #pp_full_res { + & > img { width: 100% !important; height: auto !important; } - } + } } .currentTextHolder { @@ -385,7 +385,7 @@ div.pp_pic_holder { .pp_content_container .pp_details { float: left; - margin: 10px 0 2px 0; + margin: 10px 0 2px; } .pp_description { @@ -401,7 +401,8 @@ div.pp_pic_holder { .pp_social .facebook { float: left; margin-left: 5px; - width: 55px; overflow: hidden; + width: 55px; + overflow: hidden; } .pp_social .twitter { @@ -469,7 +470,7 @@ a.pp_arrow_next { .pp_gallery ul a { border: 1px #000 solid; - border: 1px rgba(0,0,0,0.5) solid; + border: 1px rgba(0, 0, 0, 0.5) solid; display: block; float: left; height: 33px; @@ -537,7 +538,9 @@ a.pp_contract { } a.pp_close { - position: absolute; right: 0; top: 0; + position: absolute; + right: 0; + top: 0; display: block; text-indent: -10000px; } diff --git a/assets/css/reports-print.scss b/assets/css/reports-print.scss index 14b73edd53f..870656537a9 100644 --- a/assets/css/reports-print.scss +++ b/assets/css/reports-print.scss @@ -15,7 +15,7 @@ } @page { - margin: .5cm; + margin: 0.5cm; } #adminmenuwrap, @@ -67,7 +67,7 @@ h2 .nav-tab { .chart-legend li, .chart-legend li { - padding: .25em .5em !important; + padding: 0.25em 0.5em !important; box-shadow: none !important; border-bottom: 1px solid gray !important; -} \ No newline at end of file +} diff --git a/assets/css/wc-setup.scss b/assets/css/wc-setup.scss index 3579cda74e8..a35214bdb74 100644 --- a/assets/css/wc-setup.scss +++ b/assets/css/wc-setup.scss @@ -14,7 +14,7 @@ body { } } .wc-setup-content { - box-shadow: 0 1px 3px rgba(0,0,0,0.13); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13); padding: 24px 24px 0; background: #fff; overflow: hidden; @@ -62,7 +62,7 @@ body { .description { line-height: 1.5em; display: block; - margin-top: .25em; + margin-top: 0.25em; color: #999; font-style: italic; } @@ -70,7 +70,7 @@ body { width: auto; box-sizing: inherit; padding: inherit; - margin: 0 .5em 0 0; + margin: 0 0.5em 0 0; box-shadow: none; } } @@ -93,7 +93,7 @@ body { } table.tax-rates { width: 100%; - font-size: .92em; + font-size: 0.92em; th { padding: 0; text-align: center; @@ -116,8 +116,8 @@ body { &.sort { cursor: move; color: #ccc; - &:before { - content: "\f333"; + &::before { + content: '\f333'; font-family: 'dashicons'; } } @@ -135,8 +135,8 @@ body { overflow: hidden; position: relative; display: inline-block; - &:before { - content: "\f502"; + &::before { + content: '\f502'; font-family: 'dashicons'; position: absolute; left: 0; @@ -153,8 +153,8 @@ body { overflow: hidden; position: relative; display: inline-block; - &:before { - content: "\f182"; + &::before { + content: '\f182'; font-family: 'dashicons'; position: absolute; left: 0; @@ -189,7 +189,7 @@ body { line-height: 1.75em; input { vertical-align: middle; - margin: 1px 0 0 0; + margin: 1px 0 0; height: 1.75em; width: 1.75em; line-height: 1.75em; @@ -231,35 +231,35 @@ body { ul { padding: 0 2em 0 0; list-style: none outside; - margin: 0 0 -.75em; + margin: 0 0 -0.75em; li a { display: block; - padding: 0 0 .75em; + padding: 0 0 0.75em; } .setup-product { a { background-color: #bb77ae; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - text-shadow: 0px -1px 1px #A36597, 1px 0px 1px #A36597, 0px 1px 1px #A36597, -1px 0px 1px #A36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; font-size: 1em; height: auto; line-height: 1.75em; - margin: 0 0 .75em; + margin: 0 0 0.75em; opacity: 1; padding: 1em; text-align: center; - + &:hover, &:focus, &:active { - background: #A36597; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + background: #a36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; } } } - li a:before { + li a::before { color: #82878c; font: normal 20px/1 'dashicons'; speak: none; @@ -272,20 +272,20 @@ body { text-decoration: none !important; vertical-align: top; } - .learn-more a:before { - content: "\f105"; + .learn-more a::before { + content: '\f105'; } - .video-walkthrough a:before { - content: "\f126"; + .video-walkthrough a::before { + content: '\f126'; } - .newsletter a:before { - content: "\f465"; + .newsletter a::before { + content: '\f465'; } } } .woocommerce-tracker, .updated { padding: 24px 24px 0; - margin: 0 0 24px 0; + margin: 0 0 24px; overflow: hidden; background: #f5f5f5; p { @@ -293,7 +293,7 @@ body { margin: 0 0 12px; } p:last-child { - margin: 0 0 24px 0; + margin: 0 0 24px; } } } @@ -317,8 +317,8 @@ body { border-bottom: 4px solid #ccc; line-height: 1.4em; } - li:before { - content: ""; + li::before { + content: ''; border: 4px solid #ccc; border-radius: 100%; width: 4px; @@ -333,14 +333,14 @@ body { li.active { border-color: #a16696; color: #a16696; - &:before { + &::before { border-color: #a16696; } } li.done { border-color: #a16696; color: #a16696; - &:before { + &::before { border-color: #a16696; background: #a16696; } @@ -351,28 +351,28 @@ body { .button { float: right; font-size: 1.25em; - padding: .5em 1em; + padding: 0.5em 1em; line-height: 1em; - margin-right: .5em; + margin-right: 0.5em; margin-bottom: 2px; height: auto; border-radius: 4px; } .button-primary { background-color: #bb77ae; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - text-shadow: 0px -1px 1px #A36597, 1px 0px 1px #A36597, 0px 1px 1px #A36597, -1px 0px 1px #A36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; float: right; margin: 0; opacity: 1; &:hover, &:focus, &:active { - background: #A36597; - border-color: #A36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; - box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #A36597; + background: #a36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; } } } @@ -424,7 +424,7 @@ ul.wc-wizard-payment-gateways { } &.checked { - background: #F7F1F6; + background: #f7f1f6; .wc-wizard-gateway-settings { display: table; @@ -435,12 +435,12 @@ ul.wc-wizard-payment-gateways { font-style: italic; p { - margin: 0 0 .5em; + margin: 0 0 0.5em; } } .wc-wizard-gateway-enable { - margin: 0 0 .5em; + margin: 0 0 0.5em; label { display: block; @@ -452,7 +452,7 @@ ul.wc-wizard-payment-gateways { vertical-align: middle; } } - label:before { + label::before { content: ''; background: #fff; border: 2px solid #eee; @@ -473,8 +473,8 @@ ul.wc-wizard-payment-gateways { width: 0; position: absolute; - &:checked + label:before { - content: "\f147"; + &:checked + label::before { + content: '\f147'; font-family: 'dashicons'; color: #fff; border-color: #a46497; diff --git a/assets/css/woocommerce-layout.scss b/assets/css/woocommerce-layout.scss index fbac4703e79..482fd34b5e3 100644 --- a/assets/css/woocommerce-layout.scss +++ b/assets/css/woocommerce-layout.scss @@ -6,9 +6,9 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; /** * Styling begins diff --git a/assets/css/woocommerce-smallscreen.scss b/assets/css/woocommerce-smallscreen.scss index 9c7cf8cd6f3..50a4beb3f77 100644 --- a/assets/css/woocommerce-smallscreen.scss +++ b/assets/css/woocommerce-smallscreen.scss @@ -6,9 +6,9 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; /** * Style begins @@ -44,7 +44,7 @@ text-align: left !important; // This must always align left on handheld } - &:before { + &::before { content: attr(data-title) ': '; font-weight: 700; float: left; @@ -52,15 +52,15 @@ &.product-remove, &.actions { - &:before { + &::before { display: none; } } } - &:nth-child(2n) { + &:nth-child( 2n ) { td { - background-color: rgba(0,0,0,0.025); + background-color: rgba(0, 0, 0, 0.025); } } } @@ -72,13 +72,13 @@ &.order-actions { text-align: left; - &:before { + &::before { display: none; } .button { float: none; - margin: .125em .25em .125em 0; + margin: 0.125em 0.25em 0.125em 0; } } } @@ -99,7 +99,7 @@ /** * Products */ - &, &[class*="columns-"] { + &, &[class*='columns-'] { ul.products { li.product { width: 48%; @@ -107,7 +107,7 @@ clear: both; margin: 0 0 2.992em; - &:nth-child(2n) { + &:nth-child( 2n ) { float: right; clear: none !important; // This should never clear. } @@ -142,7 +142,7 @@ .coupon { float: none; @include clearfix(); - padding-bottom: .5em; + padding-bottom: 0.5em; input, .button, diff --git a/assets/css/woocommerce.scss b/assets/css/woocommerce.scss index 53daff01c87..8278cba27d6 100644 --- a/assets/css/woocommerce.scss +++ b/assets/css/woocommerce.scss @@ -7,11 +7,11 @@ /** * Imports */ -@import "bourbon"; -@import "mixins"; -@import "variables"; -@import "animation"; -@import "fonts"; +@import 'bourbon'; +@import 'mixins'; +@import 'variables'; +@import 'animation'; +@import 'fonts'; /** * Global styles @@ -29,7 +29,7 @@ p.demo_store { background-color: $primary; color: $primarytext; z-index: 99998; - box-shadow: 0 1px 1em rgba(0,0,0,0.2); + box-shadow: 0 1px 1em rgba(0, 0, 0, 0.2); a { color: $primarytext; } @@ -83,7 +83,7 @@ p.demo_store { small.note { display: block; color: $subtext; - font-size: .857em; + font-size: 0.857em; margin-top: 10px; } @@ -212,7 +212,7 @@ p.demo_store { a { display: inline-block; - padding: .5em 0; + padding: 0.5em 0; font-weight: 700; color: $secondarytext; text-decoration: none; @@ -233,26 +233,26 @@ p.demo_store { text-shadow: inherit; } - &:before { + &::before { box-shadow: 2px 2px 0 $contentbg; } - &:after { + &::after { box-shadow: -2px 2px 0 $contentbg; } } - &:before, - &:after { + &::before, + &::after { border: 1px solid darken( $secondary, 10% ); position: absolute; bottom: -1px; width: 5px; height: 5px; - content: " "; + content: ' '; } - &:before { + &::before { left: -6px; -webkit-border-bottom-right-radius: 4px; -moz-border-bottom-right-radius: 4px; @@ -261,7 +261,7 @@ p.demo_store { box-shadow: 2px 2px 0 $secondary; } - &:after { + &::after { right: -6px; -webkit-border-bottom-left-radius: 4px; -moz-border-bottom-left-radius: 4px; @@ -271,9 +271,9 @@ p.demo_store { } } - &:before { + &::before { position: absolute; - content: " "; + content: ' '; width: 100%; bottom: 0; left: 0; @@ -303,7 +303,7 @@ p.demo_store { } table { - border-width: 0 0 1px 0; + border-width: 0 0 1px; td { padding-left: 0; @@ -376,7 +376,7 @@ p.demo_store { td { vertical-align: top; - padding-bottom: .5em; + padding-bottom: 0.5em; border: 0; } } @@ -386,19 +386,19 @@ p.demo_store { span.onsale { min-height: 3.236em; min-width: 3.236em; - padding: .202em; + padding: 0.202em; font-size: 1em; font-weight: 700; position: absolute; text-align: center; line-height: 3.236; - top: -.5em; - left: -.5em; + top: -0.5em; + left: -0.5em; margin: 0; border-radius: 100%; background-color: $highlight; color: $highlightext; - font-size: .857em; + font-size: 0.857em; -webkit-font-smoothing: antialiased; } @@ -424,11 +424,11 @@ p.demo_store { top: 0; right: 0; left: auto; - margin: -.5em -.5em 0 0; + margin: -0.5em -0.5em 0 0; } h3 { - padding: .5em 0; + padding: 0.5em 0; margin: 0; font-size: 1em; } @@ -450,7 +450,7 @@ p.demo_store { } .star-rating { - font-size: .857em; + font-size: 0.857em; } .button { @@ -461,8 +461,8 @@ p.demo_store { color: $highlight; display: block; font-weight: normal; - margin-bottom: .5em; - font-size: .857em; + margin-bottom: 0.5em; + font-size: 0.857em; del { color: inherit; @@ -525,7 +525,7 @@ p.demo_store { line-height: 1; font-size: 1em; font-weight: normal; - padding: .5em; + padding: 0.5em; min-width: 1em; display: block; } @@ -554,7 +554,7 @@ p.demo_store { position: relative; text-decoration: none; overflow: visible; - padding: .618em 1em; + padding: 0.618em 1em; font-weight: 700; border-radius: 3px; left: auto; @@ -572,26 +572,26 @@ p.demo_store { opacity: 0.25; padding-right: 2.618em; - &:after { - font-family: "WooCommerce"; - content: "\e01c"; + &::after { + font-family: 'WooCommerce'; + content: '\e01c'; vertical-align: top; -webkit-font-smoothing: antialiased; font-weight: 400; position: absolute; - top: .618em; + top: 0.618em; right: 1em; -webkit-animation: spin 2s linear infinite; - -moz-animation: spin 2s linear infinite; - animation: spin 2s linear infinite; + -moz-animation: spin 2s linear infinite; + animation: spin 2s linear infinite; } } &.added { - &:after { + &::after { font-family: 'WooCommerce'; - content: "\e017"; - margin-left: .53em; + content: '\e017'; + margin-left: 0.53em; vertical-align: bottom; } } @@ -630,7 +630,7 @@ p.demo_store { color: inherit; cursor: not-allowed; opacity: 0.5; - padding: .618em 1em; + padding: 0.618em 1em; &:hover { color: inherit; @@ -645,7 +645,7 @@ p.demo_store { } a.added_to_cart { - padding-top: .5em; + padding-top: 0.5em; white-space: nowrap; display: inline-block; } @@ -658,7 +658,7 @@ p.demo_store { float: right; color: $subtext; font-size: 15px; - margin: 10px 0 0 0; + margin: 10px 0 0; a { text-decoration: none; @@ -757,8 +757,8 @@ p.demo_store { } } - .commentlist > li:before { - content: ""; + .commentlist > li::before { + content: ''; } } } @@ -776,8 +776,8 @@ p.demo_store { width: 5.4em; font-family: 'star'; - &:before { - content: "\73\73\73\73\73"; + &::before { + content: '\73\73\73\73\73'; color: darken( $secondary, 10% ); float: left; top: 0; @@ -794,8 +794,8 @@ p.demo_store { padding-top: 1.5em; } - span:before { - content: "\53\53\53\53\53"; + span::before { + content: '\53\53\53\53\53'; top: 0; position: absolute; left: 0; @@ -808,7 +808,7 @@ p.demo_store { display: block; .star-rating { - margin: .5em 4px 0 0; + margin: 0.5em 4px 0 0; float: left; } } @@ -816,14 +816,14 @@ p.demo_store { .products { .star-rating { display: block; - margin: 0 0 .5em; + margin: 0 0 0.5em; float: none; } } .hreview-aggregate { .star-rating { - margin: 10px 0 0 0; + margin: 10px 0 0; } } @@ -833,7 +833,7 @@ p.demo_store { position: static; margin: 0; width: auto; - padding: 0 0 0; + padding: 0; background: transparent none; border: 0; @@ -863,7 +863,7 @@ p.demo_store { display: inline-block; text-decoration: none; - &:before { + &::before { display: block; position: absolute; top: 0; @@ -871,40 +871,40 @@ p.demo_store { width: 1em; height: 1em; line-height: 1; - font-family: "WooCommerce"; - content: "\e021"; + font-family: 'WooCommerce'; + content: '\e021'; text-indent: 0; } &:hover { - ~ a:before { - content: "\e021"; + ~ a::before { + content: '\e021'; } } } &:hover { a { - &:before { - content: "\e020"; + &::before { + content: '\e020'; } } } &.selected { a.active { - &:before { - content: "\e020"; + &::before { + content: '\e020'; } - ~ a:before { - content: "\e021"; + ~ a::before { + content: '\e021'; } } - a:not(.active) { - &:before { - content: "\e020"; + a:not( .active ) { + &::before { + content: '\e020'; } } } @@ -915,7 +915,7 @@ p.demo_store { */ table.shop_attributes { border: 0; - border-top: 1px dotted rgba(0,0,0,0.1); + border-top: 1px dotted rgba(0, 0, 0, 0.1); margin-bottom: 1.618em; width: 100%; @@ -924,7 +924,7 @@ p.demo_store { font-weight: 700; padding: 8px; border-top: 0; - border-bottom: 1px dotted rgba(0,0,0,0.1); + border-bottom: 1px dotted rgba(0, 0, 0, 0.1); margin: 0; line-height: 1.5; } @@ -933,7 +933,7 @@ p.demo_store { font-style: italic; padding: 0; border-top: 0; - border-bottom: 1px dotted rgba(0,0,0,0.1); + border-bottom: 1px dotted rgba(0, 0, 0, 0.1); margin: 0; line-height: 1.5; @@ -945,13 +945,13 @@ p.demo_store { .alt td, .alt th { - background: rgba(0,0,0,0.025); + background: rgba(0, 0, 0, 0.025); } } table.shop_table { - border: 1px solid rgba(0,0,0,0.1); - margin: 0px -1px 24px 0px; + border: 1px solid rgba(0, 0, 0, 0.1); + margin: 0 -1px 24px 0; text-align: left; width: 100%; border-collapse: separate; @@ -963,7 +963,7 @@ p.demo_store { } td { - border-top: 1px solid rgba(0,0,0,0.1); + border-top: 1px solid rgba(0, 0, 0, 0.1); padding: 6px 12px; vertical-align: middle; @@ -985,7 +985,7 @@ p.demo_store { tfoot th, tbody th { font-weight: 700; - border-top: 1px solid rgba(0,0,0,0.1); + border-top: 1px solid rgba(0, 0, 0, 0.1); } } @@ -1006,14 +1006,14 @@ p.demo_store { text-align: right; .button { - margin: .125em 0 .125em .25em; + margin: 0.125em 0 0.125em 0.25em; } } } td.product-name { dl.variation { - margin: .25em 0; + margin: 0.25em 0; @include clearfix(); dt, @@ -1025,13 +1025,13 @@ p.demo_store { dt { font-weight: 700; - padding: 0 0 .25em 0; + padding: 0 0 0.25em; margin: 0 4px 0 0; clear: left; } dd { - padding: 0 0 .25em 0; + padding: 0 0 0.25em; p:last-child { margin-bottom: 0; @@ -1080,7 +1080,7 @@ p.demo_store { dl { margin: 0; padding-left: 1em; - border-left: 2px solid rgba(0,0,0,0.1); + border-left: 2px solid rgba(0, 0, 0, 0.1); @include clearfix(); dt, @@ -1092,13 +1092,13 @@ p.demo_store { dt { font-weight: 700; - padding: 0 0 .25em 0; + padding: 0 0 0.25em; margin: 0 4px 0 0; clear: left; } dd { - padding: 0 0 .25em 0; + padding: 0 0 0.25em; p:last-child { margin-bottom: 0; @@ -1253,7 +1253,7 @@ p.demo_store { form.register { border: 1px solid darken( $secondary, 10% ); padding: 20px; - margin: 2em 0 2em 0px; + margin: 2em 0; text-align: left; border-radius: 5px; } @@ -1265,7 +1265,7 @@ p.demo_store { li { margin: 0; - padding: .25em 0 .25em 22px; + padding: 0.25em 0 0.25em 22px; text-indent: -22px; list-style: none outside; input { @@ -1341,8 +1341,8 @@ p.demo_store { li.chosen { a { - &:before { - @include iconbefore( "\e013" ); + &::before { + @include iconbefore( '\e013' ); color: $red; } } @@ -1367,8 +1367,8 @@ p.demo_store { a { text-decoration: none; - &:before { - @include iconbefore( "\e013" ); + &::before { + @include iconbefore( '\e013' ); color: $red; } } @@ -1401,8 +1401,8 @@ p.demo_store { .ui-slider { position: relative; text-align: left; - margin-left: .5em; - margin-right: .5em; + margin-left: 0.5em; + margin-right: 0.5em; } .ui-slider .ui-slider-handle { @@ -1414,17 +1414,17 @@ p.demo_store { border-radius: 1em; cursor: ew-resize; outline: none; - top: -.3em; + top: -0.3em; //&:last-child { - margin-left: -.5em; + margin-left: -0.5em; //} } .ui-slider .ui-slider-range { position: absolute; z-index: 1; - font-size: .7em; + font-size: 0.7em; display: block; border: 0; border-radius: 1em; @@ -1438,7 +1438,7 @@ p.demo_store { } .ui-slider-horizontal { - height: .5em; + height: 0.5em; } .ui-slider-horizontal .ui-slider-range { @@ -1483,8 +1483,8 @@ p.demo_store { li.chosen { a { - &:before { - @include iconbefore( "\e013" ); + &::before { + @include iconbefore( '\e013' ); color: $red; } } @@ -1499,7 +1499,7 @@ p.demo_store { padding: 1em 2em 1em 3.5em; margin: 0 0 2em; position: relative; - background-color: lighten($secondary,5%); + background-color: lighten($secondary, 5%); color: $secondarytext; border-top: 3px solid $primary; list-style: none outside; @@ -1507,9 +1507,9 @@ p.demo_store { width: auto; word-wrap: break-word; - &:before { - font-family: "WooCommerce"; - content: "\e028"; + &::before { + font-family: 'WooCommerce'; + content: '\e028'; display: inline-block; position: absolute; top: 1em; @@ -1530,8 +1530,8 @@ p.demo_store { .woocommerce-message { border-top-color: #8fae1b; - &:before { - content: "\e015"; + &::before { + content: '\e015'; color: #8fae1b; } } @@ -1539,7 +1539,7 @@ p.demo_store { .woocommerce-info { border-top-color: #1e85be; - &:before { + &::before { color: #1e85be; } } @@ -1547,8 +1547,8 @@ p.demo_store { .woocommerce-error { border-top-color: #b81c23; - &:before { - content: "\e016"; + &::before { + content: '\e016'; color: #b81c23; } } @@ -1599,8 +1599,8 @@ p.demo_store { margin-left: 0; padding-left: 0; - &:before { - @include iconbefore( "\e00a" ); + &::before { + @include iconbefore( '\e00a' ); } .count { @@ -1676,8 +1676,8 @@ p.demo_store { } .shipping-calculator-button { - &:after { - @include iconafter( "\e019" ); + &::after { + @include iconafter( '\e019' ); } } } @@ -1799,7 +1799,7 @@ p.demo_store { img { vertical-align: middle; - margin: -2px 0 0 .5em; + margin: -2px 0 0 0.5em; padding: 0; position: relative; box-shadow: none; @@ -1820,7 +1820,7 @@ p.demo_store { box-sizing: border-box; width: 100%; padding: 1em; - margin: 1em 0 1em 0; + margin: 1em 0; font-size: 0.92em; border-radius: 2px; line-height: 1.5; @@ -1849,7 +1849,7 @@ p.demo_store { margin: 0; .woocommerce-SavedPaymentMethods-token, .woocommerce-SavedPaymentMethods-new { - margin: 0 0 .5em 0; + margin: 0 0 0.5em; label { cursor: pointer; } @@ -1872,43 +1872,43 @@ p.demo_store { font-size: 1.5em; padding: 8px; background-repeat: no-repeat; - background-position: right .618em center; + background-position: right 0.618em center; background-size: 32px 20px; &.visa { - background-image: url(../images/icons/credit-cards/visa.svg); + background-image: url('../images/icons/credit-cards/visa.svg'); } &.mastercard { - background-image: url(../images/icons/credit-cards/mastercard.svg); + background-image: url('../images/icons/credit-cards/mastercard.svg'); } &.laser { - background-image: url(../images/icons/credit-cards/laser.svg); + background-image: url('../images/icons/credit-cards/laser.svg'); } &.dinersclub { - background-image: url(../images/icons/credit-cards/diners.svg); + background-image: url('../images/icons/credit-cards/diners.svg'); } &.maestro { - background-image: url(../images/icons/credit-cards/maestro.svg); + background-image: url('../images/icons/credit-cards/maestro.svg'); } &.jcb { - background-image: url(../images/icons/credit-cards/jcb.svg); + background-image: url('../images/icons/credit-cards/jcb.svg'); } &.amex { - background-image: url(../images/icons/credit-cards/amex.svg); + background-image: url('../images/icons/credit-cards/amex.svg'); } &.discover { - background-image: url(../images/icons/credit-cards/discover.svg); + background-image: url('../images/icons/credit-cards/discover.svg'); } } span.help { - font-size: .857em; + font-size: 0.857em; color: $subtext; font-weight: normal; } @@ -1921,15 +1921,15 @@ p.demo_store { margin-bottom: 0; } - &:before { - content: ""; + &::before { + content: ''; display: block; border: 1em solid darken( $secondary, 5% ); /* arrow size / color */ border-right-color: transparent; border-left-color: transparent; border-top-color: transparent; position: absolute; - top: -.75em; + top: -0.75em; left: 0; margin: -1em 0 0 2em; } @@ -1956,7 +1956,7 @@ p.demo_store { .woocommerce-password-strength { text-align: center; font-weight: 600; - padding: 3px .5em; + padding: 3px 0.5em; font-size: 1em; &.strong { @@ -1981,7 +1981,7 @@ p.demo_store { } .woocommerce-password-hint { - margin: .5em 0 0 0; + margin: 0.5em 0 0; display: block; } @@ -2041,7 +2041,7 @@ p.demo_store { /** * Twenty Sixteen specific styles */ -body:not(.search-results) { +body:not( .search-results ) { .twentysixteen { .entry-summary { color: inherit;