/** * Header cart */ .site-header-cart { position: relative; .count-number { position: absolute; top: -8px; right: -8px; width: 18px; height: 18px; line-height: 17px; border: 1px solid $color__primary; text-align: center; border-radius: 50%; background: #fff; @include font-size(10); } .cart-contents { text-decoration: none; } .widget_shopping_cart { display: none; background-color: #fff; } .product_list_widget { margin: 0; padding: 0; } } /** * Star rating */ .star-rating { overflow: hidden; position: relative; height: 1.618em; line-height: 1.618; width: 5.3em; font-family: star; font-weight: 400; margin-left: auto; margin-right: auto; &::before { content: "\53\53\53\53\53"; opacity: 0.25; float: left; top: 0; left: 0; position: absolute; } span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; } span::before { content: "\53\53\53\53\53"; top: 0; position: absolute; left: 0; color: #FFA441; } } p.stars { a { position: relative; height: 1em; width: 1em; text-indent: -999em; display: inline-block; text-decoration: none; margin-right: 1px; font-weight: 400; &::before { display: block; position: absolute; top: 0; left: 0; width: 1em; height: 1em; line-height: 1; font-family: star; content: "\53"; color: $color__text-main; text-indent: 0; opacity: 0.25; } &:hover { ~ a::before { content: "\53"; color: $color__text-main; opacity: 0.25; } } } &:hover { a { &::before { content: "\53"; color: $color__link; opacity: 1; } } } &.selected { a.active { &::before { content: "\53"; color: $color__link; opacity: 1; } ~ a::before { content: "\53"; color: $color__text-main; opacity: 0.25; } } a:not(.active) { &::before { content: "\53"; color: $color__link; opacity: 1; } } } } /** * Tabs */ .woocommerce-tabs { margin-top: 70px; margin-bottom: 60px; .woocommerce-Reviews-title { display: none; } ul.tabs { list-style: none; margin: 0 0 32px; padding: 0; text-align: left; border-bottom: 1px solid rgba($color__primary, 0.2); li { display: inline-block; margin: 0; padding-bottom: 0; position: relative; a { @include font-size(18); color: $color__primary; padding: 10px 30px; display: block; border-bottom: 2px solid transparent; transition: border-color 0.2s; &:hover { border-color: $color__primary; } } &.active { a { border-color: $color__primary; } } } } .panel { h2:first-of-type { margin-bottom: 1em; } } } /** * Password strength meter */ .woocommerce-password-strength { text-align: right; &.strong { color: $woocommerce__color-success; } &.short { color: $woocommerce__color-error; } &.bad { color: $woocommerce__color-error; } &.good { color: $woocommerce__color-info; } } /** * Forms */ .form-row { &.woocommerce-validated { input.input-text { box-shadow: inset 2px 0 0 $woocommerce__color-success; } } &.woocommerce-invalid { input.input-text { box-shadow: inset 2px 0 0 $woocommerce__color-error; } } } .required { color: #f00; } /** * Notices */ .woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments { padding: 15px; background-color: #f2f2f2; clear: both; a { color: #716f6f; } } .woocommerce-info { .button { margin-right: 15px; } } .woocommerce-form-coupon-toggle { margin-bottom: 30px; } .checkout_coupon { margin-top: -30px; margin-bottom: 30px; background-color: #f2f2f2; padding: 15px; .form-row { display: inline-block; } } .woocommerce-info, .woocommerce-noreviews, p.no-comments { background-color: #f2f2f2; } .woocommerce-error { background-color: #f2f2f2; } .demo_store { position: fixed; left: 0; bottom: 0; right: 0; margin: 0; padding: 1em; background-color: $woocommerce__color-info; z-index: 9999; } @media screen and (min-width: 48em) { /** * Header cart */ .site-header-cart { .header-elements-left & { &:hover, &.focus { .widget_shopping_cart { left: 0; display: block; } } } .widget_shopping_cart { position: absolute; top: 100%; width: 100%; z-index: 999999; left: -999em; display: block; box-shadow: 0px 8px 40px rgba(0, 0, 0, 0.12); min-width: 400px; margin: 0 auto; padding: 30px 0 0; visibility: hidden; .woocommerce-mini-cart__empty-message { padding: 30px; } .widgettitle { @include font-size(24); padding: 0 30px 30px; margin: 0; position: relative; &:after { content: ''; position: absolute; width: calc(100% - 60px); height: 1px; bottom: 0; left: 30px; background-color: #eee; } } .woocommerce-mini-cart__total, .woocommerce-mini-cart__buttons { background-color: #f5f5f5; margin: 0; padding: 0 30px; } .woocommerce-mini-cart__total { padding-top: 30px; padding-bottom: 24px; display: flex; justify-content: space-between; font-weight: 600; .woocommerce-Price-amount { @include font-size(18); } strong { font-weight: 400; } } .woocommerce-mini-cart__buttons { padding: 30px; position: relative; display: flex; flex-wrap: wrap; &:before { content: ''; position: absolute; width: calc(100% - 60px); height: 1px; top: 0; left: 30px; background-color: #e6e6e6; } .button.checkout { order: -1; color: #fff; width: 100%; text-align: center; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 20px; &:hover { color: #fff; } } .button:not(.checkout) { @include font-size(16); text-align: center; margin: 0 auto; border: 0; background: transparent !important; color: $color__primary; text-decoration: underline; padding: 0 !important; } } } &:hover, &.focus { .widget_shopping_cart { left: auto; right: 0; display: block; visibility: visible; } } .product_list_widget { margin: 0; padding: 0; position: static; box-shadow: none; max-width: 100%; li { display: flex; align-items: center; flex-wrap: wrap; padding: 30px 30px 30px 145px; min-height: 160px; background: transparent; position: relative; max-width: 100%; &:after { content: ''; position: absolute; width: calc(100% - 60px); height: 1px; bottom: 0; left: 30px; background-color: rgba($color__primary, 0.1); } &:last-of-type { padding-bottom: 30px; &:after { display: none; } } img { max-width: 100px; max-height: 100px; position: absolute; top: 30px; left: 30px; } a.remove { width: 18px; height: 18px; line-height: 16px; background-color: $color__primary; color: #fff; text-align: center; border-radius: 50%; position: absolute; top: 22px; left: 22px; z-index: 11; } & > a:not(.remove), & > span { padding-left: 15px; max-width: 100%; } & > span { display: block; font-weight: 600; width: 100%; @include font-size(14); } } } } } /* Prices */ .price { font-weight: 600; ins { background: transparent; } del { color: #999999; } } .wc-block-grid__product-onsale, span.onsale { position: absolute; background: $color__primary; top: 20px; left: 20px; font-weight: 400; @include font-size(14); text-transform: uppercase; color: #fff; padding: 3px 20px; border-radius: 0; z-index: 11; .product-list & { left: 15px; } } .woocommerce-breadcrumb { margin-bottom: 30px; color: $color__primary; opacity: 0.7; a { color: $color__primary; } } .product-gallery-summary del .amount { opacity: 0.5; }