diff --git a/css/style.css b/css/style.css index 429d7c8..c30fa37 100644 --- a/css/style.css +++ b/css/style.css @@ -2223,3 +2223,82 @@ a:hover { color: #fff; text-shadow: none; } font-size: 0.55rem; } } + +/* ============================ + CHAT SUB-ROW (Below Chat) + ============================ */ +.chat-sub-row { + display: flex; + gap: 0.5rem; + margin-top: 0.5rem; +} + +.chat-sub-panel { + flex: 1; + min-width: 0; +} + +/* ============================ + SERVER CLOCK / UPTIME + ============================ */ +.clock-display { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 0.75rem 0.5rem !important; + gap: 0.25rem; +} + +.clock-time { + font-family: 'Orbitron', var(--font-mono); + font-size: 1.6rem; + font-weight: 700; + color: var(--status-green); + text-shadow: 0 0 12px var(--status-green-glow), 0 0 25px rgba(0, 204, 51, 0.15); + letter-spacing: 3px; + line-height: 1; +} + +.clock-date { + font-family: var(--font-mono); + font-size: 0.55rem; + color: var(--text-secondary); + letter-spacing: 2px; +} + +.clock-uptime-row { + display: flex; + align-items: center; + gap: 0.5rem; + margin-top: 0.35rem; + padding-top: 0.35rem; + border-top: 1px solid var(--border); + width: 100%; + justify-content: center; +} + +.clock-uptime-label { + font-family: var(--font-mono); + font-size: 0.45rem; + letter-spacing: 2px; + color: var(--text-secondary); +} + +.clock-uptime-val { + font-family: 'Orbitron', var(--font-mono); + font-size: 0.7rem; + font-weight: 600; + color: var(--status-green); + text-shadow: 0 0 6px var(--status-green-glow); +} + +/* Chat sub-row responsive */ +@media (max-width: 768px) { + .chat-sub-row { + flex-direction: column; + } + .clock-time { + font-size: 1.2rem; + } +} diff --git a/index.html b/index.html index a58ff4b..c1168bb 100644 --- a/index.html +++ b/index.html @@ -166,6 +166,43 @@ + + +