style.css aktualisiert

This commit is contained in:
simonpipe 2024-12-20 11:13:19 +00:00
parent 58558aeb43
commit f8c9c0f122

View file

@ -5,12 +5,56 @@ body {
padding: 20px; padding: 20px;
} }
.header {
background-color: #FFFFE3;
padding-bottom: 10px;
}
.titel {
display: flex;
align-items: center; /* Zentriert Elemente vertikal */
justify-content: center; /* Hier wird die horizontale Zentrierung eingestellt */
gap: 10px;
}
.current-station {
font-weight: bold;
font-size: 16px;
padding-left: 20px; /* Padding statt margin */
margin-bottom: 15px;
}
#aktueller-sender {
background-color: #d2f8d2;
border-radius: 5px;
padding: 10px 20px;
}
.stop-button {
background-color: #ff9999;
color: #fff; /* Weißer Text auf rotem Hintergrund */
font-weight: bold;
border: none;
border-radius: 5px;
padding: 10px 20px;
text-align: center;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.stop-button:hover {
background-color: #ff4d4d;
}
.preset-container { .preset-container {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-gap: 20px; grid-gap: 20px;
margin-top: 30px; margin-top: 30px;
margin-bottom: 30px; margin-bottom: 30px;
} }
.preset-item { .preset-item {
@ -22,16 +66,11 @@ body {
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
}
.preset-item:hover {
background-color: #e0e0e0;
} }
.preset-item h3 { .preset-item h3 {
margin: 0; margin: 0;
flex-grow: 1; flex: 1; /* Flexibel innerhalb des Items */
} }
.preset-item button { .preset-item button {
@ -40,36 +79,21 @@ body {
} }
.new-preset-container { .new-preset-container {
margin-bottom: 15px; margin-bottom: 15px;
} }
.current-station { .button-container {
font-weight: bold; margin-bottom: 15px;
font-size: 16px;
margin-left: 20px;
} }
#aktueller-sender { .footer {
background-color: #FFFF00; margin: 20px 0;
border-radius: 5px; text-align: center; /* Zentriert den gesamten Inhalt */
padding: 10px 20px; font-size: 12px;
color: #999
} }
.stop-button { .footer a {
background-color: #ff9999; color: #999; /* Farbe der Links */
color: #fff; /* Weißer Text auf rotem Hintergrund */ text-decoration: underline; /* Entfernt den Unterstreichung */
font-weight: bold;
border: none;
border-radius: 5px;
padding: 10px 20px;
text-align: center;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
transition: background-color 0.3s ease;
} }
.stop-button:hover {
background-color: #ff4d4d; /* Dunklerer Farbton beim Hovern */
}