Chore: resize carrousel on small screens

This commit is contained in:
Ward Truyen 2024-11-21 13:58:04 +01:00
parent 36ba53eb2e
commit 0c6dbbc544

View File

@ -17,7 +17,7 @@ body {
margin: 0.5em;
}
.card{
.card {
padding: 10px;
border: 1px solid darkblue;
background-color: #ddddddcc;
@ -27,7 +27,7 @@ body {
display: inline-block;
}
.card>h1{
.card>h1 {
font-size: 2em;
}
@ -35,7 +35,7 @@ html {
background-image: linear-gradient(-30deg, #C0E0FF6F 70%, #FFE0C04F);
}
.flex{
.flex {
display: flex;
flex-direction: column;
}
@ -67,7 +67,7 @@ html {
padding: 10px;
/* border: 1px solid darkblue; */
/* background-color: #80808040; */
background-image: linear-gradient(#00000000, #d0e08030, #d0e08030, #00000000 );
background-image: linear-gradient(#00000000, #d0e08030, #d0e08030, #00000000);
/* box-shadow: 3px 3px 3px #30303090; */
/* border-radius: 4px; */
margin-top: 1em;
@ -103,7 +103,7 @@ html {
text-shadow: 0px 0px 4px white, 2px 2px 6px;
}
.content>p{
.content>p {
margin-left: 1em;
}
@ -111,13 +111,15 @@ html {
margin-left: 0.2em;
}
.content>h2{
.content>h2 {
margin-top: 1.5em;
}
.content>h2 {
margin-top: 0.2em;
}
.content>h3{
.content>h3 {
margin-left: 0.8em;
margin-top: 0.5em;
margin-bottom: 0.5em;
@ -161,10 +163,15 @@ html.theme-dark {
margin: 0 auto;
}
#image-carousel{
#image-carousel {
width: 50rem;
margin: 0 auto;
/* background: #DD8888DD; */
}
@media only screen and (max-width: 600px) {
#image-carousel {
width: 25rem;
}
}
@media(orientation: portrait) {