style opening hours

This commit is contained in:
elise
2024-07-10 16:13:49 +02:00
parent 6288ffa050
commit 77a356834c
3 changed files with 57 additions and 11 deletions

View File

@ -4,6 +4,7 @@ import {
PrettyOpeningHours,
} from "@/lib/openinghours";
import styles from "./openingHoursSectionBlock.module.scss";
import { Fragment } from "react";
function OpeningHoursSubsection({
title,
@ -15,16 +16,20 @@ function OpeningHoursSubsection({
return (
<section className={styles.openingHoursSubsection}>
<h3>{title}</h3>
<ul>
{prettyHours.map(({ range, time, custom }) => (
<li key={range}>
<span className={styles.dayRange}>{range}</span>:&nbsp;
{time && <span className={styles.timeRange}>{time}</span>}
{custom && <span className={styles.timeRange}>{custom}</span>}
{!time && !custom && <span className={styles.closed}>Stengt</span>}
</li>
))}
</ul>
<table className="openingHours">
<tbody>
{prettyHours.map(({ range, time, custom }) => (
<tr key={range}>
<td className={styles.dayRange}>{range}</td>
<td>
{time && <span className={styles.timeRange}>{time}</span>}
{custom && <span className={styles.timeRange}>{custom}</span>}
{!time && !custom && <span className={styles.closed}>Stengt</span>}
</td>
</tr>
))}
</tbody>
</table>
</section>
);
}