Merged in feat/SW-1711-switch-icons (pull request #1558)

Switches out all the old icons to new ones, and moves them to the design system. The new icons are of three different types: Materialise Symbol, Nucleo, and Customized. Also adds further mapping between facilities/amenities and icons.

Approved-by: Michael Zetterberg
Approved-by: Erik Tiekstra

apps/scandic-web/components/Forms/BookingWidget/FormContent/index.tsx

@@ -2,11 +2,12 @@
 import { useFormContext, useWatch } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
 import DatePicker from "@/components/DatePicker"
 import GuestsRoomsPickerForm from "@/components/GuestsRoomsPicker"
-import { SearchIcon } from "@/components/Icons"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -77,7 +78,7 @@ export default function FormContent({
             type="submit"
           >
             <span className={styles.icon}>
-              <SearchIcon color="white" width={28} height={28} />
+              <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
             </span>
           </Button>
         </div>
@@ -109,7 +110,7 @@ export default function FormContent({
               <span>{intl.formatMessage({ id: "Search" })}</span>
             </Caption>
             <span className={styles.icon}>
-              <SearchIcon color="white" width={28} height={28} />
+              <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
             </span>
           </Button>
         </div>
@@ -163,7 +164,7 @@ export function BookingWidgetFormContentSkeleton() {
             <span>{intl.formatMessage({ id: "Search" })}</span>
           </Caption>
           <span className={styles.icon}>
-            <SearchIcon color="white" width={28} height={28} />
+            <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
           </span>
         </Button>
       </div>