fix(SW-3081): Removed color option from hotel logos to avoid wrong colors

Approved-by: Matilda Landström

packages/design-system/lib/components/Icons/Logos/DowntownCamper.tsx

@@ -1,17 +1,15 @@
 import type { LogoProps } from '../icon'
-import { iconVariants } from '../variants'
 
 export default function DowntownCamperIcon({
-  className,
-  color,
+  className = '',
   height = 30,
+  width = 123,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="123"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 123 30"
       fill="none"

packages/design-system/lib/components/Icons/Logos/GrandHotelOslo.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function GrandHotelOsloLogoIcon({
-  className,
-  color,
+  className = '',
   height = 30,
+  width = 69,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="69"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 69 30"
       fill="none"

packages/design-system/lib/components/Icons/Logos/Haymarket.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function HaymarketIcon({
-  className,
-  color,
+  className = '',
   height = 26,
+  width = 100,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="100"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 100 26"
       fill="none"

packages/design-system/lib/components/Icons/Logos/HotelNorge.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function HotelNorgeIcon({
-  className,
-  color,
+  className = '',
   height = 24,
+  width = 117,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="117"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 117 24"
       fill="none"

packages/design-system/lib/components/Icons/Logos/Marski.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function MarskiLogoIcon({
-  className,
-  color,
+  className = '',
   height = 30,
+  width = 92,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="92"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 92 30"
       fill="none"

packages/design-system/lib/components/Icons/Logos/ScandicGoLogo.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function ScandicGoLogoIcon({
-  className,
-  color,
+  className = '',
   height = 18,
+  width = 90,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="90"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 90 18"
       fill="none"

packages/design-system/lib/components/Icons/Logos/ScandicLogo.tsx

@@ -1,18 +1,15 @@
-import { iconVariants } from '../variants'
-
 import type { LogoProps } from '../icon'
 
 export default function ScandicLogoIcon({
-  className,
-  color,
+  className = '',
   height = 14,
+  width = 58,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
   return (
     <svg
-      className={classNames}
-      width="58"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 58 14"
       fill="none"

packages/design-system/lib/components/Icons/Logos/TheDock.tsx

@@ -1,18 +1,15 @@
 import type { LogoProps } from '../icon'
-import { iconVariants } from '../variants'
 
 export default function TheDockIcon({
-  className,
-  color,
+  className = '',
   height = 30,
+  width = 128,
   ...props
 }: LogoProps) {
-  const classNames = iconVariants({ className, color })
-
   return (
     <svg
-      className={classNames}
-      width="128"
+      className={className}
+      width={width}
       height={height}
       viewBox="0 0 128 30"
       fill="none"

packages/design-system/lib/components/Icons/Logos/index.tsx

@@ -51,6 +51,6 @@ export default function HotelLogoIcon({
     case SignatureHotelEnum.TheDock:
       return <TheDockIcon height={height} />
     default:
-      return <ScandicLogoIcon height={height} color="Icon/Interactive/Accent" />
+      return <ScandicLogoIcon height={height} />
   }
 }

packages/design-system/lib/components/Icons/icon.ts

@@ -15,8 +15,7 @@ export interface IllustrationProps
 }
 
 export interface LogoProps
-  extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
-    VariantProps<typeof iconVariants> {
+  extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'> {
   width?: string | number
   height?: string | number
 }