phillip/karaoqueue
1
0
Fork 0
mirror of https://github.com/PhoenixTwoFive/karaoqueue.git synced 2025-07-04 09:11:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix CSS quirks

Browse Source
This commit is contained in:
Phillip Kühne
2023-10-04 12:49:06 +00:00
parent e7d9816010
commit 7f4625a062
1 changed files with 18 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
backend/static/css/style.css
View File

@ -4,12 +4,14 @@
--navbar-text-color: rgba(255, 255, 255, .5); --navbar-text-color: rgba(255, 255, 255, .5);
--navbar-text-color-hover: rgba(255, 255, 255, .75); --navbar-text-color-hover: rgba(255, 255, 255, .75);
--navbar-text-color-active: rgba(255, 255, 255, 1); --navbar-text-color-active: rgba(255, 255, 255, 1);
--navbar-padding: 4.5rem;
/* Common */ /* Common */
--background-color: #ffffff; --background-color: #ffffff;
--background-color-var: #f5f5f5; --background-color-var: #f5f5f5;
--text-color: #212529; --text-color: #212529;
--text-color-var: #343a40; --text-color-var: #343a40;
--text-color-light: #6c757d;
/* Modals */ /* Modals */
--modal-background-color: #ffffff; --modal-background-color: #ffffff;
@ -28,11 +30,14 @@
/* Toasts */ /* Toasts */
--toast-background-color: #ffffff; --toast-background-color: #ffffff;
--toast-text-color: #212529; --toast-text-color: #212529;
/* Footer */
--footer-height: 80px;
} }
body { body {
padding-top: 5rem; padding-top: var(--navbar-padding);
background-color: var(--background-color); background-color: var(--background-color);
} }
@ -42,21 +47,15 @@ body {
} }
.site { .site {
height: auto; min-height: calc(100vh - var(--navbar-padding) - var(--footer-height));
min-height: 100%; margin-bottom: -var(--footer-height);
}
main {
padding-bottom: 60px;
/* Höhe des Footers */
} }
.footer { .footer {
margin-top: -60px; /*margin-top: var(--footer-height);*/
width: 100%; width: 100%;
height: 60px; height: var(--footer-height);
/* Set the fixed height of the footer here */
/*line-height: 60px; /* Vertically center the text there */
background-color: var(--background-color-var); background-color: var(--background-color-var);
} }
@ -182,6 +181,12 @@ pre {
height: 1.5rem; height: 1.5rem;
} }
#songYear {
font-size: small;
font-weight: 400;
color: var(--text-color-light);
}
.construction_bg { .construction_bg {
background: repeating-linear-gradient(45deg, background: repeating-linear-gradient(45deg,
#222200, #222200,
@ -213,6 +218,7 @@ pre {
--background-color-var: #232323; --background-color-var: #232323;
--text-color: #f5f5f5; --text-color: #f5f5f5;
--text-color-var: #a2a2a2; --text-color-var: #a2a2a2;
--text-color-light: #6c757d;
/* Modals */ /* Modals */
--modal-background-color: #121212; --modal-background-color: #121212;