From 6ef6adc9611a1fe10d5ec90c783d3239d3de25b5 Mon Sep 17 00:00:00 2001 From: simonpipe Date: Fri, 19 Dec 2025 15:34:44 +0100 Subject: [PATCH] Delete style.css --- style.css | 385 ------------------------------------------------------ 1 file changed, 385 deletions(-) delete mode 100644 style.css diff --git a/style.css b/style.css deleted file mode 100644 index 76bb668..0000000 --- a/style.css +++ /dev/null @@ -1,385 +0,0 @@ -/* Public Domain - Radioplayer Stylesheet */ - -:root { - /* Farben */ - --primary-color: #ff9999; - --primary-color-hover: #ff7777; - --success-color: #d2f8d2; - --success-color-hover: #b8e9b8; - --background-color: #fafafa; - --header-background: #FFFFE3; - --modal-background: #fff; - --modal-background-export: #f9f9f9; - --item-background: #f1f1f1; - --item-hover: #e6e6e6; - --button-background: #f0f0f0; - --button-hover: #e0e0e0; - --button-color: #fff; - --border-color: #ddd; - --text-color: #333; - --text-color-light: #666; - --text-color-lighter: #ccc; - --shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - --modal-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); - - /* Schriftfamilie */ - --font-family: Arial, sans-serif; - - /* Layout Fix */ - --header-height: 130px; - --padding-top: calc(var(--header-height) + 20px); -} - -/* --- BASICS --- */ -body { - font-family: var(--font-family); - text-align: center; - margin: 0; - padding: 20px; - padding-top: var(--padding-top); - background-color: var(--background-color); - color: var(--text-color); -} - -.hidden { - display: none !important; -} - -/* --- HEADER & NAVIGATION --- */ -.header { - background-color: var(--header-background); - height: var(--header-height); - padding-bottom: 10px; - position: fixed; - top: 0; - left: 0; - width: 100%; - z-index: 1000; - box-shadow: var(--shadow); -} - -.titel { - display: flex; - align-items: center; - justify-content: center; - gap: 10px; -} - -.titel img { - height: 30px; - width: auto; -} - -.stop-button { - background-color: var(--primary-color); - color: var(--button-color); - font-weight: bold; - border: none; - border-radius: 5px; - height: 30px; - padding: 4px 10px; - font-size: 18px; - margin-left: 10px; - cursor: pointer; - transition: background-color 0.3s ease; - position: relative; - top: -2px; -} - -.stop-button:hover { - background-color: var(--primary-color-hover); -} - -#aktueller-sender { - background-color: var(--success-color); - border-radius: 5px; - padding: 10px 20px; - display: inline-block; - max-width: 90%; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - font-weight: bold; - font-size: 0.95em; - border: 1px solid rgba(0,0,0,0.05); -} - -#current-station-name i { - color: var(--text-color-light); - margin-right: 3px; - font-size: 0.9em; /* Macht das Icon dezent kleiner als den Text */ - vertical-align: middle; -} - -/* --- PRESET GRID --- */ -.preset-container { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - grid-gap: 20px; - margin: 30px auto; - max-width: 1200px; - padding: 0 10px; -} - -.preset-item { - background-color: var(--item-background); - padding: 0 15px; - border-radius: 5px; - box-shadow: var(--shadow); - cursor: pointer; - transition: all 0.3s ease; - display: flex; - align-items: center; - min-height: 50px; -} - -.preset-item h3 { - margin: 0; - flex: 1; - text-align: left; - word-break: break-word; - font-size: 1.1em; -} - -.preset-item:hover { - background-color: var(--item-hover); - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); -} - -/* --- BUTTONS --- */ -.button-container button, -.btn, -.custom-modal-buttons button, -.search-link { /* Such-Link hier hinzugefügt */ - padding: 10px 20px; - min-width: 120px; - border: 1px solid var(--border-color); - border-radius: 5px; - background-color: var(--button-background); - color: var(--text-color); - cursor: pointer; - transition: all 0.2s ease; - font-family: var(--font-family); - font-size: 14px; - display: inline-flex; - align-items: center; - justify-content: center; - text-decoration: none; /* Entfernt den Unterstrich beim Link */ - gap: 8px; -} - -/* Speziell für den weißen Hintergrund des Such-Buttons */ -.search-link { - background-color: #ffffff !important; -} - -.button-container button:hover, -.btn:hover, -.custom-modal-buttons button:hover, -.search-link:hover { - background-color: var(--button-hover) !important; -} - -/* Papierkorb-Icon in der Liste */ -.delete-btn { - background: transparent !important; - border: none !important; - min-width: auto !important; - padding: 5px !important; - color: #ff9999; /* Dein --primary-color */ - transition: color 0.2s ease; -} - -.delete-btn:hover { - color: #ff4444 !important; /* Kräftiges Warn-Rot */ - background: transparent !important; -} - -.delete-btn i { - font-size: 1.1rem; -} - -/* Basis-Design für alle Buttons (inkl. Custom Modal) */ -.button-container button, -.btn, -.custom-modal-buttons button { - padding: 10px 20px; - min-width: 120px; - border: 1px solid var(--border-color); - border-radius: 5px; - background-color: var(--button-background); - color: var(--text-color); - cursor: pointer; - transition: all 0.2s ease; - font-family: var(--font-family); - font-size: 14px; - display: inline-flex; - align-items: center; - justify-content: center; -} - -.button-container button:hover, -.btn:hover, -.custom-modal-buttons button:hover { - background-color: var(--button-hover); -} - -/* Spezial-Klassen für OK und Abbrechen (überall gültig) */ -.btn-ok { - background-color: var(--success-color) !important; - font-weight: bold !important; -} - -.btn-ok:hover { - background-color: var(--success-color-hover) !important; -} - -.btn-cancel { - background-color: var(--button-background) !important; -} - -/* --- MODALS --- */ -.modal { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: var(--modal-background); - padding: 25px; - border-radius: 12px; - box-shadow: var(--modal-shadow); - z-index: 2000; - max-width: 800px; - width: 90%; - max-height: 85vh; - overflow-y: auto; -} - -.modal-content { - display: flex; - flex-direction: column; - gap: 15px; -} - -/* Tabelle im Modal */ -#preset-table { - width: 100%; - border-collapse: collapse; - margin: 10px 0; -} - -#preset-table th, #preset-table td { - border: 1px solid var(--border-color); - padding: 10px; -} - -#preset-table th { - background-color: #f8f8f8; -} - -.drag-handle { - cursor: grab; - color: var(--text-color-lighter); -} - -/* --- EXPORT / SHARE BEREICH --- */ -.export-import-container { - margin: 20px 0; - padding: 20px; - background: var(--modal-background-export); - border: 1px solid var(--border-color); - border-radius: 10px; -} - -.share-row { - display: flex; - gap: 8px; - margin-bottom: 15px; -} - -.share-row input { - flex: 1; - padding: 10px; - border: 1px solid var(--border-color); - border-radius: 6px; - font-family: monospace; - font-size: 0.85rem; - background: #fff; - cursor: pointer; - overflow: hidden; - text-overflow: ellipsis; -} - -.json-row { - display: flex; - justify-content: center; - gap: 10px; -} - -/* --- FOOTER --- */ -footer { - margin-top: 40px; -} - -.footer { - font-size: 12px; - color: var(--text-color-light); - display: flex; - align-items: center; - justify-content: center; - gap: 5px; -} - -.footer a { - color: inherit; - text-decoration: none; - font-weight: bold; -} - -/* --- CUSTOM ALERTS --- */ -.custom-modal { - position: fixed; - top: 0; left: 0; - width: 100%; height: 100%; - background-color: rgba(0, 0, 0, 0.6); - display: flex; - justify-content: center; - align-items: center; - z-index: 4000; -} - -.custom-modal-content { - background: #fff; - padding: 25px; - border-radius: 10px; - max-width: 400px; - width: 85%; - text-align: center; -} - -.custom-modal-buttons { - display: flex; - justify-content: center; - gap: 15px; - margin-top: 20px; -} - -/* --- MOBILE OPTIMIERUNG --- */ -@media (max-width: 600px) { - :root { - --header-height: 140px; - } - - .share-row { - flex-direction: column; - } - - .json-row { - flex-direction: column; - } - - #preset-table th:nth-child(3), - #preset-table td:nth-child(3) { - display: none; - } -} \ No newline at end of file