etc404/thymecrunch
1
0
Fork 0
mirror of https://gitlab.com/etc404/software-engineering-project.git synced 2026-05-10 20:52:58 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

colors and formatting ready for demo

Browse Source
This commit is contained in:
kaipher7
2026-03-07 23:45:43 -07:00
parent 63f0987020
commit 5ce0af0e92
4 changed files with 133 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/css/login.css
+59 -24
View File
@@ -1,9 +1,18 @@
:root {
--dusty-red: #D43F3F;
--dusty-red-hover: #C73636;
--dark-yellow: #FFD27F;
--pale-yellow: #FFECB3;
--peach: #F5A96E;
--dark: #850000;
}
/* login.css */
body, html {
background-attachment: fixed;
height: 100%;
margin: 0;
font-family: 'Roboto', sans-serif;
background-color: var(--pale-yellow);
}
.container {
@@ -13,23 +22,25 @@ body, html {
/* Header Styles */
.top-header {
position: sticky;
top: 0;
display: flex;
align-items: center;
background-color: #1f3d57;
color: white;
justify-content: center;
background-color: var(--dusty-red);
color: var(--dark-yellow);
padding: 10px 20px;
height: 60px;
gap: 40px;
}
.top-header .logo {
.top-header .swirl {
height: 40px;
width: auto;
margin-right: 15px;
margin: 0 20px;
}
.site-name {
position: absolute;
left: 50%;
font-size: 2.5em;
font-weight: bold;
letter-spacing: 4px;
@@ -38,46 +49,51 @@ position: absolute;
/* Main Content */
.main-content {
flex: 1;
flex-grow: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
margin-top: 40px;}
/* Login Box */
.login-box {
background-color: #1f3d57;
background-color: var(--peach);
padding: 45px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
width: 300px;
color: #38a7e8;
border-radius: 20px;
width: 400px;
color: var(--dark);
}
.login-box h2 {
font-size: 50px;
text-align: center;
font-weight: bold;
font-weight: bold;
margin-bottom: 30px;
margin-top: 8px;
}
.login-box label {
font-size: 20px;
display: block;
margin-top: 10px;
width: 90%;
margin: 10px;
font-weight: bold;
}
.login-box input {
align-items: center;
width: 100%;
display: block;
width: 90%;
padding: 10px;
margin: auto;
margin-top: 5px;
border-radius: 3px;
border: 1px solid #ccc;
border-radius: 10px;
border: 2.5px solid var(--dusty-red);
background-color: var(--pale-yellow);
font-size: 20px;
box-sizing: border-box;
}
}
.login-box button {
display: block;
@@ -85,14 +101,33 @@ font-weight: bold;
width: 40%;
padding: 10px;
margin-top: 20px;
background-color: #38a7e8;
background-color: var(--dusty-red);
color: white;
font-weight: bold;
border: none;
border-radius: 4px;
border-radius: 10px;
cursor: pointer;
transition: background-color 0.1s ease;
transition: transform 0.2s ease;
}
.login-box button:hover {
background-color: #3498db;
background-color: var(--dusty-red-hover);
transform: scale(1.05);
}
/*Sign Up*/
.sign_up {
color: var(--dusty-red);
}
.sign_up a {
display: inline-block;
color: var(--dark);
text-decoration: none;
transition: transform 0.2s ease;
}
.sign_up a:hover {
transform: scale(1.03);
}