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

start of lazy loading

Browse source
This commit is contained in:
luisa.bellitto 2025-06-19 09:48:24 +02:00 • committed by Rudi Regentonne
parent 55efde580c
commit 2aeea4033a
12 changed files with 68 additions and 93 deletions
Download patch file Download diff file Expand all files Collapse all files

109
code/frontend/src/pages/profile.css Normal file
View file

@ -0,0 +1,109 @@
.profile-display {
padding-top: var(--Header-hight);
flex-direction: column;
}
.user-info {
display: flex;
flex-direction: column;
border-radius: 1rem;
background-color: hsla(244, 70%, 13%, 0.71);
backdrop-filter: blur(8px);
margin-top: calc(var(--Header-height) + 1rem);
padding-left: 1rem;
padding-right: 1rem;
}
.user {
display: flex;
width: fit-content;
align-items: center;
gap: 20px;
margin: 2rem;
border-radius: 1rem;
}
.numeral-data {
display: flex;
flex-direction: row;
font-size: 18px;
font-weight: 500;
color: var(--Rotkehlchen-gray);
border-radius: 1rem;
}
.data {
display: flex;
flex-direction: column;
margin: 1rem;
}
.profile-avatar {
width: 40px;
height: 40px;
background-color: aqua;
}
.profile-username {
font-weight: 700;
color: var(--Rotkehlchen-orange-default);
}
.button {
margin-bottom: 0.5rem;
}
.divider {
border-color: var(--Rotkehlchen-orange-default);
}
@media screen and (min-width: 768px) {
.profile-display {
flex-direction: row;
justify-content: space-around;
align-items: baseline;
padding-top: 1rem;
}
.user-info {
display: flex;
flex-direction: column;
margin-left: 2rem;
border-radius: 1rem;
background-color: hsla(244, 70%, 13%, 0.71);
align-self: top;
padding-bottom: 1rem;
}
.user {
width: fit-content;
padding-left: 1rem;
padding-right: 3rem;
}
.numeral-data {
display: flex;
flex-direction: column;
margin-top: 2rem;
font-weight: 700;
font-size: 2rem;
}
.data-label {
padding-top: 0.5rem;
font-size: 1.5rem;
font-weight: 500;
}
.data {
display: flex;
flex-direction: column;
margin: 1rem;
}
.profile-avatar {
width: 5rem;
height: 5rem;
background-color: aqua;
}
}