From 81fde2c77ff196e50c90e3d6287d4febd623a0d2 Mon Sep 17 00:00:00 2001
From: 4gray <4gray@users.noreply.github.com>
Date: Fri, 8 Sep 2023 23:50:02 +0200
Subject: [PATCH] style(portals): some cosmetic changes in card design

---
 .../category-content-view.component.html      |  5 +++--
 .../category-content-view.component.scss      | 19 +++++++++----------
 .../category-view/category-view.component.ts  |  5 +++--
 3 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/app/xtream/category-content-view/category-content-view.component.html b/src/app/xtream/category-content-view/category-content-view.component.html
index a5a4444d6..b6147cb98 100644
--- a/src/app/xtream/category-content-view/category-content-view.component.html
+++ b/src/app/xtream/category-content-view/category-content-view.component.html
@@ -1,8 +1,9 @@
 <ng-container *ngIf="items?.length > 0; else noItems">
     <div class="grid">
         <mat-card
+            appearance="outlined"
             *ngFor="
-                let item of items | filterBy : searchPhrase() : 'name';
+                let item of items | filterBy: searchPhrase() : 'name';
                 trackBy: trackByFn
             "
             (click)="itemClicked.emit(item)"
@@ -27,7 +28,7 @@
         </mat-card>
         <div
             class="no-content"
-            *ngIf="!(items | filterBy : searchPhrase() : 'name')?.length"
+            *ngIf="!(items | filterBy: searchPhrase() : 'name')?.length"
         >
             <mat-icon class="icon">search</mat-icon>
             <div>Nothing found, try to change you search request</div>
diff --git a/src/app/xtream/category-content-view/category-content-view.component.scss b/src/app/xtream/category-content-view/category-content-view.component.scss
index c68e4a407..a7d05b360 100644
--- a/src/app/xtream/category-content-view/category-content-view.component.scss
+++ b/src/app/xtream/category-content-view/category-content-view.component.scss
@@ -3,6 +3,15 @@
     padding: 20px;
 }
 
+mat-card {
+    overflow: hidden;
+    transition: all 0.9s cubic-bezier(0.25, 0.8, 0.25, 1);
+}
+
+mat-card:hover {
+    box-shadow: 0 14px 28px rgba(0, 0, 0, 25%), 0 10px 10px rgba(0, 0, 0, 22%);
+}
+
 .grid {
     display: flex;
     flex-wrap: wrap;
@@ -53,13 +62,3 @@
         width: 64px;
     }
 }
-
-mat-card {
-    overflow: hidden;
-
-    transition: all 0.9s cubic-bezier(0.25, 0.8, 0.25, 1);
-}
-
-mat-card:hover {
-    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
-}
diff --git a/src/app/xtream/category-view/category-view.component.ts b/src/app/xtream/category-view/category-view.component.ts
index 12654e509..e80d25e6e 100644
--- a/src/app/xtream/category-view/category-view.component.ts
+++ b/src/app/xtream/category-view/category-view.component.ts
@@ -14,10 +14,11 @@ import { PortalStore } from '../portal.store';
         <ng-container *ngIf="items?.length > 0; else noItems">
             <div class="grid">
                 <mat-card
+                    appearance="outlined"
                     class="category-item"
                     *ngFor="
                         let item of items
-                            | filterBy : searchText() : 'category_name';
+                            | filterBy: searchText() : 'category_name';
                         trackBy: trackByFn
                     "
                     (click)="categoryClicked.emit(item)"
@@ -29,7 +30,7 @@ import { PortalStore } from '../portal.store';
                 <div
                     class="no-content"
                     *ngIf="
-                        !(items | filterBy : searchText() : 'category_name')
+                        !(items | filterBy: searchText() : 'category_name')
                             ?.length
                     "
                 >