feat: render shadows and markdown in changelogs

This commit is contained in:
Paul Makles 2023-02-22 18:33:38 +01:00
parent 7f911f5d2c
commit a00d554f80
No known key found for this signature in database
GPG key ID: 5059F398521BB0F6

View file

@ -1,5 +1,5 @@
import dayjs from "dayjs"; import dayjs from "dayjs";
import styled from "styled-components"; import styled, { css } from "styled-components";
import { Text } from "preact-i18n"; import { Text } from "preact-i18n";
import { useMemo, useState } from "preact/hooks"; import { useMemo, useState } from "preact/hooks";
@ -14,10 +14,17 @@ import {
changelogEntryArray, changelogEntryArray,
ChangelogPost, ChangelogPost,
} from "../../../assets/changelogs"; } from "../../../assets/changelogs";
import Markdown from "../../../components/markdown/Markdown";
import { ModalProps } from "../types"; import { ModalProps } from "../types";
const Image = styled.img` const Image = styled.img<{ shadow?: boolean }>`
border-radius: var(--border-radius); border-radius: var(--border-radius);
${(props) =>
props.shadow &&
css`
filter: drop-shadow(4px 4px 10px rgba(0, 0, 0, 0.5));
`}
`; `;
function RenderLog({ post }: { post: ChangelogPost }) { function RenderLog({ post }: { post: ChangelogPost }) {
@ -25,9 +32,9 @@ function RenderLog({ post }: { post: ChangelogPost }) {
<Column> <Column>
{post.content.map((entry) => {post.content.map((entry) =>
typeof entry === "string" ? ( typeof entry === "string" ? (
<span>{entry}</span> <Markdown content={entry} />
) : ( ) : (
<Image src={entry.src} /> <Image src={entry.src} shadow={entry.shadow} />
), ),
)} )}
</Column> </Column>