package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "twitch-vod-manager",
-  "version": "4.6.136",
+  "version": "4.6.135",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "twitch-vod-manager",
-      "version": "4.6.136",
+      "version": "4.6.135",
       "license": "MIT",
       "dependencies": {
         "axios": "^1.6.0",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "twitch-vod-manager",
-  "version": "4.6.136",
+  "version": "4.6.135",
   "description": "Twitch VOD Manager - Download Twitch VODs easily",
   "main": "dist/main.js",
   "author": "xRangerDE",

src/index.html

@@ -260,7 +260,7 @@
             <div class="content">
                 <!-- VODs Tab -->
                 <div class="tab-content active" id="vodsTab">
-                    <div id="streamerProfileHeader" class="streamer-profile-header is-hidden"></div>
+                    <div id="streamerProfileHeader" class="streamer-profile-header" style="display:none;"></div>
                     <div class="vod-filter-row">
                         <input type="text" id="vodFilterInput" class="filter-input" placeholder="Filter VODs..." oninput="onVodFilterInput()">
                         <button type="button" id="vodFilterClearBtn" class="btn-close is-hidden" onclick="clearVodFilter()" title="Clear filter">x</button>

src/renderer-profile.ts

@@ -30,15 +30,16 @@ function formatLastStreamAgo(iso: string | null): string {
 function hideStreamerProfileHeader(): void {
     const el = document.getElementById('streamerProfileHeader');
     if (!el) return;
-    el.classList.add('is-hidden');
+    el.style.display = 'none';
     applyHtml(el, '');
 }
 
 function renderStreamerProfileSkeleton(login: string): void {
     const el = document.getElementById('streamerProfileHeader');
     if (!el) return;
-    el.classList.remove('is-live', 'is-hidden');
+    el.classList.remove('is-live');
     el.classList.add('streamer-profile-skeleton');
+    el.style.display = 'flex';
     applyHtml(el, `
         <div class="streamer-profile-skel-block avatar"></div>
         <div class="streamer-profile-body">
@@ -59,8 +60,9 @@ function renderStreamerProfileSkeleton(login: string): void {
 function renderStreamerProfileCard(p: StreamerProfile): void {
     const el = document.getElementById('streamerProfileHeader');
     if (!el) return;
-    el.classList.remove('streamer-profile-skeleton', 'is-hidden');
+    el.classList.remove('streamer-profile-skeleton');
     if (p.isLive) el.classList.add('is-live'); else el.classList.remove('is-live');
+    el.style.display = 'block';
 
     const safeLogin = p.login.replace(/'/g, "\\'");
     const safeUrl = p.twitchUrl.replace(/'/g, "\\'");

src/styles.css

@@ -4257,14 +4257,7 @@ input[type="number"]::-webkit-outer-spin-button {
     box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85), 0 0 0 4px rgba(145, 70, 255, 0.55);
 }
 
-/* Skeleton loading state — switches the profile-header from its
-   regular block layout to a flex row so the avatar + body sit
-   side-by-side. The element itself was previously flipped via inline
-   .style.display='flex' in renderStreamerProfileSkeleton(). */
-.streamer-profile-skeleton {
-    display: flex;
-}
-
+/* Skeleton loading state */
 .streamer-profile-skeleton .streamer-profile-skel-block {
     background: linear-gradient(90deg, var(--bg-elevated) 0%, rgba(255,255,255,0.06) 50%, var(--bg-elevated) 100%);
     background-size: 200% 100%;