feat: implement local storage for sorting and dynamic sort icons on the new recipe sort card (#1506)

* added new sort icons

* added dynamic sort icons

* implemented local storage for sorting
and mobile card view

* fixed bug with local storage booleans

* added type hints

* bum vue use to use merge defaults

* use reactive localstorage

* add $vuetify type

* sort returns

* fix type error

Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>

frontend/utils/icons/icon-type.ts

@@ -78,6 +78,14 @@ export interface Icon {
   shareVariant: string;
   shuffleVariant: string;
   sort: string;
+  sortAscending: string;
+  sortDescending: string;
+  sortAlphabeticalAscending: string;
+  sortAlphabeticalDescending: string;
+  sortCalendarAscending: string;
+  sortCalendarDescending: string;
+  sortClockAscending: string;
+  sortClockDescending: string;
   star: string;
   testTube: string;
   tools: string;

frontend/utils/icons/icons.ts

@@ -45,6 +45,14 @@ import {
   mdiCodeJson,
   mdiCog,
   mdiSort,
+  mdiSortAscending,
+  mdiSortDescending,
+  mdiSortAlphabeticalAscending,
+  mdiSortAlphabeticalDescending,
+  mdiSortCalendarAscending,
+  mdiSortCalendarDescending,
+  mdiSortClockAscending,
+  mdiSortClockDescending,
   mdiOrderAlphabeticalAscending,
   mdiStar,
   mdiNewBox,
@@ -194,6 +202,14 @@ export const icons = {
   shareVariant: mdiShareVariant,
   shuffleVariant: mdiShuffleVariant,
   sort: mdiSort,
+  sortAscending: mdiSortAscending,
+  sortDescending: mdiSortDescending,
+  sortAlphabeticalAscending: mdiSortAlphabeticalAscending,
+  sortAlphabeticalDescending: mdiSortAlphabeticalDescending,
+  sortCalendarAscending: mdiSortCalendarAscending,
+  sortCalendarDescending: mdiSortCalendarDescending,
+  sortClockAscending: mdiSortClockAscending,
+  sortClockDescending: mdiSortClockDescending,
   star: mdiStar,
   testTube: mdiTestTube,
   tools: mdiTools,