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
This commit is contained in:
Matilda Landström
2025-03-27 09:42:52 +00:00
parent 93c7fe64bf
commit 5de2a993a7
524 changed files with 4442 additions and 6802 deletions

View File

@@ -3,7 +3,8 @@
import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { ErrorCircleIcon } from "@/components/Icons"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import Select from "@/components/TempDesignSystem/Select"
import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -120,14 +121,14 @@ export default function ChildInfoSelector({
{roomErrors && roomErrors.message ? (
<Caption color="red" className={styles.error}>
<ErrorCircleIcon color="red" />
<MaterialIcon icon="error" color="Icon/Interactive/Accent" />
{roomErrors.message}
</Caption>
) : null}
{ageError || bedError ? (
<Caption color="red" className={styles.error}>
<ErrorCircleIcon color="red" />
<MaterialIcon icon="error" color="Icon/Interactive/Accent" />
{errorMessage}
</Caption>
) : null}

View File

@@ -1,6 +1,7 @@
"use client"
import { MinusIcon, PlusIcon } from "@/components/Icons"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
@@ -27,7 +28,7 @@ export default function Counter({
wrapping={true}
disabled={disableDecrease}
>
<MinusIcon color="burgundy" />
<MaterialIcon icon="remove" color="CurrentColor" />
</Button>
<Body color="baseTextHighContrast" textAlign="center">
{count}
@@ -42,7 +43,7 @@ export default function Counter({
size="small"
disabled={disableIncrease}
>
<PlusIcon color="burgundy" />
<MaterialIcon icon="add" color="CurrentColor" />
</Button>
</div>
)

View File

@@ -4,9 +4,10 @@ import { useCallback, useEffect } from "react"
import { useFormContext, useWatch } from "react-hook-form"
import { useIntl } from "react-intl"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import { REDEMPTION } from "@/constants/booking"
import { CloseLargeIcon, PlusCircleIcon, PlusIcon } from "../Icons"
import Button from "../TempDesignSystem/Button"
import { Tooltip } from "../TempDesignSystem/Tooltip"
import { GuestsRoom } from "./GuestsRoom"
@@ -83,7 +84,7 @@ export default function GuestsRoomsPickerDialog({
<section className={styles.contentWrapper}>
<header className={styles.header}>
<button type="button" className={styles.close} onClick={onClose}>
<CloseLargeIcon />
<MaterialIcon icon="close" />
</button>
</header>
@@ -113,7 +114,7 @@ export default function GuestsRoomsPickerDialog({
onPress={handleAddRoom}
disabled
>
<PlusIcon />
<MaterialIcon icon="add" color="CurrentColor" />
{addRoomLabel}
</Button>
</Tooltip>
@@ -129,7 +130,7 @@ export default function GuestsRoomsPickerDialog({
fullWidth
onPress={handleAddRoom}
>
<PlusIcon />
<MaterialIcon icon="add" color="CurrentColor" />
{addRoomLabel}
</Button>
</div>
@@ -153,7 +154,7 @@ export default function GuestsRoomsPickerDialog({
disabled
onPress={handleAddRoom}
>
<PlusCircleIcon />
<MaterialIcon icon="add_circle" color="CurrentColor" />
{addRoomLabel}
</Button>
</Tooltip>
@@ -168,7 +169,7 @@ export default function GuestsRoomsPickerDialog({
theme="base"
onPress={handleAddRoom}
>
<PlusCircleIcon />
<MaterialIcon icon="add_circle" color="CurrentColor" />
{addRoomLabel}
</Button>
</div>

View File

@@ -1,6 +1,7 @@
import { useIntl } from "react-intl"
import { DeleteIcon } from "@/components/Icons"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
import Button from "@/components/TempDesignSystem/Button"
import Divider from "@/components/TempDesignSystem/Divider"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -63,7 +64,7 @@ export function GuestsRoom({
size="small"
className={styles.roomActionsButton}
>
<DeleteIcon color="red" />
<MaterialIcon icon="delete" color="CurrentColor" />
<span className={styles.roomActionsLabel}>
{intl.formatMessage({ id: "Remove room" })}
</span>