kevin/lours.net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

autoprefix

Browse Source
This commit is contained in:
kevin
2019-02-08 15:34:23 +01:00
parent bf69c0fe46
commit 3987fa5281
10 changed files with 378 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files
user/themes/le_style_de_lours_modif/css-compiled/theme.css
+9 -5
View File
File diff suppressed because one or more lines are too long
user/themes/le_style_de_lours_modif/scss/theme/_animation.scss
+77 -5
View File
@@ -1,11 +1,26 @@
@-webkit-keyframes rotateOpen{
0% {-webkit-transform: rotate(-15deg);transform: rotate(-15deg);}
100% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}
@keyframes rotateOpen{
0% {transform: rotate(-15deg);}
100% {transform: rotate(0deg);}
0% {-webkit-transform: rotate(-15deg);transform: rotate(-15deg);}
100% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}
@-webkit-keyframes rotateClose{
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg);}
100% {-webkit-transform: rotate(-15deg);transform: rotate(-15deg);}
}
@keyframes rotateClose{
0% { transform: rotate(0deg);}
100% {transform: rotate(-15deg);}
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg);}
100% {-webkit-transform: rotate(-15deg);transform: rotate(-15deg);}
}
@-webkit-keyframes translateOpen{
0%{margin-top: 0px;}
100%{margin-top: -155px;}
}
@keyframes translateOpen{
@@ -13,39 +28,84 @@
100%{margin-top: -155px;}
}
@-webkit-keyframes translateClose{
0%{margin-top: -155px;}
100%{margin-top: 0px;}
}
@keyframes translateClose{
0%{margin-top: -155px;}
100%{margin-top: 0px;}
}
@-webkit-keyframes translateOpensvg{
0%{margin-top: 50px;}
100%{margin-top: 180px;}
}
@keyframes translateOpensvg{
0%{margin-top: 50px;}
100%{margin-top: 180px;}
}
@-webkit-keyframes translateClosesvg{
0%{margin-top: 180px;}
100%{margin-top: 50px;}
}
@keyframes translateClosesvg{
0%{margin-top: 180px;}
100%{margin-top: 50px;}
}
@keyframes visible{
@-webkit-keyframes visible{
0%{
opacity: 0;
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
100%{
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}
@keyframes visible{
0%{
opacity: 0;
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
100%{
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}
@-webkit-keyframes hidden{
0%{
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100%{
opacity: 0;
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
}
@keyframes hidden{
0%{
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100%{
opacity: 0;
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
}
@@ -53,30 +113,42 @@
.why_lsdo{
&.open{
h3{
-webkit-animation: rotateOpen 1s, translateOpen 1s;
animation: rotateOpen 1s, translateOpen 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
section{
-webkit-animation: visible 1s;
animation: visible 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
svg{
-webkit-animation: rotateOpen 1s, translateOpensvg 1s;
animation: rotateOpen 1s, translateOpensvg 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
}
&.close{
h3{
-webkit-animation: rotateClose 1s, translateClose 1s;
animation: rotateClose 1s, translateClose 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
section{
-webkit-animation: hidden 1s;
animation: hidden 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
svg{
-webkit-animation: rotateClose 1s, translateClosesvg 1s;
animation: rotateClose 1s, translateClosesvg 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
}
user/themes/le_style_de_lours_modif/scss/theme/_carousel.scss
+3
View File
@@ -1,4 +1,6 @@
.owl-carousel{
display: -webkit-box!important;
display: -ms-flexbox!important;
display: flex!important;
margin: 0px 50px 0 50px;
width: auto!important;
@@ -26,6 +28,7 @@
position: absolute;
width: 100%;
top:35%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
button{
width: 35px;
user/themes/le_style_de_lours_modif/scss/theme/_footer.scss
+6
View File
@@ -2,7 +2,11 @@ footer{
margin: 0 50px 0px 50px;
padding-bottom: 20px;
ul{
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
width: 100%;
li{
@@ -22,6 +26,8 @@ footer{
bottom: 0;
width: 100%;
left: 0;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
& > div {
width: 55%;
user/themes/le_style_de_lours_modif/scss/theme/_header.scss
+20
View File
@@ -3,6 +3,8 @@
top: 0;
width: 100%;
left: 0;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
& > div {
width: 55%;
@@ -51,6 +53,7 @@ header{
}
}
.title{
-webkit-transition: background 1s;
transition: background 1s;
background: none;
z-index: 998;
@@ -74,8 +77,12 @@ header{
margin-top: 0px;
white-space:nowrap;
z-index: 1;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
width: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
&::after{
right: 0;
@@ -97,14 +104,20 @@ header{
}
&.Hc{
background: white;
-webkit-transition: background 1s;
transition: background 1s;
}
}
.logo{
margin: 150px 0 50px 0;
width: 100%;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
& > div{
width: calc(100% / 3);
@@ -131,7 +144,12 @@ header{
}
}
.why_lsdo{
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
position: relative;
h3{
@@ -139,6 +157,7 @@ header{
position: absolute;
cursor: pointer;
margin: 0;
-webkit-transform: rotate(-15deg) translateY(0px);
transform: rotate(-15deg) translateY(0px);
}
section{
@@ -159,6 +178,7 @@ header{
width: 100px;
height: 20px;
position: absolute;
-webkit-transform: rotate(-15deg) translateY(50px);
transform: rotate(-15deg) translateY(50px);
}
}
user/themes/le_style_de_lours_modif/scss/theme/_media-quieries.scss
+16
View File
@@ -61,6 +61,9 @@
}
}
.logo{
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
& > div{
width: 100%;
@@ -83,7 +86,12 @@
#start{
.section{
.sous-section{
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
.blocks{
width: 90%;
@@ -109,6 +117,8 @@
#contact{
.blocks{
&:nth-of-type(1){
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
p{
text-align: center!important;
@@ -116,6 +126,8 @@
}
&:nth-of-type(2){
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
.content{
p{
@@ -229,6 +241,8 @@
}
#clients{
.images{
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
img{
margin:10px 10px;
@@ -273,6 +287,8 @@
white-space: normal;
}
ul{
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
li{
margin-left: 0;
user/themes/le_style_de_lours_modif/scss/theme/_mixins.scss
+11
View File
@@ -1,8 +1,12 @@
@mixin filet{
width: 100%;
text-align: center;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
width: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
&::after{
right: 0;
@@ -25,8 +29,12 @@
@mixin filet-b{
width: 100%;
text-align: center;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
width: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
&::after{
right: 0;
@@ -49,6 +57,7 @@
@mixin triangle{
position: absolute;
z-index: 1;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
width: 0;
height: 0;
@@ -61,6 +70,7 @@
}
@mixin rotateH{
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
position: absolute;
top: -8px;
@@ -78,5 +88,6 @@
border-right-color: transparent;
border-bottom-color: transparent;
position: absolute;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
user/themes/le_style_de_lours_modif/scss/theme/_reset.scss
+1
View File
@@ -1,4 +1,5 @@
*{
-webkit-box-sizing : border-box;
box-sizing : border-box;
}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
user/themes/le_style_de_lours_modif/scss/theme/_start.scss
+45
View File
@@ -32,8 +32,13 @@ body {
.sous-section {
width: 100%;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
h3 {
@include filet;
@@ -74,9 +79,18 @@ body {
overflow: hidden;
position: relative;
.txt {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
position: absolute;
width: 100%;
@@ -84,8 +98,12 @@ body {
top: 0%;
left: 0;
background: transparent;
-webkit-transform: scale(0.95);
transform: scale(0.95);
-webkit-transition: background 0.5s ease, -webkit-transform 0.5s ease;
transition: background 0.5s ease, -webkit-transform 0.5s ease;
transition: transform 0.5s ease, background 0.5s ease;
transition: transform 0.5s ease, background 0.5s ease, -webkit-transform 0.5s ease;
.content{
padding: 20px;
}
@@ -104,7 +122,11 @@ body {
&:hover {
.txt {
-webkit-transition: background 0.5s ease, -webkit-transform 0.5s ease;
transition: background 0.5s ease, -webkit-transform 0.5s ease;
transition: transform 0.5s ease, background 0.5s ease;
transition: transform 0.5s ease, background 0.5s ease, -webkit-transform 0.5s ease;
-webkit-transform: scale(1);
transform: scale(1);
background: $blue;
p, ul, li, a{
@@ -123,8 +145,13 @@ body {
.no-gal {
.section_n2 {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
}
}
@@ -156,9 +183,16 @@ body {
}
#clients{
.images {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
img {
width: 15%;
@@ -184,16 +218,27 @@ body {
#contact {
background: transparent!important;
.blocks{
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
&:nth-of-type(1){
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
p{
text-align: right!important;
}
}
&:nth-of-type(2){
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.title{