diff --git a/apps/ui/css/login.css b/apps/ui/css/login.css index 9b00f7f..ad23017 100644 --- a/apps/ui/css/login.css +++ b/apps/ui/css/login.css @@ -173,6 +173,10 @@ margin-bottom: 16px; } +.login-error.is-visible { + display: block; +} + .login-footer { text-align: center; margin-top: 20px; diff --git a/apps/ui/css/logs.css b/apps/ui/css/logs.css index e3f4a04..a449de3 100644 --- a/apps/ui/css/logs.css +++ b/apps/ui/css/logs.css @@ -14,6 +14,12 @@ background: var(--green); animation: pulse 1.8s ease-in-out infinite; flex-shrink: 0; + cursor: pointer; +} + +.live-dot.is-paused { + animation-play-state: paused; + opacity: 0.35; } @keyframes pulse { @@ -26,6 +32,11 @@ font-weight: 600; color: var(--green); letter-spacing: 0.2px; + cursor: pointer; +} + +.live-label.is-paused { + color: var(--text-muted); } .toolbar-sep { width: 1px; height: 16px; background: var(--border); flex-shrink: 0; } diff --git a/apps/ui/js/login.js b/apps/ui/js/login.js index 1d3cee8..d056d93 100644 --- a/apps/ui/js/login.js +++ b/apps/ui/js/login.js @@ -5,13 +5,13 @@ function showError(message) { var errorElement = document.getElementById('login-error'); - errorElement.style.display = 'block'; + errorElement.classList.add('is-visible'); errorElement.textContent = message; } function hideError() { var errorElement = document.getElementById('login-error'); - errorElement.style.display = 'none'; + errorElement.classList.remove('is-visible'); } function initLoginPage() { diff --git a/apps/ui/js/logs.js b/apps/ui/js/logs.js index 682bf73..b51f776 100644 --- a/apps/ui/js/logs.js +++ b/apps/ui/js/logs.js @@ -323,14 +323,11 @@ document.addEventListener('DOMContentLoaded', function () { function setLiveState() { if (liveDot) { - liveDot.style.animationPlayState = state.liveMode ? 'running' : 'paused'; - liveDot.style.opacity = state.liveMode ? '' : '0.35'; - liveDot.style.cursor = 'pointer'; + liveDot.classList.toggle('is-paused', !state.liveMode); } if (liveLabel) { liveLabel.textContent = state.liveMode ? tKey('logs.live') : tKey('logs.paused'); - liveLabel.style.color = state.liveMode ? '' : 'var(--text-muted)'; - liveLabel.style.cursor = 'pointer'; + liveLabel.classList.toggle('is-paused', !state.liveMode); } }