update generic preview styles

astroport-fi · Feb 1, 2024 · 8089885 · 8089885
1 parent 7383f61
commit 8089885
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 6 deletions.
diff --git a/frontend/src/app/generic-preview/generic-preview.page.html b/frontend/src/app/generic-preview/generic-preview.page.html
@@ -13,7 +13,7 @@
     {{ humanType }}
   </div>
 </div>
-<div *ngIf="isExplicit">
+<div *ngIf="isExplicit" class="h-100">
   <div class="explicit mx-auto">
     <ion-icon name="eye-off-outline"></ion-icon>
     <div class="note">Explicit content</div>

diff --git a/frontend/src/app/generic-preview/generic-preview.page.scss b/frontend/src/app/generic-preview/generic-preview.page.scss
@@ -16,17 +16,21 @@ audio {
 }
 
 .explicit {
-    width: 200px;
-    min-height: 200px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    height: 100%;
+    width: 100%;
     background-color: rgba(0, 0, 0, 0.3);
     text-align: center;
     text-transform: uppercase;
-    padding-top: 80px;
     border-radius: 10px;
     font-size: 22px;
     color: #999999;
 
     .note {
         font-size: 12px;
+        margin-top: 10px;
     }
 }
diff --git a/frontend/src/app/list-inscriptions/list-inscriptions.page.html b/frontend/src/app/list-inscriptions/list-inscriptions.page.html
@@ -85,7 +85,7 @@
             >
               <div class="content">
                 <app-generic-preview [mime]="item.mime" [contentPath]="item.content_path"
-                  [isExplicit]="item.is_explicit"></app-generic-preview>
+                  [isExplicit]="item.is_explicit" class="w-100 h-100"></app-generic-preview>
               </div>
               <h4 class="name">{{ item.name }}</h4>
               <div class="detail">

diff --git a/frontend/src/app/view-inscription/view-inscription.page.html b/frontend/src/app/view-inscription/view-inscription.page.html
@@ -31,7 +31,7 @@
           <ion-grid>
             <ion-row>
               <ion-col size-lg="6" size-xs="12">
-                <div class="text-center">
+                <div class="text-center h-100">
                   <app-generic-preview [mime]="inscription.mime" [contentPath]="inscription.content_path"
                     [isExplicit]="inscription.is_explicit"></app-generic-preview>
                 </div>