saved filters: accent initial Create Fast Filter button

Author: lyubov-voloshko

frontend/src/app/components/dashboard/db-table-view/saved-filters-panel/saved-filters-panel.component.css

@@ -10,6 +10,16 @@
     gap: 16px;
 }
 
+.saved-filters-list__first-time-button {
+    background: var(--color-accentedPalette-50);
+    border: 1px dashed var(--color-accentedPalette-300);
+    transition: background 0.3s ease;
+}
+
+.saved-filters-list__first-time-button:hover {
+    background: var(--color-accentedPalette-100) !important;
+}
+
 /* .saved-filters-tabs {
     --mdc-chip-container-shape-radius: 4px;
 } */

frontend/src/app/components/dashboard/db-table-view/saved-filters-panel/saved-filters-panel.component.html

@@ -2,6 +2,7 @@
     <app-placeholder-saved-filters *ngIf="savedFilterData === null"></app-placeholder-saved-filters>
     <div *ngIf="savedFilterData" class="saved-filters-list">
         <button *ngIf="accessLevel === 'edit' && savedFilterData?.length === 0"
+            class="saved-filters-list__first-time-button"
             mat-button type="button"
             angulartics2On="click"
             angularticsAction="Saved filters: first time setup is clicked"