Fachschaft/GetraenkelisteWebsite
5
0
Fork 0
Code Issues Pull Requests Actions Activity

Add responsive design (fix #2)

Browse Source
This commit is contained in:
Moritz
2025-06-07 01:58:10 +02:00
parent 20124b46c9
commit e5b5208726
5 changed files with 65 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
static/style.css
View File

@@ -38,9 +38,71 @@ header {
background: #23272a;
color: #e0e0e0;
}
input, select, button {
input,
select,
button {
background: #23272a;
color: #e0e0e0;
border-color: #444;
}
}
/* Responsive Design */
@media (max-width: 600px) {
body {
max-width: 100vw;
padding: 0.5em;
}
header,
main {
padding: 0.5em;
margin-bottom: 0.5em;
}
h1 {
font-size: 1.3em;
text-align: center;
}
table {
font-size: 0.95em;
width: 100%;
display: block;
overflow-x: auto;
}
th,
td {
padding: 0.3em 0.5em !important;
word-break: break-word;
}
form {
flex-direction: column !important;
gap: 0.5em !important;
max-width: 100% !important;
}
input,
select,
button,
label {
width: 100% !important;
font-size: 1em !important;
box-sizing: border-box;
}
.github-icon-link {
top: 8px;
right: 8px;
width: 24px;
height: 24px;
}
img[alt="Logo"] {
height: 36px !important;
}
#popup {
max-width: 98vw !important;
left: 50% !important;
transform: translate(-50%, -25%) !important;
padding: 0.5em !important;
}
#popup-getraenke button {
font-size: 1em !important;
padding: 0.5em 0.7em !important;
}
}