diff --git a/index.html b/index.html index b82b963..7c58d5f 100644 --- a/index.html +++ b/index.html @@ -691,84 +691,77 @@ z-index: 998; } - /* Admin Panel Styles - Mobile First */ + /* Admin Panel Styles - Simple and Working */ .admin-setting-group { - padding: 15px 10px; + padding: 15px; } .admin-input-row { display: flex; flex-direction: column; margin-bottom: 20px; - gap: 8px; } .admin-input-row label { color: #FFA726; font-size: 14px; font-weight: 600; - letter-spacing: 0.3px; - margin-bottom: 4px; + margin-bottom: 8px; + display: block; } - .admin-input-wrapper { + .admin-input-container { display: flex; align-items: center; gap: 10px; } - .admin-input-row input[type="number"], - .admin-input-row input[type="range"] { - flex: 1; - min-height: 44px; - padding: 10px 12px; + .admin-input-row input[type="number"] { + width: 100%; + max-width: 200px; + height: 44px; + padding: 8px 12px; background: #2a2a2a; color: white; - border: 2px solid #444; + border: 2px solid #555; border-radius: 8px; font-size: 16px; text-align: center; -webkit-appearance: none; + -moz-appearance: textfield; + box-sizing: border-box; } .admin-input-row input[type="checkbox"] { width: 24px; height: 24px; cursor: pointer; + margin-right: 10px; } - .admin-input-row input[type="number"]:focus, - .admin-input-row input[type="range"]:focus { + .admin-input-row input[type="number"]:focus { outline: none; border-color: #4CAF50; background: #333; - box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.2); } .admin-input-row .unit { color: #aaa; font-size: 14px; white-space: nowrap; - min-width: 60px; - text-align: right; } - .admin-range-value { - background: #333; - color: #FFA726; - padding: 8px 12px; - border-radius: 6px; - font-weight: bold; - min-width: 60px; - text-align: center; - border: 1px solid #555; + .admin-checkbox-row { + display: flex; + align-items: center; + margin-bottom: 20px; } - /* Desktop layout */ + /* Responsive adjustments */ @media (min-width: 768px) { .admin-input-row { flex-direction: row; align-items: center; + justify-content: space-between; } .admin-input-row label { - flex: 0 0 200px; margin-bottom: 0; + flex: 0 0 auto; + min-width: 200px; } - .admin-input-row input[type="number"], - .admin-input-row input[type="range"] { + .admin-input-container { flex: 0 0 auto; - width: 120px; } } .admin-button-group { @@ -1033,24 +1026,23 @@