fix: apply size to style directly to prevent warnings on size

homarr-labs · Aug 1, 2024 · b293783 · b293783
1 parent 26615d8
commit b293783
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 5 deletions.
diff --git a/packages/widgets/src/dns-hole/summary/component.tsx b/packages/widgets/src/dns-hole/summary/component.tsx
@@ -111,7 +111,7 @@ const StatCard = ({ item, data, usePiHoleColors }: StatCardProps) => {
         direction={isLong ? "row" : "column"}
         style={{ containerType: "size" }}
       >
-        <item.icon className="summary-card-icon" size="50cqmin" style={{ margin: "2cqmin" }} />
+        <item.icon className="summary-card-icon" style={{ margin: "2cqmin", height: "50cqmin", width: "50cqmin" }} />
         <Flex
           className="summary-card-texts"
           justify="center"

diff --git a/packages/widgets/src/modals/widget-edit-modal.tsx b/packages/widgets/src/modals/widget-edit-modal.tsx
@@ -49,7 +49,7 @@ export const WidgetEditModal = createModal<ModalProps<WidgetKind>>(({ actions, i
           objectEntries(widgetImports[innerProps.kind].definition.options).reduce(
             (acc, [key, value]: [string, { validate?: z.ZodType<unknown> }]) => {
               if (value.validate) {
-                acc[key] = value.validate;
+                acc[key] = value.validate.or(z.array(value.validate));
               }
 
               return acc;

diff --git a/packages/widgets/src/rssFeed/component.tsx b/packages/widgets/src/rssFeed/component.tsx
@@ -66,7 +66,7 @@ export default function RssFeed({ serverData, options }: WidgetComponentProps<"r
 
 const InfoDisplay = ({ date }: { date: string }) => (
   <Group gap="2.5cqmin">
-    <IconClock size="2.5cqmin" />
+    <IconClock style={{ height: "3cqmin", width: "3cqmin"}}/>
     <Text size="2.5cqmin" c="dimmed" pt="1cqmin">
       {date}
     </Text>

diff --git a/packages/widgets/src/weather/component.tsx b/packages/widgets/src/weather/component.tsx
@@ -82,7 +82,7 @@ const WeeklyForecast = ({ options, weather }: WeatherProps) => {
       <Group className="weather-forecast-city-temp-group" wrap="nowrap" gap="5cqmin">
         {options.showCity && (
           <>
-            <IconMapPin size="20cqmin" />
+            <IconMapPin style={{ height: "20cqmin", width: "20cqmin" }} />
             <Text size="15cqmin" style={{ whiteSpace: "nowrap" }}>
               {options.location.name}
             </Text>

diff --git a/packages/widgets/src/weather/icon.tsx b/packages/widgets/src/weather/icon.tsx
@@ -29,7 +29,7 @@ interface WeatherIconProps {
 export const WeatherIcon = ({ code, size = 50 }: WeatherIconProps) => {
   const { icon: Icon } = weatherDefinitions.find((definition) => definition.codes.includes(code)) ?? unknownWeather;
 
-  return <Icon style={{ float: "left" }} size={size} />;
+  return <Icon style={{ float: "left", height: size, width: size }} />;
 };
 
 interface WeatherDescriptionProps {