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

make background image fixed

Browse source
This commit is contained in:
luisa.bellitto 2025-06-14 16:29:01 +02:00 • committed by Luisa Bellitto
parent 796eacb802
commit 871949b567
3 changed files with 21 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

2
code/frontend/src/pages/LoginAndSignUpPage.tsx
View file

@ -8,7 +8,7 @@ function LoginAndSignUpPage() {
}; };
const [signup, setSignup] = useState(false); const [signup, setSignup] = useState(false);
return ( return (
<div className="login-display"> <div className="background">
<div className="login-login"> <div className="login-login">
<div className="login-part"> <div className="login-part">
<div className={signup ? "signup-image" : "login-image"}></div> <div className={signup ? "signup-image" : "login-image"}></div>

4
code/frontend/src/pages/loginAndSignUpPage.css
View file

@ -1,4 +1,4 @@
.login-display{ .background{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100vh; /* Full viewport height */ height: 100vh; /* Full viewport height */
@ -6,7 +6,7 @@
background: var(--gradient-blue-backround-mobile); background: var(--gradient-blue-backround-mobile);
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-attachment: fixed;
} }
.login-text{ .login-text{

21
code/frontend/src/styles/colors.css
View file

@ -1,10 +1,19 @@
:root { :root {
--Rotkehlchen-gray: #e7ecf2; --Rotkehlchen-gray: #e7ecf2;
--Rotkehlchen-brown-light: #a28d7a; --Rotkehlchen-brown-light: #a28d7a;
--Rotkehlchen-brown-middle: #7F6D6D; --Rotkehlchen-brown-middle: #7f6d6d;
--Rotkehlchen-brown-dark: #4C4141; --Rotkehlchen-brown-dark: #4c4141;
--Rotkehlchen-yellow-default: #FED640; --Rotkehlchen-yellow-default: #fed640;
--Rotkehlchen-yellow-hover: #EAC22A; --Rotkehlchen-yellow-hover: #eac22a;
--Rotkehlchen-orange-default: #e79a0e; --Rotkehlchen-orange-default: #e79a0e;
--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.90) 68%), url('../../public/assets/images/BirdsSky.jpg') lightgray 50% / cover no-repeat; --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;
}