css mobile

This commit is contained in:
2023-12-01 14:06:48 +01:00
parent 40f6d0d51b
commit 11984c78d9
7 changed files with 92 additions and 6 deletions
+41 -3
View File
@@ -152,6 +152,9 @@
@media (max-width: 891px) {
.layout-content {
width: 90%; } }
@media (max-width: 500px) {
.layout-content {
padding-top: 0; } }
aside {
width: 20%;
@@ -163,12 +166,19 @@ aside {
aside {
margin-left: 5%;
margin-top: 9rem; } }
@media (max-width: 500px) {
aside {
width: 80%;
margin-top: 3rem; } }
main {
width: 100%;
display: flex;
flex-direction: row;
position: relative; }
@media (max-width: 500px) {
main {
flex-direction: column; } }
.main-content {
margin-top: 7rem; }
@@ -236,6 +246,10 @@ header {
header .region-header #block-reha-logoministere {
padding-left: 80px;
padding-top: 20px; } }
@media (max-width: 500px) {
header .region-header #block-reha-logoministere {
padding-left: 30px;
padding-top: 20px; } }
header .region-header #block-reha-logoreha {
display: none;
grid-column: 2;
@@ -285,9 +299,9 @@ header {
height: fit-content; } }
@media (max-width: 500px) {
header .region-header #block-reha-connexionutilisateur .connexion .connexion-full {
top: 15px;
right: -150px;
width: 100vw;
top: 55px;
right: -90px;
width: 400px;
height: fit-content; } }
header .region-header #block-reha-connexionutilisateur .connexion .connexion-full .titre {
width: 100%;
@@ -378,6 +392,9 @@ header {
padding-left: 0;
padding-top: 1rem;
height: fit-content; } }
@media (max-width: 500px) {
header .region-header #block-reha-config-pages .contacts .contacts-full {
width: -moz-available; } }
header .region-header #block-reha-config-pages .contacts .contacts-full .titre {
padding-left: 3rem; }
@media (max-width: 500px) {
@@ -464,6 +481,11 @@ header {
text-transform: lowercase;
display: inline-flex;
font-size: 1rem; }
@media (max-width: 891px) {
.bouton h2 {
font-size: 0rem;
color: white;
padding-right: 0 !important; } }
.titre {
display: inline-flex;
@@ -591,9 +613,15 @@ label {
input {
height: 2rem;
width: 50%; }
@media (max-width: 500px) {
input {
width: 90%; } }
.description {
width: 50%; }
@media (max-width: 500px) {
.description {
width: 90%; } }
.form-submit {
height: 4rem !important;
@@ -685,6 +713,9 @@ input {
grid-column: 1 /span 2;
grid-row: 1;
margin-bottom: 2rem; }
@media (max-width: 500px) {
.home-page-layout-content .layout--onecol .block-region-content .block-views-blockhome-block-1 img {
width: -moz-available; } }
.home-page-layout-content .layout--onecol .block-region-content .block-block-content5ae07b35-3c0b-48f5-b51b-f0f0e4c1765f {
grid-column: 1;
grid-row: 2 /span 2;
@@ -777,6 +808,9 @@ input {
.user--register h1 {
font-size: 3rem !important;
font-weight: 600; }
@media (max-width: 500px) {
.user--register h1 {
font-size: 2.5rem !important; } }
.user--register .form-item {
margin-bottom: 2rem; }
@@ -804,6 +838,10 @@ input {
width: 70%;
margin-left: 2rem; } }
@media (max-width: 500px) {
.mes-operations {
width: 90%; } }
.mes-operations .views-row {
width: 80%;
padding-bottom: 1rem;
@@ -37,6 +37,10 @@ $width-menu-slidedown : 550px;
@media(max-width: 891px){
width: 90%;
}
@media (max-width:500px) {
padding-top: 0;
}
}
@@ -50,12 +54,19 @@ aside{
margin-left: 5%;
margin-top: 9rem;
}
@media (max-width:500px) {
width: 80%;
margin-top: 3rem;
}
}
main{
width: 100%;
display: flex;
flex-direction: row;
position: relative;
@media (max-width:500px) {
flex-direction: column;
}
}
@@ -4,6 +4,10 @@
h1{
font-size: 3rem !important;
font-weight: 600;
@media (max-width:500px) {
font-size: 2.5rem !important;
}
}
.form-item{
@@ -51,6 +51,12 @@
grid-column: 1 /span 2;
grid-row: 1;
margin-bottom: 2rem;
@media(max-width: 500px){
img{
width: -moz-available;
}
}
}
@@ -12,6 +12,9 @@
width: 70%;
margin-left: 2rem;
}
@media (max-width:500px) {
width: 90%;
}
.views-row{
width: 80%;
padding-bottom: 1rem;
@@ -8,9 +8,16 @@ label{
input{
height: 2rem;
width: 50%;
@media (max-width:500px) {
width: 90%;
}
}
.description{
width: 50%;
@media (max-width:500px) {
width: 90%;
}
}
.form-submit{
@@ -43,6 +43,11 @@ header{
padding-left: 80px;
padding-top: 20px;
}
@media (max-width:500px) {
// width: 10%;
padding-left: 30px;
padding-top: 20px;
}
}
#block-reha-logoreha{
@@ -116,11 +121,12 @@ header{
// height: fit-content;
// }
@media (max-width:500px) {
top: 15px;
right: -150px;
width: 100vw;
top: 55px;
right: -90px;
width: 400px;
height: fit-content;
}
.titre{
width: 100%;
position: relative;
@@ -242,6 +248,12 @@ header{
padding-top: 1rem;
height: fit-content;
}
@media (max-width:500px) {
width: -moz-available;
}
.titre{
@@ -351,6 +363,11 @@ header{
text-transform: lowercase;
display: inline-flex;
font-size: 1rem;
@media (max-width:891px) {
font-size: 0rem;
color: white;
padding-right: 0 !important;
}
}
}