Better heat map calculation based on minimum tiles

This commit is contained in:
Ben Grant 2021-05-13 20:15:41 +10:00
parent 00b47e2656
commit 3b86432c73
3 changed files with 6 additions and 6 deletions

View file

@ -62,8 +62,8 @@ export const Time = styled.div`
`}
background-image: linear-gradient(
${props => `${props.theme.primary}${Math.round(((props.peopleCount-props.minPeople)/(props.maxPeople-props.minPeople))*255).toString(16)}`},
${props => `${props.theme.primary}${Math.round(((props.peopleCount-props.minPeople)/(props.maxPeople-props.minPeople))*255).toString(16)}`}
${props => `${props.theme.primary}${Math.round(((props.peopleCount)/(props.maxPeople))*255).toString(16)}`},
${props => `${props.theme.primary}${Math.round(((props.peopleCount)/(props.maxPeople))*255).toString(16)}`}
);
`;

View file

@ -21,11 +21,11 @@ const Legend = ({
<Label>{min}/{total} available</Label>
<Bar onMouseOut={() => onSegmentFocus(null)}>
{[...Array(max-min+1).keys()].map(i =>
{[...Array(max+1-min).keys()].map(i => i+min).map(i =>
<Grade
key={i}
color={`${theme.primary}${Math.round((i/(max-min))*255).toString(16)}`}
onMouseOver={() => onSegmentFocus(i+min)}
color={`${theme.primary}${Math.round((i/(max))*255).toString(16)}`}
onMouseOver={() => onSegmentFocus(i)}
/>
)}
</Bar>

View file

@ -286,7 +286,7 @@ const Event = (props) => {
{(!!event || isLoading) ? (
<>
<EventName isLoading={isLoading}>{event?.name}</EventName>
<EventDate isLoading={isLoading} title={event?.created && dayjs.unix(event?.created).format('h:mma D MMMM, YYYY')}>{event?.created && `Created ${dayjs.unix(event?.created).fromNow()}`}</EventDate>
<EventDate isLoading={isLoading} title={event?.created && dayjs.unix(event?.created).format('D MMMM, YYYY')}>{event?.created && `Created ${dayjs.unix(event?.created).fromNow()}`}</EventDate>
<ShareInfo
onClick={() => navigator.clipboard?.writeText(`https://crab.fit/${id}`)
.then(() => {