diff --git a/TuneRipper/Pages/Home.razor b/TuneRipper/Pages/Home.razor index af0dafc..0b95567 100644 --- a/TuneRipper/Pages/Home.razor +++ b/TuneRipper/Pages/Home.razor @@ -32,12 +32,14 @@ + disabled="@(isProcessing)"> 🎵 @if (isProcessing) { @@ -167,7 +169,7 @@ .progress-bar { width: 100%; height: 8px; - background-color: #e0e0e0; + background-color: #e8ecf4; border-radius: 4px; overflow: hidden; margin-bottom: 10px; @@ -175,14 +177,15 @@ .progress-container.with-video-details .progress-bar { height: 6px; - background-color: #d1d9ff; + background-color: #e1e5ed; } .progress-fill { height: 100%; - background: linear-gradient(90deg, #4CAF50, #45a049); + background: linear-gradient(90deg, #1e88e5, #2196f3); border-radius: 4px; transition: width 0.3s ease; + box-shadow: 0 0 8px rgba(33, 150, 243, 0.4); } .progress-text { @@ -314,8 +317,8 @@ } .video-info-card.processing { - border-color: #4CAF50; - box-shadow: 0 2px 12px rgba(76, 175, 80, 0.15); + border-color: #1e88e5; + box-shadow: 0 2px 12px rgba(30, 136, 229, 0.15); } .video-thumbnail { @@ -375,10 +378,20 @@ text-align: center; } + .output-message { + margin-top: 15px; + padding: 12px; + background: #f0f9ff; + border: 1px solid #bae6fd; + border-radius: 8px; + color: #0369a1; + text-align: center; + } + .conversion-status { margin-top: 8px; padding: 8px 12px; - background: linear-gradient(90deg, #4CAF50, #45a049); + background: linear-gradient(90deg, #1e88e5, #2196f3); color: white; border-radius: 6px; display: flex; @@ -406,11 +419,11 @@ @@keyframes pulse { 0%, 100% { transform: scale(1); - box-shadow: 0 0 0 0 rgba(76, 175, 80, 0.4); + box-shadow: 0 0 0 0 rgba(30, 136, 229, 0.4); } 50% { transform: scale(1.02); - box-shadow: 0 0 0 10px rgba(76, 175, 80, 0); + box-shadow: 0 0 0 10px rgba(30, 136, 229, 0); } } @@ -692,4 +705,18 @@ await DownloadMp3(); } } + + // Prevent default blur behavior to allow immediate button clicking + private void OnInputBlur() + { + // This method intentionally left empty to capture blur event without action + // This helps maintain focus state for better UX + } + + // Prevent mousedown default to allow immediate button click + private async Task PreventDefault(MouseEventArgs e) + { + // Allow the button click to proceed immediately without waiting for blur + await Task.CompletedTask; + } }