compact view 💯

whyboris · Feb 20, 2023 · 09c57b8 · 09c57b8
1 parent 2fa639b
commit 09c57b8
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 6 deletions.
diff --git a/i18n/en.json b/i18n/en.json
@@ -136,7 +136,7 @@
     "showFullViewDescription": "All screenshots view",
     "showFullViewHint": "Full view",
     "showMoreInfoDescription": "Show file name, resolution, and video length",
-    "showMoreInfoHint": "Show file name",
+    "showMoreInfoHint": "Show file name & meta",
     "showRecentDescription": "Show recently-opened video hub history",
     "showRecentHint": "Show recently opened hubs",
     "showRecentPlayed": "Recently played",

diff --git a/src/app/components/views/filmstrip/filmstrip.component.html b/src/app/components/views/filmstrip/filmstrip.component.html
@@ -1,6 +1,7 @@
 <div
   [ngStyle]="{ height: elHeight + 'px'}"
-  [ngClass]="compactView ? 'compact-margins': 'meta-container'"
+  class="meta-container"
+  [ngClass]="{ 'compact-margins' : compactView }"
 >
   <div
     #filmstripHolder
@@ -35,7 +36,7 @@
   </app-icon>
 
   <span
-    *ngIf="showMeta"
+    *ngIf="showMeta && !compactView"
     [ngClass]="{ 'larger-font': largerFont }"
     [ngStyle]="{ color: darkMode ? '#BBBBBB' : '#000000' }"
     class="title"

diff --git a/src/app/components/views/filmstrip/filmstrip.component.scss b/src/app/components/views/filmstrip/filmstrip.component.scss
@@ -1 +1,3 @@
-// contents in `film-and-full.scss`
+.compact-margins {
+  margin: 5px 0 0 20px;
+}
diff --git a/src/app/components/views/filmstrip/filmstrip.component.ts b/src/app/components/views/filmstrip/filmstrip.component.ts
@@ -14,10 +14,10 @@ import type { RightClickEmit, VideoClickEmit } from '../../../../../interfaces/s
   selector: 'app-filmstrip-item',
   templateUrl: './filmstrip.component.html',
   styleUrls: [
-      '../clip-and-preview.scss',
       '../film-and-full.scss',
       '../time-and-rez.scss',
-      '../selected.scss'
+      '../selected.scss',
+      './filmstrip.component.scss'
     ],
   animations: [ textAppear,
                 metaAppear ]