remove unnecessary vendor-prefix mixins
This commit is contained in:
Martin Filipovic Hinrichs
parent
81ba40afed
commit
a8365afbc8
4 changed files with 27 additions and 226 deletions
|
|
@ -1,57 +0,0 @@
|
|||
/// Convert angle
|
||||
/// @author Chris Eppstein
|
||||
/// @param {Number} $value - Value to convert
|
||||
/// @param {String} $unit - Unit to convert to
|
||||
/// @return {Number} Converted angle
|
||||
@function convert-angle($value, $unit) {
|
||||
$convertable-units: deg grad turn rad;
|
||||
$conversion-factors: 1 (10grad/9deg) (1turn/360deg) (3.1415926rad/180deg);
|
||||
@if index($convertable-units, unit($value)) and index($convertable-units, $unit) {
|
||||
@return $value
|
||||
/ nth($conversion-factors, index($convertable-units, unit($value)))
|
||||
* nth($conversion-factors, index($convertable-units, $unit));
|
||||
}
|
||||
|
||||
@warn "Cannot convert `#{unit($value)}` to `#{$unit}`.";
|
||||
}
|
||||
|
||||
/// Test if `$value` is an angle
|
||||
/// @param {*} $value - Value to test
|
||||
/// @return {Bool}
|
||||
@function is-direction($value) {
|
||||
$is-direction: index((to top, to top right, to right top, to right, to bottom right, to right bottom, to bottom, to bottom left, to left bottom, to left, to left top, to top left), $value);
|
||||
$is-angle: type-of($value) == 'number' and index('deg' 'grad' 'turn' 'rad', unit($value));
|
||||
|
||||
@return $is-direction or $is-angle;
|
||||
}
|
||||
|
||||
/// Convert a direction to legacy syntax
|
||||
/// @param {Keyword | Angle} $value - Value to convert
|
||||
/// @require {function} is-direction
|
||||
/// @require {function} convert-angle
|
||||
@function legacy-direction($value) {
|
||||
@if is-direction($value) == false {
|
||||
@warn "Cannot convert `#{$value}` to legacy syntax because it doesn't seem to be an angle or a direction";
|
||||
}
|
||||
|
||||
$conversion-map: (
|
||||
to top : bottom,
|
||||
to top right : bottom left,
|
||||
to right top : left bottom,
|
||||
to right : left,
|
||||
to bottom right : top left,
|
||||
to right bottom : left top,
|
||||
to bottom : top,
|
||||
to bottom left : top right,
|
||||
to left bottom : right top,
|
||||
to left : right,
|
||||
to left top : right bottom,
|
||||
to top left : bottom right
|
||||
);
|
||||
|
||||
@if map-has-key($conversion-map, $value) {
|
||||
@return map-get($conversion-map, $value);
|
||||
}
|
||||
|
||||
@return 90deg - convert-angle($value, 'deg');
|
||||
}
|
||||
|
|
@ -1,5 +1,3 @@
|
|||
@import "functions";
|
||||
|
||||
/**
|
||||
* Responsive
|
||||
*/
|
||||
|
|
@ -10,49 +8,6 @@
|
|||
@media screen and (min-width: $size) { @content; }
|
||||
}
|
||||
|
||||
/**
|
||||
* Shorthand
|
||||
*/
|
||||
@mixin transform($transform...) {
|
||||
-webkit-transform: $transform;
|
||||
-moz-transform: $transform;
|
||||
-ms-transform: $transform;
|
||||
-o-transform: $transform;
|
||||
transform: $transform;
|
||||
}
|
||||
|
||||
@mixin transition($transition...) {
|
||||
-webkit-transition: $transition;
|
||||
-moz-transition: $transition;
|
||||
-ms-transition: $transition;
|
||||
-o-transition: $transition;
|
||||
transition: $transition;
|
||||
}
|
||||
|
||||
@mixin box-sizing($boxval) {
|
||||
-webkit-box-sizing: $boxval;
|
||||
-moz-box-sizing: $boxval;
|
||||
box-sizing: $boxval;
|
||||
}
|
||||
|
||||
@mixin box-shadow($shadow...) {
|
||||
-webkit-box-shadow: $shadow;
|
||||
-moz-box-shadow: $shadow;
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
@mixin border-radius($radius) {
|
||||
-webkit-border-radius: $radius;
|
||||
-moz-border-radius: $radius;
|
||||
border-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin filter($filter) {
|
||||
-webkit-filter: $filter;
|
||||
-ms-filter: $filter;
|
||||
filter: $filter;
|
||||
}
|
||||
|
||||
/**
|
||||
* Aspect ratio
|
||||
*/
|
||||
|
|
@ -82,20 +37,3 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Mixin printing a linear-gradient
|
||||
/// as well as a plain color fallback
|
||||
/// and the `-webkit-` prefixed declaration
|
||||
/// @access public
|
||||
/// @param {String | List | Angle} $direction - Linear gradient direction
|
||||
/// @param {Arglist} $color-stops - List of color-stops composing the gradient
|
||||
@mixin linear-gradient($direction, $color-stops...) {
|
||||
@if is-direction($direction) == false {
|
||||
$color-stops: ($direction, $color-stops);
|
||||
$direction: 180deg;
|
||||
}
|
||||
|
||||
background: nth(nth($color-stops, 1), 1);
|
||||
background: -webkit-linear-gradient(legacy-direction($direction), $color-stops);
|
||||
background: linear-gradient($direction, $color-stops);
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
.product-box {
|
||||
border-color: transparent;
|
||||
background: none;
|
||||
@include transition(all .15s ease-in-out);
|
||||
transition: all 0.15s ease-in-out;
|
||||
|
||||
.card-body {
|
||||
padding: 0;
|
||||
|
|
@ -12,14 +12,14 @@
|
|||
.product-image-wrapper,
|
||||
.product-info {
|
||||
background: #ffffff;
|
||||
@include transition(all .15s ease-in-out);
|
||||
transition: all 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.product-image-wrapper {
|
||||
padding: 1rem;
|
||||
margin-bottom: 0.250rem;
|
||||
margin-bottom: 0;
|
||||
@include aspect-ratio(1,1);
|
||||
@include aspect-ratio(1, 1);
|
||||
height: auto;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
|
@ -48,6 +48,7 @@
|
|||
.product-name {
|
||||
height: 88px;
|
||||
-webkit-line-clamp: 4;
|
||||
|
||||
.year,
|
||||
.site,
|
||||
.qty_taste {
|
||||
|
|
@ -58,6 +59,7 @@
|
|||
.year {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.site,
|
||||
.qty_taste {
|
||||
font-size: 16px;
|
||||
|
|
@ -84,6 +86,7 @@
|
|||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.list-price {
|
||||
margin-top: 0.25rem;
|
||||
line-height: 1.3;
|
||||
|
|
@ -110,11 +113,8 @@
|
|||
|
||||
&:hover {
|
||||
border-color: $sw-color-brand-secondary;
|
||||
@include box-shadow(0 0 10px -3px rgba($sw-color-brand-secondary, 0.4));
|
||||
.product-image-wrapper,
|
||||
.product-info {
|
||||
//@include box-shadow(0 0 10px -5px rgba($sw-color-brand-secondary, 0.4));
|
||||
}
|
||||
box-shadow: 0 0 10px -3px rgba($sw-color-brand-secondary, 0.4);
|
||||
|
||||
.product-info {
|
||||
background: #a192b2;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,39 +16,16 @@ strong {
|
|||
|
||||
.head-wrapper {
|
||||
position: relative;
|
||||
/*//height: 305px;
|
||||
//height: 295px;
|
||||
@include aspect-ratio(2500,843,true);
|
||||
//2500x843
|
||||
//@include linear-gradient(to bottom, #DDCFB5, rgba(#DDCFB5,0));
|
||||
background: url("../assets/layout/header_bg.jpg") 50% 50% no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;*/
|
||||
|
||||
.head-hero {
|
||||
position: relative;
|
||||
@include aspect-ratio(2500,625,true);
|
||||
@include aspect-ratio(2500, 625, true);
|
||||
background: url("../assets/layout/header_bg.jpg") 50% 50% no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
/*&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
background: url("../assets/layout/header_bg.jpg") 50% 50% no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
z-index: 0;
|
||||
//opacity: .2;
|
||||
//@include filter(sepia(0.8));
|
||||
}*/
|
||||
|
||||
.header-main {
|
||||
background-color: #ebdff8;
|
||||
z-index: 1;
|
||||
|
|
@ -88,48 +65,19 @@ strong {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
/*&:before {
|
||||
background: url("../assets/layout/header_bg.jpg") 50% 50% no-repeat;
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
@include transform(translateX(-50%));
|
||||
width: 100%;
|
||||
max-width: 1360px;
|
||||
content: '';
|
||||
opacity: .3;
|
||||
}*/
|
||||
|
||||
/*&:after {
|
||||
background: url("../assets/layout/mountain_range.svg") 0 0 no-repeat;
|
||||
-webkit-background-size: 100% auto;
|
||||
background-size: 100% auto;
|
||||
padding-top: (141 / 1080) * 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
@include transform(translateX(-50%));
|
||||
width: 100%;
|
||||
max-width: 1200px;
|
||||
content: '';
|
||||
}*/
|
||||
|
||||
.head-base-logo {
|
||||
@include aspect-ratio(1,1);
|
||||
@include aspect-ratio(1, 1);
|
||||
z-index: 0;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
@include transform(translate(-50%,-50%));
|
||||
@include box-sizing(border-box);
|
||||
transform: translate(-50%, -50%);
|
||||
box-sizing: border-box;
|
||||
max-width: 400px;
|
||||
min-width: 175px;
|
||||
width: 30%;
|
||||
background: rgba(#fff,50%);
|
||||
@include border-radius(999em);
|
||||
background: rgba(#fff, 50%);
|
||||
border-radius: 999em;
|
||||
|
||||
@include for-min-size(901px) {
|
||||
width: 300px;
|
||||
|
|
@ -150,38 +98,31 @@ strong {
|
|||
.-compact & {
|
||||
top: 26%;
|
||||
background: none;
|
||||
|
||||
figure {
|
||||
padding: 0;
|
||||
};
|
||||
}
|
||||
;
|
||||
}
|
||||
}
|
||||
|
||||
.head-mountain_range {
|
||||
position: absolute;
|
||||
/*left: 50%;
|
||||
bottom: 0;
|
||||
@include transform(translateX(-50%));
|
||||
width: 100%;
|
||||
max-width: 1360px;*/
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
||||
&:after {
|
||||
background: url("../assets/layout/mountain_range.svg") 0 0 no-repeat;
|
||||
//background: url("../assets/layout/mountain_range_ext.svg") 0 0 no-repeat;
|
||||
//background: url("../assets/layout/mountain_range_solid.svg") 0 0 no-repeat;
|
||||
-webkit-background-size: 100% auto;
|
||||
background-size: 100% auto;
|
||||
padding-top: (141 / 1180) * 100%;
|
||||
//padding-top: (124 / 1180) * 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
@include transform(translateY(6.3%));
|
||||
transform: translateY(6.3%);
|
||||
content: '';
|
||||
/*border-left: #ddcfb5 5px solid;
|
||||
border-right: #ddcfb5 5px solid;*/
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -195,6 +136,7 @@ strong {
|
|||
.header-search-icon {
|
||||
vertical-align: text-top;
|
||||
}
|
||||
|
||||
.icon-search svg {
|
||||
top: 0;
|
||||
}
|
||||
|
|
@ -213,7 +155,7 @@ strong {
|
|||
}
|
||||
|
||||
.nav-main {
|
||||
background-color: rgba(255,255,255,0.65);
|
||||
background-color: rgba(255, 255, 255, 0.65);
|
||||
background-color: #f2effb;
|
||||
font-weight: 400;
|
||||
padding: 5px 0;
|
||||
|
|
@ -222,6 +164,7 @@ strong {
|
|||
background: #f2effb;
|
||||
}
|
||||
}
|
||||
|
||||
.main-navigation-menu {
|
||||
font-size: 1.5rem;
|
||||
padding: 0 20px;
|
||||
|
|
@ -229,35 +172,8 @@ strong {
|
|||
}
|
||||
|
||||
.content-main {
|
||||
//border-top: #DDCFB5 17px solid;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
//padding-top: 9px;
|
||||
|
||||
/*.content-mountain_range_extender {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 100%;
|
||||
@include transform(translateX(-50%));
|
||||
width: 100%;
|
||||
max-width: 1360px;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
height: 9px;
|
||||
background-color: #DDCFB5;
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 50vw;
|
||||
}
|
||||
|
||||
&:before {
|
||||
right:100%;
|
||||
}
|
||||
&:after {
|
||||
left:100%;
|
||||
}
|
||||
}*/
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
|
|
@ -267,6 +183,7 @@ strong {
|
|||
|
||||
.footer-main {
|
||||
border-top: none;
|
||||
|
||||
.inside {
|
||||
padding: 3rem 0 0;
|
||||
position: relative;
|
||||
|
|
@ -282,8 +199,10 @@ strong {
|
|||
|
||||
.footer-column-logo {
|
||||
align-self: center;
|
||||
|
||||
.footer-column-logo-content {
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
width: 300px;
|
||||
max-width: 100%;
|
||||
|
|
@ -300,6 +219,7 @@ strong {
|
|||
|
||||
footer {
|
||||
font-size: 0.8777777778rem;
|
||||
|
||||
.footer-payment-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -333,7 +253,7 @@ footer {
|
|||
|
||||
.cms-block-image-text-gallery .image-text-gallery-card {
|
||||
background: #fff;
|
||||
@include box-shadow(none);
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue