bachir/grav-lecampus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
grav-lecampus/user/themes/lecampus/scss/theme/_mobile.scss

920 lines
21 KiB
SCSS
Raw Normal View History

bugfix
2019-08-21 14:30:23 +02:00
@media screen and (max-width: 1450px) {
header{
&> nav{
bugfix
2019-08-21 14:40:21 +02:00
width: 90%!important;
bugfix
2019-08-21 14:30:23 +02:00
}
}
}
demande de devis fix
2019-07-13 18:17:22 +02:00
bugfix
2019-08-21 14:40:21 +02:00
@media screen and (max-width: 1080px) {
header{
&> nav{
width: 100%!important;
demande de devis fix
2019-07-13 18:02:59 +02:00
}
demande de devis fix
2019-07-13 17:47:05 +02:00
}
}
bugfix
2019-08-21 14:40:21 +02:00
@media screen and (max-width: 1024px) {
responsive
2019-05-31 23:37:11 +02:00
header nav{
position: relative;
bugfix
2019-08-21 14:41:09 +02:00
width: 90%!important;
responsive
2019-05-31 23:37:11 +02:00
.dropmenu{
background: white;
display: none;
position: absolute;
left: -6%;
top: 100px;
width: auto!important;
height: auto;
&>ul{
close salles
2019-06-05 12:59:18 +02:00
flex-direction: column!important;
responsive
2019-05-31 23:37:11 +02:00
&>li{
text-align: left;
&>ul{
margin: auto;
&>li{
text-align: left;
margin-left: 10px;
a{
font-family: $Regular;
}
}
}
&> a{
border: none;
line-height: 2rem;
}
}
}
&.active{
display: block;
}
}
.logo{
margin: auto;
}
.navTrigger {
cursor: pointer;
width: 30px;
height: 25px;
margin: auto 0;
left: 0;
top: 0;
bottom: 0;
}
.navTrigger i {
background-color: $light-blue;
border-radius: 2px;
content: '';
display: block;
width: 100%;
height: 4px;
}
.navTrigger i:nth-child(1) {
-webkit-animation: outT 0.8s backwards;
animation: outT 0.8s backwards;
-webkit-animation-direction: reverse;
animation-direction: reverse;
}
.navTrigger i:nth-child(2) {
margin: 5px 0;
-webkit-animation: outM 0.8s backwards;
animation: outM 0.8s backwards;
-webkit-animation-direction: reverse;
animation-direction: reverse;
}
.navTrigger i:nth-child(3) {
-webkit-animation: outBtm 0.8s backwards;
animation: outBtm 0.8s backwards;
-webkit-animation-direction: reverse;
animation-direction: reverse;
}
.navTrigger.active i:nth-child(1) {
-webkit-animation: inT 0.8s forwards;
animation: inT 0.8s forwards;
}
.navTrigger.active i:nth-child(2) {
-webkit-animation: inM 0.8s forwards;
animation: inM 0.8s forwards;
}
.navTrigger.active i:nth-child(3) {
-webkit-animation: inBtm 0.8s forwards;
animation: inBtm 0.8s forwards;
}
@-webkit-keyframes inM {
50% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(45deg);
}
}
@keyframes inM {
50% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
}
@-webkit-keyframes outM {
50% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(45deg);
}
}
@keyframes outM {
50% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
}
@-webkit-keyframes inT {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(9px) rotate(135deg);
}
}
@keyframes inT {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(9px) rotate(0deg);
transform: translateY(9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(9px) rotate(135deg);
transform: translateY(9px) rotate(135deg);
}
}
@-webkit-keyframes outT {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(9px) rotate(135deg);
}
}
@keyframes outT {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(9px) rotate(0deg);
transform: translateY(9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(9px) rotate(135deg);
transform: translateY(9px) rotate(135deg);
}
}
@-webkit-keyframes inBtm {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(-9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(-9px) rotate(135deg);
}
}
@keyframes inBtm {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(-9px) rotate(0deg);
transform: translateY(-9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(-9px) rotate(135deg);
transform: translateY(-9px) rotate(135deg);
}
}
@-webkit-keyframes outBtm {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(-9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(-9px) rotate(135deg);
}
}
@keyframes outBtm {
0% {
-webkit-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
}
50% {
-webkit-transform: translateY(-9px) rotate(0deg);
transform: translateY(-9px) rotate(0deg);
}
100% {
-webkit-transform: translateY(-9px) rotate(135deg);
transform: translateY(-9px) rotate(135deg);
}
}
}
bugfix
2019-08-21 14:40:21 +02:00
.gal{
.title_gal{
top: 15vw!important;
max-width: 60%!important;
}
}
#item{
.content{
// width: 80%!important;
.icones{
flex-wrap: nowrap!important;
}
}
}
#item .demander-votre-devis,
#sublog .demander-votre-devis{
width: 300px!important;
height: 110px!important;
a{
display: inline-flex!important;
}
p:nth-of-type(2){
display: none!important;
}
img{
margin-left: 20px!important;
margin-top: 0px!important;
}
}
#devis{
.txt{
width: 35%!important;
}
.demander-votre-devis{
-webkit-transform: translate(0%, -125%)!important;
transform: translate(0%, -125%)!important;
}
}
#newsletter #mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper.embedForm{
width: 50%!important;
}
}
@media screen and (max-width: 960px) {
// header nav{
// position: relative;
// width: 90%;
// .dropmenu{
// background: white;
// display: none;
// position: absolute;
// left: -6%;
// top: 100px;
// width: auto!important;
// height: auto;
// &>ul{
// flex-direction: column!important;
// &>li{
// text-align: left;
// &>ul{
// margin: auto;
// &>li{
// text-align: left;
// margin-left: 10px;
// a{
// font-family: $Regular;
// }
// }
// }
// &> a{
// border: none;
// line-height: 2rem;
// }
// }
// }
// &.active{
// display: block;
//
// }
// }
// .logo{
// margin: auto;
// }
// .navTrigger {
// cursor: pointer;
// width: 30px;
// height: 25px;
// margin: auto 0;
// left: 0;
// top: 0;
// bottom: 0;
// }
// .navTrigger i {
// background-color: $light-blue;
// border-radius: 2px;
// content: '';
// display: block;
// width: 100%;
// height: 4px;
// }
// .navTrigger i:nth-child(1) {
// -webkit-animation: outT 0.8s backwards;
// animation: outT 0.8s backwards;
// -webkit-animation-direction: reverse;
// animation-direction: reverse;
// }
// .navTrigger i:nth-child(2) {
// margin: 5px 0;
// -webkit-animation: outM 0.8s backwards;
// animation: outM 0.8s backwards;
// -webkit-animation-direction: reverse;
// animation-direction: reverse;
// }
// .navTrigger i:nth-child(3) {
// -webkit-animation: outBtm 0.8s backwards;
// animation: outBtm 0.8s backwards;
// -webkit-animation-direction: reverse;
// animation-direction: reverse;
// }
// .navTrigger.active i:nth-child(1) {
// -webkit-animation: inT 0.8s forwards;
// animation: inT 0.8s forwards;
// }
// .navTrigger.active i:nth-child(2) {
// -webkit-animation: inM 0.8s forwards;
// animation: inM 0.8s forwards;
// }
// .navTrigger.active i:nth-child(3) {
// -webkit-animation: inBtm 0.8s forwards;
// animation: inBtm 0.8s forwards;
// }
// @-webkit-keyframes inM {
// 50% {
// -webkit-transform: rotate(0deg);
// }
// 100% {
// -webkit-transform: rotate(45deg);
// }
// }
// @keyframes inM {
// 50% {
// -webkit-transform: rotate(0deg);
// transform: rotate(0deg);
// }
// 100% {
// -webkit-transform: rotate(45deg);
// transform: rotate(45deg);
// }
// }
// @-webkit-keyframes outM {
// 50% {
// -webkit-transform: rotate(0deg);
// }
// 100% {
// -webkit-transform: rotate(45deg);
// }
// }
// @keyframes outM {
// 50% {
// -webkit-transform: rotate(0deg);
// transform: rotate(0deg);
// }
// 100% {
// -webkit-transform: rotate(45deg);
// transform: rotate(45deg);
// }
// }
// @-webkit-keyframes inT {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(9px) rotate(135deg);
// }
// }
// @keyframes inT {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(9px) rotate(0deg);
// transform: translateY(9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(9px) rotate(135deg);
// transform: translateY(9px) rotate(135deg);
// }
// }
// @-webkit-keyframes outT {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(9px) rotate(135deg);
// }
// }
// @keyframes outT {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(9px) rotate(0deg);
// transform: translateY(9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(9px) rotate(135deg);
// transform: translateY(9px) rotate(135deg);
// }
// }
// @-webkit-keyframes inBtm {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(-9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(-9px) rotate(135deg);
// }
// }
// @keyframes inBtm {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(-9px) rotate(0deg);
// transform: translateY(-9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(-9px) rotate(135deg);
// transform: translateY(-9px) rotate(135deg);
// }
// }
// @-webkit-keyframes outBtm {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(-9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(-9px) rotate(135deg);
// }
// }
// @keyframes outBtm {
// 0% {
// -webkit-transform: translateY(0px) rotate(0deg);
// transform: translateY(0px) rotate(0deg);
// }
// 50% {
// -webkit-transform: translateY(-9px) rotate(0deg);
// transform: translateY(-9px) rotate(0deg);
// }
// 100% {
// -webkit-transform: translateY(-9px) rotate(135deg);
// transform: translateY(-9px) rotate(135deg);
// }
// }
// }
responsive
2019-05-31 23:37:11 +02:00
.gal{
.title_gal{
max-width: 80%!important;
top: 15vw!important;
}
.content_gal{
width: 2%!important;
}
}
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
.bandeau{
.img{
width: 100%!important;
}
.title_gal{
top:25vw!important;
right: 5%!important;
max-width: 70%!important;
}
}
responsive
2019-05-31 23:37:11 +02:00
.entete .entete_c{
width: 95%!important;
margin: 30px auto!important;
}
.content{
width: 80%!important;
}
.sidebar{
position: relative!important;
width: 350px!important;
margin: 0 auto!important;
}
#devis{
.title{
width: 100%!important;
height: auto!important;
-webkit-transform: translateX(0px)!important;
transform: translateX(0px)!important;
border-radius: 0px!important;
h4{
font-size: 1.3rem!important;
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
margin: 15px auto 0 auto!important;
responsive
2019-05-31 23:37:11 +02:00
-webkit-transform: translateY(0%)!important;
transform: translateY(0%)!important;
}
}
.txt{
width: 100%!important;
height: auto!important;
background: $red!important;
margin: auto!important;
p{
color: white!important;
padding: 15px 55px !important;
strong{
font-size: 1rem!important;
}
}
}
.img{
width: auto!important;
bug devis
2019-08-21 13:23:47 +02:00
height: auto!important;
min-height: 200px!important;
responsive
2019-05-31 23:37:11 +02:00
}
.demander-votre-devis{
demande de devis fix
2019-07-13 17:47:05 +02:00
// -webkit-transform: translate(0, -50%)!important;
// transform: translate(0, -50%)!important;
fixe gal et devis
2019-06-24 19:53:10 +02:00
responsive
2019-05-31 23:37:11 +02:00
}
}
#devis.item .title, #devis.sublog .title{
border-radius: 30px!important;
}
#sublog{
.txt{
width:100%!important;
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
.content_txt{
width: 100%!important;
}
responsive
2019-05-31 23:37:11 +02:00
p{
padding: 0!important;
}
}
.content_salle{
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
width: 70%!important;
responsive
2019-05-31 23:37:11 +02:00
z-index: 2;
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
left: 50%!important;
demande de devis fix
2019-07-13 17:08:11 +02:00
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
.header-salles{
display: inline-flex;
justify-content: space-between;
img{
display: block!important;
margin: auto;
width: 20px;
height: 20px;
cursor: pointer;
}
}
responsive
2019-05-31 23:37:11 +02:00
}
.mapsalles{
bug fix agenda + salles
2019-06-09 15:17:49 +02:00
width: 100%!important;
responsive
2019-05-31 23:37:11 +02:00
}
}
ajust devis
2019-06-25 19:08:18 +02:00
#sublog .demander-votre-devis{
responsive
2019-05-31 23:37:11 +02:00
width: 300px!important;
height: 110px!important;
ajust devis
2019-06-25 19:08:18 +02:00
a{
display: inline-flex!important;
}
p:nth-of-type(2){
display: none!important;
}
img{
margin-left: 20px!important;
margin-top: 0px!important;
}
}
#item .demander-votre-devis{
width: 300px!important;
height: 110px!important;
responsive
2019-05-31 23:37:11 +02:00
a{
display: inline-flex!important;
}
p:nth-of-type(2){
display: none!important;
}
img{
margin-left: 20px!important;
margin-top: 0px!important;
}
}
.start:not(#form)#archive, .start:not(#form)#calendrier{
width: 80%!important;
}
.start:not(#form) .body-wrapper .card{
width: calc((100% / 3) - 7.5px)!important;
}
.start#form .body-wrapper form{
width: 90%!important;
}
.start#form .body-wrapper form > div.button-wrapper button{
margin-right: 5%!important;
}
.sidebar{
width: 50%!important;
padding: 20px 0;
&::before{
display: block;
width: 100vw;
height: 100%;
content: '';
modif trame
2019-06-13 17:40:44 +02:00
background-image: url(/user/themes/lecampus/images/Trame-bleu2.svg);
background-repeat: repeat;
// background-position: center;
// background-size: cover;
responsive
2019-05-31 23:37:11 +02:00
position: absolute;
top: 0;
maj
2019-06-03 15:22:10 +02:00
margin-left: -27vw;
responsive
2019-05-31 23:37:11 +02:00
z-index: -1;
}
}
.start:not(#form) .body-wrapper .event{
width: 90%!important;
}
.start:not(#form)#event .title{
width: 90%!important;
}
integre-newsleter
2019-06-13 16:19:04 +02:00
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper.embedForm{
width: 70%!important;
}
responsive
2019-05-31 23:37:11 +02:00
}
demande de devis fix
2019-07-13 17:51:58 +02:00
@media screen and (max-width: 768px) {
demande de devis fix
2019-07-13 17:51:17 +02:00
#devis{
.demander-votre-devis{
demande de devis fix
2019-07-13 17:58:27 +02:00
-webkit-transform: translate(50%, -125%)!important;
transform: translate(50%, -125%)!important;
demande de devis fix
2019-07-13 17:51:17 +02:00
}
}
demande de devis fix
2019-07-13 18:23:47 +02:00
#newsletter #mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper.embedForm{
demande de devis fix
2019-07-13 18:27:08 +02:00
width: 80%!important;
demande de devis fix
2019-07-13 18:23:47 +02:00
}
demande de devis fix
2019-07-13 17:51:17 +02:00
}
responsive
2019-05-31 23:37:11 +02:00
@media screen and (max-width: 750px) {
.start{
.demander-votre-devis{
display: none;
}
}
#item{
ajust
2019-06-05 13:04:15 +02:00
.bandeau{
ajust
2019-06-05 14:34:46 +02:00
.img{
ajust
2019-06-05 13:04:15 +02:00
width: 100%;
height: auto;
}
}
responsive
2019-05-31 23:37:11 +02:00
.body-wrapper{
.images_s{
display: none;
}
.content_s{
width: 90%!important;
p{
padding: 0!important;
}
}
.icones{
margin: 20px 0 0 0!important;
.icon{
height: auto!important;
max-width: 100%!important;
p{
padding: 0!important;
}
}
}
}
}
.content{
margin: 2rem auto!important;
width: 90%!important;
p{
padding: 40px 20px!important;
}
}
.gal .title_gal{
display: none!important;
}
.entete{
padding: 0!important;
p{
font-size: 1.1rem;
line-height: 1.5rem;
}
}
#home .content > p{
width: 100%!important;
&:not(:last-child){
strong{
font-size: 1.1rem;
}
}
}
#reco{
.item{
border: none!important;
margin: 10px 0!important;
padding-left: 0!important;
}
}
.sidebar{
width: 90%!important;;
text-align: center;
maj
2019-06-03 15:22:10 +02:00
&:before{
margin-left: -8vw;
}
responsive
2019-05-31 23:37:11 +02:00
h2{
margin: auto;
}
h3{
font-size: 1.1rem;
}
.side-all-agenda{
margin: auto;
float: none!important;
}
}
#devis{
.title, .txt{
padding: 0 5%;
p{
padding: 15px 0!important;
}
}
bug devis
2019-08-21 13:23:47 +02:00
.demander-votre-devis{
bugfix
2019-08-21 14:21:34 +02:00
transform: translate(0%,-120%)!important;
bug devis
2019-08-21 13:23:47 +02:00
}
responsive
2019-05-31 23:37:11 +02:00
}
#newsletter{
#mc_embed_signup{
border: none!important;
width: 280px!important;
padding: 0!important;
#mc_embed_signup_scroll{
close salles
2019-06-05 12:59:18 +02:00
flex-direction: column;
responsive
2019-05-31 23:37:11 +02:00
input{
width: 280px!important;
}
}
#form{
width: auto;
}
label{
width: 280px!important;
border: 2px solid white;
border-radius: 20px;
margin-bottom: 10px;
}
& > input{
margin-top: 10px;
}
.clear{
input{
margin: 10px 0 0 0!important;
}
}
}
}
#footer .block{
close salles
2019-06-05 12:59:18 +02:00
flex-direction: column;
responsive
2019-05-31 23:37:11 +02:00
p{
margin-bottom: 10px;
text-align: center;
border: none!important;
&:nth-of-type(1){
img{
float: none;
}
}
}
}
#sublog {
close salles
2019-06-05 12:54:15 +02:00
.bandeau{
close salles
2019-06-05 12:59:18 +02:00
height: auto;
ajust
2019-06-05 14:36:47 +02:00
.img{
close salles
2019-06-05 12:54:15 +02:00
width: 100%;
close salles
2019-06-05 12:59:18 +02:00
height: auto;
close salles
2019-06-05 12:54:15 +02:00
}
}
.title_gal{
display: none;
}
responsive
2019-05-31 23:37:11 +02:00
.content_salle{
width: 90%!important;
close salles
2019-06-05 12:59:18 +02:00
top: 200px!important;
responsive
2019-05-31 23:37:11 +02:00
p{
padding: 0px 10px!important;
}
}
.mapsalles{
width: 100%!important;
}
} .start:not(#form)#archive, .start:not(#form)#calendrier{
width: 90%!important;
.cat {
height: auto!important;
.btn-group{
&:nth-child(1){
width: 75%;
}
label{
margin-bottom: 10px;
}
}
}
}
.start:not(#form) .body-wrapper .card{
width: 100%!important;
}
.start:not(#form) .body-wrapper .event .card-content{
close salles
2019-06-05 12:59:18 +02:00
flex-direction: column;
responsive
2019-05-31 23:37:11 +02:00
.reso{
width: 100%!important;
display: flex;
close salles
2019-06-05 12:59:18 +02:00
justify-content: space-around;
responsive
2019-05-31 23:37:11 +02:00
}
.txt{
width: 100%!important;
}
}
#default{
.header-wrapper{
width: 100%!important;
text-align: center;
.title{
width: 90%!important;
}
}
}
integre-newsleter
2019-06-13 16:19:04 +02:00
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper.embedForm{
width: 90%!important;
}
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody.ml-form-embedBodyHorizontal{
display: block!important;
}
modif trame
2019-06-13 17:40:44 +02:00
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedContent label{
integre-newsleter
2019-06-13 16:19:04 +02:00
white-space: normal!important;
}
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedContent{
border: 1px solid white!important;
border-radius: 30px;
margin-bottom: 20px;
}
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody.ml-form-embedBodyHorizontal {
border:none!important;
border-radius: 0px!important;
}
#mlb2-985974.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-horizontalRow input{
text-align: center;
}
responsive
2019-05-31 23:37:11 +02:00
}
Reference in New Issue Copy Permalink