mirrors/VogelSocialMedia
1
0
Fork 0
mirror of https://github.com/bubblecup-12/VogelSocialMedia.git synced 2025-07-16 09:39:54 +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

146
code/frontend/src/profile.css
View file

@ -1,146 +0,0 @@
.profile-display {
display: flex;
flex-direction: column;
height: 100vh; /* Full viewport height */
width: 100vw; /* Full viewport width */
position: absolute;
background: var(
--gradient-blue-backround-mobile,
linear-gradient(
270deg,
rgba(20, 15, 86, 0.27) 0%,
rgba(20, 15, 86, 0.58) 24%,
rgba(20, 15, 86, 0.74) 43%,
rgba(17, 13, 71, 0.82) 56%,
rgba(13, 10, 56, 0.9) 68%
),
url("../public/assets/images/BirdsSky.jpg") lightgray 50% / cover no-repeat
);
align-items: center;
background-attachment: fixed;
padding-top: var(--Header-hight);
z-index: -1;
}
.user-info {
display: flex;
flex-direction: column;
border-radius: 1rem;
background-color: hsla(244, 70%, 13%, 0.71);
backdrop-filter: blur(8px);
margin-top: 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-default);
border-radius: 1rem;
}
.data {
display: flex;
flex-direction: column;
margin: 1rem;
}
.profile-avatar {
width: 40px;
height: 40px;
background-color: aqua;
}
.profile-username {
font-size: 24px;
font-weight: 700;
color: var(--Rotkehlchen-orange-default);
}
.edit-profile {
color: var(--Rotkehlchen-orange-default);
font-size: 25px;
}
.bio {
display: flex;
align-content: start;
padding: 2px;
border: 1px solid var(--Rotkehlchen-brown-light);
color: aliceblue;
}
.divider {
border-color: var(--Rotkehlchen-brown-light);
}
@media screen and (min-width: 768px) {
.profile-display {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: baseline;
}
.user-info {
display: flex;
flex-direction: column;
margin-left: 2rem;
border-radius: 1rem;
background-color: hsla(244, 70%, 13%, 0.71);
align-self: top;
}
.button {
margin-bottom: 0.5rem;
}
.user {
width: fit-content;
padding-left: 1rem;
padding-right: 3rem;
}
.numeral-data {
display: flex;
flex-direction: column;
margin-top: 2rem;
font-size: 26px;
font-weight: 750;
}
.data-label {
font-weight: 500;
}
.data {
display: flex;
flex-direction: column;
margin: 1rem;
}
.profile-username {
font-size: 24px;
font-weight: 700;
}
.profile-avatar {
width: 5rem;
height: 5rem;
background-color: aqua;
}
.edit-profile {
font-size: 35px;
}
}