Changed session weekly to dots.

This commit is contained in:
Mike Cao 2024-08-18 10:38:28 -07:00
parent ceacc25021
commit e98bc3bd74
2 changed files with 8 additions and 3 deletions

View File

@ -21,10 +21,11 @@
.cell {
display: flex;
background-color: var(--base100);
background-color: var(--base75);
width: 20px;
height: 20px;
margin: auto;
border-radius: 100%;
align-items: start;
}
@ -38,5 +39,5 @@
background-color: var(--primary400);
width: 20px;
height: 20px;
border-radius: 3px;
border-radius: 100%;
}

View File

@ -55,6 +55,7 @@ export function SessionsWeekly({ websiteId }: { websiteId: string }) {
{format(getDayOfWeekAsDate(index), 'EEE', { locale: dateLocale })}
</div>
{day?.map((hour: number) => {
const pct = hour / max;
return (
<div key={hour} className={classNames(styles.cell)}>
{hour > 0 && (
@ -62,7 +63,10 @@ export function SessionsWeekly({ websiteId }: { websiteId: string }) {
label={`${formatMessage(labels.visitors)}: ${hour}`}
position="right"
>
<div className={styles.block} style={{ opacity: hour / max }} />
<div
className={styles.block}
style={{ opacity: pct, transform: `scale(${pct})` }}
/>
</TooltipPopup>
)}
</div>