Add styles for small screens

This commit is contained in:
oriol carbonell pujolàs 2024-04-08 09:19:52 +02:00
parent 4363073682
commit 64be350677
1 changed files with 58 additions and 5 deletions

View File

@ -10325,7 +10325,6 @@ div[x-data="snackbar"] div[role="alert"].enter.end, div[x-data="snackbar"] div[r
margin: 0; margin: 0;
justify-content: space-around; justify-content: space-around;
} }
}
.web nav ul li { .web nav ul li {
padding: 6rem 0; padding: 6rem 0;
@ -10388,7 +10387,7 @@ div[x-data="snackbar"] div[role="alert"].enter.end, div[x-data="snackbar"] div[r
padding: 5rem 0 0 0; padding: 5rem 0 0 0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: flex-start;
} }
.web nav ul { .web nav ul {
@ -10494,7 +10493,6 @@ grid-row-gap: 0px;
justify-content: start; justify-content: start;
padding: 1rem; padding: 1rem;
border-bottom: 1px solid var(--numerus--color--black); border-bottom: 1px solid var(--numerus--color--black);
>>>>>>> Stashed changes
} }
.mondrian3 { .mondrian3 {
grid-area: 2 / 1 / 3 / 2; grid-area: 2 / 1 / 3 / 2;
@ -10631,7 +10629,18 @@ margin: 5rem 0;
width: 100%; width: 100%;
font-size: calc(16px + 1vw); font-size: calc(16px + 1vw);
color: var(--numerus--color--black); color: var(--numerus--color--black);
display: flex;
gap: 2.5rem;
} }
.download a {
text-decoration: none;
}
.download svg {
width: 30px;
}
.deco_2 { .deco_2 {
grid-area: 4 / 5 / 5 / 6; grid-area: 4 / 5 / 5 / 6;
background: white; background: white;
@ -10673,3 +10682,47 @@ margin: 5rem 0;
.price_cta p { .price_cta p {
margin: 2rem 0; margin: 2rem 0;
} }
/* home mobile */
@media screen and (max-width: 600px) {
.mondrian {
display: flex;
flex-direction: column;
}
.mondrian-element.mondrian1, .mondrian-element.mondrian3, .mondrian-element.mondrian5, .mondrian-element.mondrian6, .mondrian-element.mondrian7, .mondrian-element.mondrian8, .mondrian-element.mondrian9, .mondrian-element.mondrian11, .mondrian-element.mondrian12, .mondrian-element.mondrian13, .mondrian-element.mondrian15 {
display: none;
}
.description {
display: flex;
flex-direction: column;
gap: 30px;
margin-top: 60px;
}
.open {
display: flex;
flex-direction: column;
}
.price {
display: flex;
flex-direction: column;
gap: 30px;
margin: 60px 0;
border-top: 1px solid;
padding-top: 30px;
}
footer {
flex-direction: column;
gap: 30px;
}
footer nav ul {
padding-top: 30px !important;
}
}