acid-info/logos-press-engine
1
0
Fork 0
mirror of https://github.com/acid-info/logos-press-engine.git synced 2025-02-22 06:08:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: fix post label and stats formatting, fixes #99

Browse Source
This commit is contained in:
Hossein Mehrabi 2023-08-26 20:47:43 +03:30
parent 1009855cfc
commit 6387bb7b4b
No known key found for this signature in database
GPG Key ID: 45C04964191AFAA1
2 changed files with 41 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/Article/Article.Stats.tsx
View File

@ -10,17 +10,21 @@ const ArticleStats = ({
}) => ( }) => (
<Row> <Row>
<Typography variant="body3" genericFontFamily="sans-serif"> <Typography variant="body3" genericFontFamily="sans-serif">
{readingLength} minutes read {readingLength} MIN
</Typography>
<Typography variant="body3">•</Typography>
<Typography variant="body3" genericFontFamily="sans-serif">
{date &&
date.toLocaleString('en-GB', {
day: 'numeric',
month: 'long', // TODO: Should be uppercase
year: 'numeric',
})}
</Typography> </Typography>
{date && (
<>
<Typography variant="body3">•</Typography>
<Date variant="body3" genericFontFamily="sans-serif">
{date &&
date.toLocaleString('en-GB', {
day: 'numeric',
month: 'short',
year: 'numeric',
})}
</Date>
</>
)}
</Row> </Row>
) )
@ -32,4 +36,8 @@ const Row = styled.div`
margin-bottom: 12px; margin-bottom: 12px;
` `
const Date = styled(Typography)`
text-transform: uppercase;
`
export default ArticleStats export default ArticleStats

41
src/components/PostCard/PostCard.Label.tsx
View File

@ -1,7 +1,7 @@
import { Typography } from '@acid-info/lsd-react'
import React, { FC } from 'react'
import styled from '@emotion/styled'
import { LPE } from '@/types/lpe.types' import { LPE } from '@/types/lpe.types'
import { Typography } from '@acid-info/lsd-react'
import styled from '@emotion/styled'
import React, { FC } from 'react'
import PostType = LPE.PostType import PostType = LPE.PostType
export type Props = React.ComponentProps<typeof Container> & { export type Props = React.ComponentProps<typeof Container> & {
@ -21,21 +21,22 @@ export const PostCardLabel: FC<Props> = ({
<Typography variant="body3" genericFontFamily="sans-serif"> <Typography variant="body3" genericFontFamily="sans-serif">
{contentType.toUpperCase()} {contentType.toUpperCase()}
</Typography> </Typography>
{date && (
<Typography variant="body3">•</Typography> <>
<Typography variant="body3">•</Typography>
<Typography variant="body3" genericFontFamily="sans-serif"> <Date variant="body3" genericFontFamily="sans-serif">
{date && {date.toLocaleString('en-GB', {
date.toLocaleString('en-GB', { day: 'numeric',
day: 'numeric', month: 'short',
month: 'long', // TODO: Should be uppercase ...(displayYear
...(displayYear ? {
? { year: 'numeric',
year: 'numeric', }
} : {}),
: {}), })}
})} </Date>
</Typography> </>
)}
</Container> </Container>
) )
} }
@ -46,3 +47,7 @@ const Container = styled.div`
align-items: center; align-items: center;
gap: 8px; gap: 8px;
` `
const Date = styled(Typography)`
text-transform: uppercase;
`