42 lines
1 KiB
TypeScript
42 lines
1 KiB
TypeScript
import styled from "styled-components"
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
|
import {
|
|
faBook,
|
|
faCalendar,
|
|
faHourglass,
|
|
} from "@fortawesome/free-solid-svg-icons"
|
|
|
|
import { FetchedPage } from "../../../types/types"
|
|
import theming from "../../styles/theming"
|
|
|
|
const StyledMetaContainer = styled.div`
|
|
color: ${(props) =>
|
|
theming.theme(props.theme.currentTheme, {
|
|
light: "#555",
|
|
dark: "#CCC",
|
|
})};
|
|
`
|
|
|
|
const Meta = (props: { fetchedPage: FetchedPage }) => {
|
|
return (
|
|
<StyledMetaContainer>
|
|
<FontAwesomeIcon icon={faCalendar} />
|
|
|
|
{props.fetchedPage.date || "Unknown date"}
|
|
|
|
<FontAwesomeIcon icon={faHourglass} />
|
|
|
|
{props.fetchedPage.readTime
|
|
? props.fetchedPage.readTime + " read"
|
|
: "unknown length"}
|
|
|
|
<FontAwesomeIcon icon={faBook} />
|
|
|
|
{props.fetchedPage.wordCount
|
|
? props.fetchedPage.wordCount + " words"
|
|
: "unknown words"}
|
|
</StyledMetaContainer>
|
|
)
|
|
}
|
|
|
|
export default Meta
|