mirrors/VogelSocialMedia
1
0
Fork 0
mirror of https://github.com/bubblecup-12/VogelSocialMedia.git synced 2025-07-06 15:18:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix width, max height

Browse source
This commit is contained in:
Niklas 2025-07-01 01:31:51 +02:00 • committed by Luisa Bellitto
parent 176e9fc904
commit 49c0f71343
1 changed files with 16 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

26
code/frontend/src/pages/about.css
View file

@ -1,11 +1,9 @@
.mainbox { .mainbox {
min-width: 360px;
max-width: 100vw; max-width: 100vw;
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.mainbox { .mainbox {
min-width: 60rem;
min-height: 60rem; min-height: 60rem;
margin-top: var(--Header-height); margin-top: var(--Header-height);
} }
@ -34,7 +32,7 @@
} }
.explain-title { .explain-title {
margin: 1vw; margin: 1vw;
width: 90vw; min-width: 90vw;
font-size: clamp(5rem, 10vw, 17vw); font-size: clamp(5rem, 10vw, 17vw);
color: var(--Rotkehlchen-orange-default); color: var(--Rotkehlchen-orange-default);
} }
@ -59,9 +57,10 @@
.intro { .intro {
box-sizing: border-box; box-sizing: border-box;
margin: 3vw; margin: 3vw;
max-width: 94vw;
} }
.block-l { .block-l {
height: clamp(19rem, 55vh, 100%); height: clamp(24rem, 60vh, 100%) !important;
} }
.block { .block {
@ -70,7 +69,7 @@
grid-template-rows: 1fr auto; grid-template-rows: 1fr auto;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
height: clamp(22rem, 45vh, 100%); height: clamp(2rem, 45vh, 100%);
margin: var(--margin-mobile); margin: var(--margin-mobile);
vertical-align: center; vertical-align: center;
margin-block-end: var(--margin-mobile); margin-block-end: var(--margin-mobile);
@ -95,12 +94,12 @@
.item { .item {
max-width: 90vw; max-width: 90vw;
max-height: 19rem;
} }
.pic { .pic {
max-width: 80vw; max-width: calc(80vw - var(--margin-mobile)) !important;
border-radius: var(--border-radius); border-radius: var(--border-radius);
box-shadow: 0px 5px 8.9px 15px rgba(115, 116, 206, 0.25); box-shadow: 0px 5px 8.9px 15px rgba(115, 116, 206, 0.25);
max-height: 19rem;
} }
.text1 { .text1 {
@ -110,9 +109,11 @@
} }
.text-start { .text-start {
text-align: start; text-align: start;
margin-right: 2vw;
} }
.text-end { .text-end {
text-align: end; text-align: end;
margin-left: 2vw;
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
@ -121,6 +122,12 @@
width: auto; width: auto;
justify-self: center; justify-self: center;
} }
.explain-title {
margin: 1vw;
min-width: 90vw;
font-size: clamp(7rem, 10vw, 17vw);
color: var(--Rotkehlchen-orange-default);
}
.about-title { .about-title {
flex-direction: row; flex-direction: row;
justify-content: start; justify-content: start;
@ -136,7 +143,6 @@
grid-template-columns: 1fr auto; grid-template-columns: 1fr auto;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
height: clamp(30vw, 45vh, 100%);
margin: 1rem; margin: 1rem;
vertical-align: center; vertical-align: center;
margin-block-end: 2rem; margin-block-end: 2rem;
@ -148,14 +154,14 @@
} }
.item { .item {
height: clamp(19rem, 30vw, 30vw); height: clamp(1rem, 30vw, 30vw);
max-height: none; max-height: none;
} }
.text1 { .text1 {
height: 100%; height: 100%;
color: white; color: white;
font-size: clamp(5rem, 8vw, 15vw); font-size: clamp(1rem, 8vw, 15vw);
display: flex; display: flex;
align-items: center; align-items: center;
} }