eta357/LibreTunes-Nix-Test
1
0
Fork 0
Code Pull Requests Actions Activity

Changed login and signup color themes

Browse Source
This commit is contained in:
Danny Zou 2024-02-27 16:41:54 -05:00
parent 1c4ce06064
commit a47e6fedc3
5 changed files with 27 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/login.rs
View File

@ -40,7 +40,7 @@ pub fn Login() -> impl IntoView {
};
view! {
<div class="page-container">
<div class="auth-page-container">
<div class="login-container">
<a class="return" href="/"><Icon icon=Icon::from(IoReturnUpBackSharp) /></a>
<div class="header">

2
src/pages/signup.rs
View File

@ -47,7 +47,7 @@ pub fn Signup() -> impl IntoView {
};
view! {
<div class="page-container">
<div class="auth-page-container">
<div class="signup-container">
<a class="return" href="/"><Icon icon=Icon::from(IoReturnUpBackSharp) /></a>
<div class="header">

14
style/login.scss
View File

@ -19,7 +19,7 @@
.login-container .header h1 {
margin-top: 3rem;
font-size: 2.5rem;
color: #2c1308;
color: $accent-color;
}
.login-container .login-form {
width: 75%;
@ -55,15 +55,15 @@
left: 0;
padding: 15px 0px 10px;
pointer-events: none;
color: #907163;
color: black;
font-size: 1.19em;
letter-spacing: 0.5px;
transition: 0.5s;
}
.login-form .input-box input:valid ~ span,
.login-form .input-box input:focus ~ span {
color: #2c1308;
font-size: 1rem;
color: rgb(94, 93, 93);
font-size: 0.9rem;
transform: translateY(-30px);
font-weight: 400;
}
@ -73,7 +73,7 @@
bottom: 0;
width: 100%;
height: 2px;
background: #907163;
background: $auth-inputs;
border-radius: 4px;
overflow: hidden;
transition: 0.5s;
@ -106,7 +106,7 @@
cursor: pointer;
font-size: 1.1rem;
font-weight: 600;
background-color: #582b17;
background-color: $accent-color;
}
.login-form .go-to-signup {
color: #8f8f8f;
@ -118,7 +118,7 @@
text-decoration: underline;
}
.login-form .go-to-signup a:hover {
color: #fff;
color: black;
transition: all 0.2s;
}
.login-container .return {

23
style/signup.scss
View File

@ -1,5 +1,14 @@
@import "theme.scss";
.auth-page-container {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
background-color: black;
}
.signup-container {
display: flex;
flex-direction: column;
@ -18,7 +27,7 @@
.signup-container .header h1 {
margin-top: 3rem;
font-size: 2.5rem;
color: #2c1308;
color: $accent-color;
}
.signup-container .signup-form {
width: 80%;
@ -54,15 +63,15 @@
left: 0;
padding: 15px 0px 10px;
pointer-events: none;
color: #907163;
color: black;
font-size: 1.19em;
letter-spacing: 0.5px;
transition: 0.5s;
}
.signup-form .input-box input:valid ~ span,
.signup-form .input-box input:focus ~ span {
color: #a8a2b0;
font-size: 1rem;
color: rgb(94, 93, 93);
font-size: 0.9rem;
transform: translateY(-30px);
font-weight: 400;
}
@ -90,11 +99,11 @@
height: 45px;
border: none;
border-radius: 8px;
color: rgb(210, 207, 207);
color: white;
cursor: pointer;
font-size: 1.1rem;
font-weight: 600;
background-color: #582b17;
background-color: $accent-color;
}
.signup-form .go-to-login {
color: #8f8f8f;
@ -106,7 +115,7 @@
text-decoration: underline;
}
.signup-form .go-to-login a:hover {
color: #fff;
color: black;
transition: all 0.2s;
}
.signup-container .return {

4
style/theme.scss
View File

@ -7,5 +7,5 @@ $play-bar-background-color: #212121;
$play-grad-start: #0a0533;
$play-grad-end: $accent-color;
$auth-inputs: #86659e;
$auth-containers: #ccc9d1;
$auth-inputs: #796dd4;
$auth-containers: white;