style fixes

Author: KSemenenko

src/PrompterOne.Shared/AppShell/Components/MainLayoutGoLiveWidget.razor.css

@@ -1,7 +1,7 @@
 .app-live-widget {
     position: fixed;
-    right: calc(22px + env(safe-area-inset-right));
-    bottom: calc(20px + env(safe-area-inset-bottom));
+    right: 22px;
+    bottom: 20px;
     z-index: 60;
     width: min(234px, calc(100vw - 28px));
     display: flex;
@@ -150,42 +150,27 @@
 
 @media (max-width: 900px) {
     .app-live-widget {
-        right: calc(14px + env(safe-area-inset-right));
-        bottom: calc(14px + env(safe-area-inset-bottom));
+        right: 14px;
+        bottom: 14px;
         width: min(210px, calc(100vw - 20px));
     }
 }
 
 @media (max-width: 560px) {
     .app-live-widget {
-        right: calc(8px + env(safe-area-inset-right));
-        bottom: calc(18px + env(safe-area-inset-bottom));
-        width: min(176px, calc(100vw - 24px));
-        padding: 6px;
-        gap: 6px;
+        right: 10px;
+        bottom: 10px;
+        width: min(188px, calc(100vw - 20px));
+        padding: 8px;
+        gap: 8px;
         border-radius: 16px;
     }
 
     .app-live-widget-preview {
-        min-height: 74px;
+        min-height: 92px;
     }
 
     .app-live-widget-copy {
-        gap: 2px;
-    }
-
-    .app-live-widget-live-pill,
-    .app-live-widget-timer {
-        min-height: 18px;
-        padding: 0 6px;
-        font-size: 8px;
-    }
-
-    .app-live-widget-title {
-        font-size: 12px;
-    }
-
-    .app-live-widget-detail {
-        font-size: 10px;
+        gap: 3px;
     }
 }

src/PrompterOne.Shared/AppShell/Components/MainLayoutHeader.razor.css

@@ -22,38 +22,11 @@
     box-shadow: 0 0 10px rgba(214, 166, 91, .04);
 }
 
-.app-header[data-reader-muted="true"] .btn-back {
-    background: rgba(255, 255, 255, .012) !important;
-    border: 1px solid rgba(214, 166, 91, .08);
-    color: rgba(248, 241, 226, .50);
-    box-shadow: none;
-}
-
-.app-header[data-reader-muted="true"] .btn-back:hover {
-    background: rgba(255, 255, 255, .024) !important;
-    border-color: rgba(214, 166, 91, .14);
-    color: rgba(248, 241, 226, .68);
-    box-shadow: 0 0 10px rgba(214, 166, 91, .04);
-}
-
-.app-header[data-reader-muted="true"] ::deep .go-live-shell-button {
-    background: rgba(255, 255, 255, .01) !important;
-    border-color: rgba(214, 166, 91, .08);
-    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
-    color: rgba(248, 241, 226, .58);
-}
-
-.app-header[data-reader-muted="true"] ::deep .go-live-shell-button:hover {
-    background: rgba(255, 255, 255, .022) !important;
-    border-color: rgba(214, 166, 91, .14);
-    box-shadow: 0 0 12px rgba(214, 166, 91, .04);
-}
-
 .btn-open-script {
     cursor: pointer;
 }
 
-.app-header-file-input {
+.app-header-file-action ::deep .app-header-file-input {
     position: absolute;
     top: 0;
     left: 0;

src/PrompterOne.Shared/wwwroot/design/modules/90-utilities.css

@@ -150,3 +150,36 @@
     .tp-scroll { padding: 0 6%; }
     .rsvp-word { font-size: 52px; }
 }
+
+@media (max-width: 768px) and (max-height: 480px) {
+    #screen-library.active {
+        flex-direction: row;
+    }
+
+    .lib-sidebar {
+        width: min(220px, 34vw);
+        border-right: var(--glass-border-light);
+        border-bottom: none;
+        padding: 10px 12px;
+        flex: 0 0 auto;
+    }
+
+    .lib-folders-section {
+        margin-top: 12px;
+        max-height: none;
+    }
+
+    .lib-nav-bottom {
+        margin-top: auto;
+        padding-top: 10px;
+    }
+
+    .lib-main {
+        min-width: 0;
+        min-height: 0;
+    }
+
+    .lib-scroll {
+        padding: 16px 14px 20px;
+    }
+}

tests/PrompterOne.Web.UITests/Editor/EditorLineNumberLayoutTests.cs

@@ -59,10 +59,7 @@ await UiScenarioArtifacts.CaptureLocatorAsync(
                 }
                 """);
             var lineNumberGap = contentLeftBoundary - lineNumberTextRight;
-            await Assert.That(lineNumberGap >= 0).IsTrue().Because($"Expected Monaco line numbers to stay inside the gutter without overlapping content, but the computed gap was {lineNumberGap:0.##}.");
-            await Assert.That(lineNumberGap <= BrowserTestConstants.Editor.MaximumLineNumberTextGapPx)
-                .IsTrue()
-                .Because($"Expected Monaco line numbers to keep a compact gutter gap, but the computed gap was {lineNumberGap:0.##}.");
+            await Assert.That(lineNumberGap).IsBetween(BrowserTestConstants.Editor.MinimumLineNumberTextGapPx, BrowserTestConstants.Editor.MaximumLineNumberTextGapPx);
         }
         finally
         {

tests/PrompterOne.Web.UITests/Responsive/ResponsiveLayoutTests.cs

@@ -22,7 +22,7 @@ public Task LibraryRoute_KeepsPrimaryControlsVisibleAcrossResponsiveViewports(Re
             UiTestIds.Library.Page,
             UiTestIds.Library.FolderAll,
             UiTestIds.Library.OpenSettings,
-            UiTestIds.Header.LibrarySearchSurface,
+            UiTestIds.Header.LibrarySearch,
             UiTestIds.Header.GoLive,
             UiTestIds.Header.LibraryOpenScript,
             UiTestIds.Header.LibraryNewScript));
@@ -39,7 +39,7 @@ public Task LibraryRoute_KeepsHeaderBrandingVisibleAcrossIpadPortraitViewports(R
             UiTestIds.Header.Home,
             UiTestIds.Header.Brand,
             UiTestIds.Header.LibraryBreadcrumbCurrent,
-            UiTestIds.Header.LibrarySearchSurface,
+            UiTestIds.Header.LibrarySearch,
             UiTestIds.Header.GoLive,
             UiTestIds.Header.LibraryOpenScript,
             UiTestIds.Header.LibraryNewScript));