fix(SW-2029): Opening hours styling

Approved-by: Matilda Landström

apps/scandic-web/components/OpeningHours/index.tsx

@@ -2,6 +2,7 @@ import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { getIntl } from "@/i18n"
 
+import Divider from "../TempDesignSystem/Divider"
 import AlternateOpeningHours from "./AlternateOpeningHours"
 import { getGroupedOpeningHours } from "./utils"
 
@@ -13,28 +14,24 @@ export default async function OpeningHours({
   openingHours,
   alternateOpeningHours,
   heading,
-  type = "default",
 }: OpeningHoursProps) {
   const intl = await getIntl()
-
   const groupedOpeningHours = getGroupedOpeningHours(openingHours, intl)
 
   return (
-    <div className={type === "default" ? styles.wrapper : ""}>
-      <Typography variant="Body/Paragraph/mdBold" className={styles.text}>
-        <h5>{heading ?? openingHours.name}</h5>
+    <div className={styles.wrapper}>
+      <Typography variant="Title/Overline/sm">
+        <h5 className={styles.heading}>{heading ?? openingHours.name}</h5>
+      </Typography>
+      <Divider color="Border/Divider/Default" />
+
+      <Typography variant="Body/Paragraph/mdRegular">
+        <div className={styles.text}>
+          {groupedOpeningHours.map((groupedOpeningHour) => (
+            <p key={groupedOpeningHour}>{groupedOpeningHour}</p>
+          ))}
+        </div>
       </Typography>
-      {groupedOpeningHours.map((groupedOpeningHour) => {
-        return (
-          <Typography
-            variant="Body/Paragraph/mdRegular"
-            className={styles.text}
-            key={groupedOpeningHour}
-          >
-            <p>{groupedOpeningHour}</p>
-          </Typography>
-        )
-      })}
       {alternateOpeningHours ? (
         <AlternateOpeningHours alternateOpeningHours={alternateOpeningHours} />
       ) : null}