[theme] minimal v0.2.3 (#522)

* fix navbar

* fix popover arrow

* align stats

* update readme

* theme card size slider

* theme studio tagger

* Theme skeleton

* theme arrow in player view

* theme arrow 2

* remove nav height

* remove vtt border

* theme tagger

* fix inputs rgba

* version update

* update performer page

* fix studio image in scene view

* thin all scroll bars

* overflow studio name

* add readme: performer studio page update

Author: deuulc

themes/Theme-Minimal/README.md

@@ -1,8 +1,8 @@
 # Minimal Theme
 
-I've tried to create a theme that brings content to the front while reducing mental load from UI clutter. It simplifies everything—less color, fewer distractions, more focus. The goal is clarity: a clean, minimal design that keeps what matters in view.
+A theme that brings content to the front.
 
-It's still rough around the edges and very much a work in progress. Feedback is welcome!
+It's still rough around the edges. Feedback is welcome.
 
 For intended experience:
 
@@ -17,6 +17,11 @@ For intended experience:
 
 ## Changelog
 
+### Version 0.2.3 - 2025-04-05
+
+- Fix studio image in scene view.
+- Update performer/studio page.
+
 ### Version 0.2.2 - 2025-03-15
 
 - Theme popover arrow.

themes/Theme-Minimal/Theme-Minimal.yml

@@ -1,6 +1,6 @@
 name: Theme - Minimal
 description: Minimal Theme for Stash
-version: 0.2.2
+version: 0.2.3
 ui:
   css:
     - index.css

themes/Theme-Minimal/_scrollbars.css

@@ -2,24 +2,34 @@ body ::-webkit-scrollbar {
   -webkit-appearance: auto;
   height: auto !important;
   width: auto !important;
+  scrollbar-width: thin;
+  color: unset;
 }
 
 body ::-webkit-scrollbar-track {
   background: unset;
   border-radius: unset;
+  scrollbar-width: thin;
+  color: unset;
 }
 
 body ::-webkit-scrollbar-thumb {
   background: unset;
   border-radius: unset;
   cursor: unset;
   transition: unset;
+  scrollbar-width: thin;
+  color: unset;
 }
 
 body ::-webkit-scrollbar-thumb:window-inactive {
   background: unset;
+  scrollbar-width: thin;
+  color: unset;
 }
 
 body ::-webkit-scrollbar-thumb:hover {
   background: unset;
+  scrollbar-width: thin;
+  color: unset;
 }

themes/Theme-Minimal/scenes.css

@@ -11,8 +11,6 @@
     color: unset;
     text-decoration: none;
     font-size: var(--text-lg);
-    /* demo */
-    /* filter: blur(3px); */
   }
 
   .card-controls {
@@ -47,7 +45,7 @@
 
   .thumbnail-section {
     background-color: var(--primary-3);
-    border-radius: 16px;
+    border-radius: 12px;
     overflow: hidden;
 
     .scene-card-preview {
@@ -60,37 +58,61 @@
     .overlay-duration {
       height: auto;
 
-      margin: 8px;
-      padding: 6px 8px;
+      background-color: var(--black-a7);
+      backdrop-filter: blur(10px);
+      color: var(--primary-12);
+      opacity: unset;
+
       border-radius: 8px;
-      line-height: 1;
+      margin: 6px;
+      padding: 6px 8px;
 
+      line-height: 1;
       font-size: var(--text-2xs);
       font-weight: normal;
-      color: var(--primary-12);
-      background-color: var(--black-a6);
-      backdrop-filter: blur(10px);
-
-      opacity: unset;
-
       letter-spacing: 0.05ch;
     }
 
     .studio-overlay {
+      --image-size: 4rem;
       right: 0;
       top: 0;
 
       height: unset;
-      max-width: unset;
-      /* opacity: 1; */
       transition: opacity 0.5s;
 
       a {
+        display: block;
         text-transform: uppercase;
         color: inherit;
         text-shadow: none;
         text-decoration: none;
         letter-spacing: inherit;
+
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        width: 100%;
+        overflow: hidden;
+      }
+
+      a:has(> img) {
+        display: block;
+        line-height: 0;
+        padding: 0;
+
+        img {
+          margin: 0.1rem;
+          height: auto;
+          max-height: var(--image-size);
+          min-height: unset;
+
+          width: 100%;
+          max-width: var(--image-size);
+          min-width: unset;
+
+          object-fit: contain;
+          object-position: center;
+        }
       }
     }
 
@@ -313,6 +335,3 @@
     }
   }
 }
-
-
-

themes/Theme-Minimal/studio.css

@@ -1,3 +1,71 @@
+.sticky.detail-header {
+  display: none;
+}
+
+.detail-header {
+  --performer-image-size: 15rem;
+
+  overflow: unset;
+  .background-image-container {
+    .background-image {
+      opacity: 0.75;
+    }
+  }
+
+  &.collapsed {
+    .detail-container {
+      .detail-header-image img {
+        max-width: var(--performer-image-size);
+      }
+    }
+  }
+
+  .detail-container {
+    max-width: 1200px;
+    margin-left: auto;
+    margin-right: auto;
+
+    .detail-header-image {
+      align-items: flex-start;
+      img {
+        max-width: var(--performer-image-size);
+      }
+    }
+    .row {
+      .performer-head {
+        .alias-head {
+          color: var(--primary-11);
+          font-size: var(--text-sm);
+        }
+        .rating-stars {
+          margin: 1rem 0;
+        }
+        .detail-group {
+          display: flex;
+          column-gap: 0rem;
+          row-gap: 1.5rem;
+          .detail-item {
+            .detail-item-title {
+              font-size: var(--text-xs);
+              font-weight: unset;
+              color: var(--primary-11);
+            }
+            .detail-item-value {
+              font-size: var(--text-base);
+              font-weight: unset;
+              color: unset;
+            }
+          }
+        }
+
+        .performer-name {
+          font-size: var(--text-xl);
+        }
+      }
+    }
+  }
+}
+
 .detail-body {
   .nav {
     margin-bottom: 24px;