scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in fix/icons (pull request #3468)

Browse Source 
feat(SW-3695): more icons fixes...

* feat(SW-3695): more icons fixes...
This commit is contained in:
Linus Flood
2026-01-21 12:34:24 +00:00
parent 1bb2b72b2f
commit 2d8df528ac
5 changed files with 17 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/booking-flow/lib/components/BookingWidget/BookingWidgetForm/FormContent/ValidationError/index.tsx
View File

@@ -15,11 +15,7 @@ export default function ValidationError() {
variant="Body/Supporting text (caption)/smBold" variant="Body/Supporting text (caption)/smBold"
> >
<span> <span>
<MaterialIcon <MaterialIcon icon="error" color="Icon/Feedback/Error" size={20} />
icon="error_circle_rounded"
color="Icon/Feedback/Error"
size={20}
/>
{intl.formatMessage({ {intl.formatMessage({
id: "bookingWidget.validationError.destination", id: "bookingWidget.validationError.destination",
defaultMessage: "Enter destination or hotel", defaultMessage: "Enter destination or hotel",

6
packages/booking-flow/lib/components/BookingWidget/GuestsRoomsPicker/ValidationError/index.tsx
View File

@@ -20,11 +20,7 @@ export default function ValidationError() {
variant="Body/Supporting text (caption)/smBold" variant="Body/Supporting text (caption)/smBold"
> >
<span> <span>
<MaterialIcon <MaterialIcon icon="error" color="Icon/Feedback/Error" size={20} />
icon="error_circle_rounded"
color="Icon/Feedback/Error"
size={20}
/>
{errorMessage} {errorMessage}
</span> </span>
</Typography> </Typography>

6
packages/booking-flow/lib/components/SelectRate/RoomsContainer/Rooms/RoomsList/RoomListItem/RoomNotAvailable/index.tsx
View File

@@ -11,11 +11,7 @@ export default function RoomNotAvailable() {
return ( return (
<div className={styles.noRoomsContainer}> <div className={styles.noRoomsContainer}>
<div className={styles.noRooms}> <div className={styles.noRooms}>
<MaterialIcon <MaterialIcon icon="error" color="Icon/Feedback/Error" size={16} />
icon="error_circle_rounded"
color="Icon/Feedback/Error"
size={16}
/>
<Typography variant="Body/Paragraph/mdRegular"> <Typography variant="Body/Paragraph/mdRegular">
<p> <p>
{intl.formatMessage({ {intl.formatMessage({

7
packages/design-system/lib/components/Icons/MaterialIcon/index.module.css Normal file
View File

@@ -0,0 +1,7 @@
.iconWrapper {
display: inline-flex;
align-items: center;
justify-content: center;
line-height: 0;
flex-shrink: 0;
}

8
packages/design-system/lib/components/Icons/MaterialIcon/index.tsx
View File

@@ -2,6 +2,7 @@ import { HTMLAttributes } from "react"
import { MaterialIconName, materialIcons } from "./generated" import { MaterialIconName, materialIcons } from "./generated"
import { VariantProps } from "class-variance-authority" import { VariantProps } from "class-variance-authority"
import { iconVariants } from "../variants" import { iconVariants } from "../variants"
import styles from "./index.module.css"
export interface MaterialIconProps export interface MaterialIconProps
extends extends
@@ -51,7 +52,12 @@ export function MaterialIcon({
const iconClassName = iconVariants({ color }) const iconClassName = iconVariants({ color })
return ( return (
<span data-testid="MaterialIcon" data-icon-name={icon} {...props}> <span
data-testid="MaterialIcon"
data-icon-name={icon}
className={`${styles.iconWrapper}`}
{...props}
>
<IconComponent <IconComponent
width={size} width={size}
height={size} height={size}