React-Group/interstellar_ai
1
1
Fork 2
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

The css is working again (The responsive will be optimized on a later date)

Browse source
This commit is contained in:
sageTheDM 2024-09-23 16:53:29 +02:00
parent aaedab54cb
commit 637cf60a9b
10 changed files with 246 additions and 161 deletions
Download patch file Download diff file Expand all files Collapse all files

32
app/styles/Login.css
View file

@ -1,3 +1,13 @@
/* Container for the login layout */
.login-container {
display: grid;
grid-template-columns: 1fr 3fr; /* 1fr for sidebar, 3fr for main content */
grid-auto-flow: column;
overflow-x: hidden;
height: 100%; /* Ensure it takes full height */
}
/* Button for login action */
.login-button {
position: absolute;
top: 5px;
@ -43,6 +53,7 @@
width: 300px;
text-align: center;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
position: relative; /* For positioning the close button */
}
/* Input styles */
@ -61,20 +72,28 @@
outline: none; /* Remove default outline */
}
/* Close button */
/* Close button styles */
.close-popup {
background: var(--close-button-color); /* Use variable for close button color */
color: var(--text-color);
color: white; /* Use white for text color */
border: none;
border-radius: 5px;
padding: 5px 10px;
cursor: pointer;
margin-top: 20px;
position: absolute; /* Position the button absolutely */
top: 10px; /* Distance from the top */
right: 10px; /* Distance from the right */
transition: background 0.3s;
}
.close-popup:hover {
background: darkred; /* Optional hover effect */
}
/* Log In button styles */
.log-into-account {
background: var(--login-button-color); /* Use variable for login button color */
color: var(--text-color);
background: green; /* Use variable for login button color */
color: white;
border: none;
border-radius: 5px;
padding: 5px 10px;
@ -82,7 +101,7 @@
margin-top: 20px;
}
/* Footer section */
/* Footer section for popups */
.popup-footer {
margin-top: 15px;
}
@ -110,6 +129,7 @@
text-decoration: underline;
}
/* Paragraph styles within popup */
.popup-content p {
color: var(--popup-text-color); /* Use variable for paragraph text color */
margin: 10px;