Displaying Wpts description and start date

This commit is contained in:
Eric van der Vlist 2023-03-06 21:54:36 +01:00
parent e620db5c7b
commit c1f1c8afb0
2 changed files with 20 additions and 2 deletions

View File

@ -0,0 +1,8 @@
.description {
white-space: pre-wrap;
}
.date {
padding-top: 10px;
font-style: italic;
}

View File

@ -1,5 +1,5 @@
import { Button, IconButton } from '@suid/material';
import { Component, createSignal } from 'solid-js';
import { Component, createSignal, Show } from 'solid-js';
import WptIcon from '../../icons/location-pin-svgrepo-com.svg?component-solid';
import { peekCachedSignal } from '../../workers/cached-signals';
import dispatch from '../../workers/dispatcher-main';
@ -9,6 +9,7 @@ import WptEditButtonAndDialog from './WptEditButtonAndDialog';
import DeleteIcon from '@suid/icons-material/Delete';
import QuestionMarkIcon from '@suid/icons-material/QuestionMark';
import Alert from '../alert';
import style from './WptViewer.module.css';
interface Props {
wptId: string;
@ -69,7 +70,16 @@ const WptViewer: Component<Props> = ({ wptId }) => {
</div>
</>
}
content={undefined}
content={
<div>
<div class={style.description}>{wpt().desc}</div>
<Show when={wpt().extensions?.startTime}>
<div class={style.date}>
{new Date(wpt().extensions?.startTime).toLocaleDateString()}
</div>
</Show>
</div>
}
subTree={undefined}
/>
<Alert