321 lines
8.5 KiB
SCSS
321 lines
8.5 KiB
SCSS
/**
|
|
* Global
|
|
*/
|
|
$body-max-width: 100vw;
|
|
|
|
// Animations
|
|
$transition-time: .35s;
|
|
$transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
|
|
$transition: $transition-time $transition-timing-function;
|
|
|
|
// Fonts
|
|
$header-font-family: 'gilroy-regular',
|
|
sans-serif;
|
|
$body-font-family: 'gilroy-regular',
|
|
sans-serif;
|
|
|
|
|
|
/**
|
|
* Header
|
|
*/
|
|
$header-position: relative;
|
|
$header-background: #FFF;
|
|
$header-height: 90px;
|
|
$header-mobile-height: 90px;
|
|
|
|
// Logo
|
|
$logo-padding: 15px 0;
|
|
$logo-mobile-padding: 10px 0;
|
|
|
|
// Navbar
|
|
$navbar-mobile-on: 'xl';
|
|
$navbar-justify-content: flex-start;
|
|
|
|
// Nav Link
|
|
$nav-link-font-family: $header-font-family;
|
|
$nav-link-font-size: 14px;
|
|
$nav-link-line-height: 20px;
|
|
$nav-link-font-weight: 300;
|
|
$nav-link-color: #000000;
|
|
$nav-link-letter-spacing: 0px;
|
|
$nav-link-text-transform: uppercase;
|
|
$nav-link-background: transparent;
|
|
$nav-link-padding: (($header-height - $nav-link-line-height) / 2) 10px;
|
|
$nav-link-margin: 0 0 0 10px;
|
|
$nav-link-border-radius: 0;
|
|
|
|
$nav-link-color-hover: $primary-color;
|
|
$nav-link-background-hover: transparent;
|
|
|
|
// Dropdown Menu
|
|
$dropdown-menu-position-left: -10px;
|
|
$dropdown-menu-border-color: transparent;
|
|
$dropdown-menu-background: $header-background;
|
|
|
|
// Additional Nav Link
|
|
$add-nav-link-border-color: $border-color;
|
|
|
|
// Buttons
|
|
$header-btn-color: $nav-link-color;
|
|
$header-btn-background: transparent;
|
|
$header-btn-margin: 0;
|
|
|
|
$header-btn-color-hover: $nav-link-color-hover;
|
|
$header-btn-background-hover: transparent;
|
|
|
|
// Buttons Content
|
|
$btn-content-border-color: $border-color;
|
|
$btn-content-border-width: 0px;
|
|
$btn-content-background: $header-background;
|
|
$btn-content-color: #888888;
|
|
$btn-content-link-color: #666666;
|
|
|
|
// Mini Cart Count
|
|
$mini-cart-font-size: 10px;
|
|
$mini-cart-font-weight: 400;
|
|
$mini-cart-width: 14px;
|
|
$mini-cart-height: 12px;
|
|
$mini-cart-color: #fff;
|
|
$mini-cart-background: $primary-color;
|
|
$mini-cart-border: 1px solid $primary-color;
|
|
$mini-cart-border-radius: 50%;
|
|
$mini-cart-position-top: 6px;
|
|
$mini-cart-position-right: 3px;
|
|
|
|
|
|
/**
|
|
* Content
|
|
*/
|
|
$content-padding: 60px 0 60px;
|
|
$content-padding-home: 0;
|
|
$paragraph-margin: 0 0 20px;
|
|
|
|
// Body
|
|
$body-font-size: 16px;
|
|
$body-font-line-height: 1.8;
|
|
$body-color: #000000;
|
|
$body-font-weight: 400;
|
|
$body-letter-spacing: 0;
|
|
|
|
// Headings
|
|
$header-font-size: 28px;
|
|
$header-font-line-height: 1.2;
|
|
$header-color: #000;
|
|
$header-font-weight: 700;
|
|
$header-letter-spacing: 0;
|
|
$header-text-transform: none;
|
|
$header-margin: 40px 0 20px;
|
|
|
|
$header-mobile-font-size: 20px;
|
|
$header-mobile-letter-spacing: 0;
|
|
$header-mobile-margin: 40px 0 20px;
|
|
|
|
/* Std List */
|
|
$std-list-padding-left: 25px;
|
|
$std-list-before-position-left: 0px;
|
|
$std-list-margin-top: 0;
|
|
|
|
/* Buttons */
|
|
$button-font-family: $header-font-family;
|
|
$button-font-size: 15px;
|
|
$button-line-height: 18px;
|
|
$button-color: #fff;
|
|
$button-font-weight: 300;
|
|
$button-padding: 13px 28px;
|
|
$button-border: 1px solid #000;
|
|
$button-border-radius: 0;
|
|
$button-background: #000;
|
|
$button-letter-spacing: 1px;
|
|
$button-text-transform: uppercase;
|
|
|
|
$button-color-hover: #fff;
|
|
$button-border-color-hover: $secondary-color;
|
|
$button-background-hover: $secondary-color;
|
|
|
|
/* Form */
|
|
$input-font-size: $body-font-size;
|
|
$input-padding-y: 8px;
|
|
$input-padding-x: 14px;
|
|
$input-bg: #fff;
|
|
$input-border-radius: 0;
|
|
$input-color: $body-color;
|
|
$input-placeholder-color: #aaa; // ::placeholder
|
|
$input-border-width: 1px;
|
|
$input-border-color: $border-color;
|
|
$input-focus-border-color: $primary-color; // :focus
|
|
$input-focus-box-shadow: 0 0 0 4px rgba($primary-color, .25);
|
|
|
|
|
|
/**
|
|
* Thumbnail Hover
|
|
*/
|
|
$gallery-overlay-background: #000;
|
|
$gallery-overlay-opacity: 0;
|
|
|
|
$gallery-overlay-opacity-hover: .5;
|
|
|
|
$gallery-icon-background: $primary-color;
|
|
$gallery-icon-border-color: $primary-color;
|
|
$gallery-icon-width: 40px;
|
|
$gallery-icon-height: 40px;
|
|
$gallery-icon-border-width: 1px;
|
|
$gallery-icon-border-radius: 50%;
|
|
$gallery-icon-margin-top: -40px;
|
|
$gallery-icon-opacity: 0;
|
|
|
|
$gallery-icon-opacity-hover: 1;
|
|
|
|
|
|
/**
|
|
* Woocommerce
|
|
*/
|
|
$woo-bold-font-weight: 700;
|
|
$woo-border-color: $border-color;
|
|
|
|
// Table Row
|
|
$woo-table-row-odd-background: rgba(230, 230, 230, .3);
|
|
$woo-table-row-hover-background: rgba(230, 230, 230, .5);
|
|
|
|
|
|
/**
|
|
* Woocommerce | Archive
|
|
*/
|
|
// Onsale
|
|
$onsale-position-left: 0;
|
|
$onsale-position-top: 15px;
|
|
$onsale-position-right: auto;
|
|
$onsale-position-bottom: auto;
|
|
$onsale-text-transform: uppercase;
|
|
$onsale-background-color: $primary-color;
|
|
$onsale-color: #fff;
|
|
$onsale-font-size: 12px;
|
|
$onslate-letter-spacing: 1px;
|
|
$onsale-padding: 4px 15px;
|
|
|
|
// Product Col
|
|
$product-col-margin: 10px 0 20px;
|
|
$product-col-mobile-margin: 0 0 30px;
|
|
$product-col-padding: 0 15px;
|
|
|
|
// Product Box
|
|
$product-box-border: 1px solid $woo-border-color;
|
|
$product-box-background: transparent;
|
|
|
|
$product-box-border-color-hover: $woo-border-color;
|
|
$product-box-background-hover: transparent;
|
|
$product-box-shadow-hover: 0 0 5px 2px rgba(0, 0, 0, 0.1);
|
|
|
|
// Product Box Image
|
|
$product-box-img__padding: 0;
|
|
$product-box-img__height: 270px;
|
|
$product-box-img__background: #FFF;
|
|
$product-box-img__object-fit: cover; // contain
|
|
|
|
$product-box-img__hov-position-top: 0;
|
|
$product-box-img__hov-position-left: -100%;
|
|
$product-box-img__hov-opacity: 1;
|
|
$product-box-img__hov-transition: $transition-time;
|
|
|
|
$product-box-img__hov-opacity-hover: 1;
|
|
$product-box-img__hov-position-left-hover: 0;
|
|
|
|
// Product Box Desc
|
|
$product-box-desc-padding: 20px 15px 20px 15px;
|
|
$product-box-desc-simple-padding: 20px 70px 20px 15px;
|
|
|
|
// Product Box Desc H
|
|
$product-box-desc__h-font: $header-font-family;
|
|
$product-box-desc__h-color: $header-color;
|
|
$product-box-desc__h-font-size: 16px;
|
|
$product-box-desc__h-font-weight: $woo-bold-font-weight;
|
|
$product-box-desc__h-line-height: 1.2;
|
|
$product-box-desc__h-margin: 0 0 10px;
|
|
|
|
// Product Box Desc P
|
|
$product-box-desc__p-font: $body-font-family;
|
|
$product-box-desc__p-color: $body-color;
|
|
$product-box-desc__p-font-size: $body-font-size;
|
|
$product-box-desc__p-font-weight: $body-font-weight;
|
|
$product-box-desc__p-line-height: 1.5;
|
|
$product-box-desc__p-margin: 0 0 5px;
|
|
|
|
// Product Box Desc Price
|
|
$product-box-desc__price-font: $body-font-family;
|
|
$product-box-desc__price-color: $header-color;
|
|
$product-box-desc__price-font-size: 15px;
|
|
$product-box-desc__price-font-weight: $woo-bold-font-weight;
|
|
$product-box-desc__price-line-height: $body-font-line-height;
|
|
$product-box-desc__price-margin: 0;
|
|
|
|
$product-box-desc__price-del-color: #777;
|
|
$product-box-desc__price-del-font-size: 14px;
|
|
$product-box-desc__price-del-font-weight: $body-font-weight;
|
|
|
|
// Product Box Desc Btn Box
|
|
$product-box-desc__btn-box-display: block;
|
|
$product-box-desc__btn-box-padding: 0 15px 20px;
|
|
|
|
// Product Box Add to Cart
|
|
$product-box__add-to-cart-display: none; // flex
|
|
$product-box__add-to-cart-position-left: auto;
|
|
$product-box__add-to-cart-position-top: 20px;
|
|
$product-box__add-to-cart-position-right: 15px;
|
|
$product-box__add-to-cart-position-bottom: auto;
|
|
$product-box__add-to-cart-width: 40px;
|
|
$product-box__add-to-cart-height: 40px;
|
|
$product-box__add-to-cart-border: 1px solid $woo-border-color;
|
|
$product-box__add-to-cart-color: #000;
|
|
$product-box__add-to-cart-background: #fff;
|
|
$product-box__add-to-cart-transition: $transition-time;
|
|
|
|
$product-box__add-to-cart-border-color-hover: $woo-border-color;
|
|
$product-box__add-to-cart-color-hover: #000;
|
|
$product-box__add-to-cart-background-hover: $woo-border-color;
|
|
|
|
// Product Box Link
|
|
$product-box__link-display: block;
|
|
|
|
|
|
/**
|
|
* Woocommerce | Single
|
|
*/
|
|
// Product Title
|
|
$single-prod-title-margin: $header-margin;
|
|
$single-prod-title-mobile-margin: $header-mobile-margin;
|
|
|
|
// Product Price
|
|
$single-prod-price-font: $body-font-family;
|
|
$single-prod-price-color: $header-color;
|
|
$single-prod-price-font-size: 20px;
|
|
$single-prod-price-font-weight: $woo-bold-font-weight;
|
|
$single-prod-price-line-height: 1.2;
|
|
$single-prod-price-margin: 0 0 20px;
|
|
|
|
$single-prod-price-del-color: #777;
|
|
$single-prod-price-del-font-size: 18px;
|
|
$single-prod-price-del-font-weight: $body-font-weight;
|
|
|
|
// Product Variations
|
|
$single-prod-variations-margin: 0;
|
|
$single-prod-variations-td-padding: 0 0 15px;
|
|
$single-prod-variations-single_variation_wrap-margin: 20px 0 0;
|
|
|
|
// Product Meta
|
|
$single-prod-content-product_meta-margin: 20px 0;
|
|
|
|
// Product Tabs
|
|
$single-prod-wc-tabs-margin: 0 0 20px;
|
|
|
|
$single-prod-wc-tabs-a-color: #aaa;
|
|
$single-prod-wc-tabs-a-font-size: 15px;
|
|
$single-prod-wc-tabs-a-font-weight: $woo-bold-font-weight;
|
|
$single-prod-wc-tabs-a-line-height: 1.5;
|
|
$single-prod-wc-tabs-a-padding: 8px 15px;
|
|
$single-prod-wc-tabs-a-transition: $transition-time;
|
|
|
|
$single-prod-wc-tabs-a-color-hover: $header-color;
|
|
$single-prod-wc-tabs-a-border-color: $header-color;
|
|
|
|
// Product Gallery
|
|
$single-prod-gal-margin: $header-margin;
|
|
$single-prod-gal-thumbnails-number-per-row: 4; |