diff --git a/src/components/Article/Header/Article.Header.tsx b/src/components/Article/Header/Article.Header.tsx
index 595cceb..c40f3bb 100644
--- a/src/components/Article/Header/Article.Header.tsx
+++ b/src/components/Article/Header/Article.Header.tsx
@@ -6,9 +6,9 @@ import { PostImageRatio } from '../../Post/Post'
import ArticleStats from '../Article.Stats'
import { Typography } from '@acid-info/lsd-react'
import styled from '@emotion/styled'
-import ArticleTags from './Article.Tags'
import ArticleSummary from './Article.Summary'
import { Authors } from '@/components/Authors'
+import { Tags } from '@/components/Tags'
const ArticleHeader = ({
title,
@@ -41,8 +41,16 @@ const ArticleHeader = ({
>
{title}
- {subtitle && {subtitle}}
-
+ {subtitle && (
+
+ {subtitle}
+
+ )}
+
@@ -62,7 +70,9 @@ const ArticleTitle = styled(CustomTypography)`
margin-bottom: 24px;
`
-const ArticleSubtitle = styled(CustomTypography)``
+const ArticleSubtitle = styled(CustomTypography)`
+ margin-bottom: 16px;
+`
const AuthorsContainer = styled.div`
margin-block: 24px;
diff --git a/src/components/Post/Post.tsx b/src/components/Post/Post.tsx
index 9575992..c196d8f 100644
--- a/src/components/Post/Post.tsx
+++ b/src/components/Post/Post.tsx
@@ -1,4 +1,4 @@
-import { Tag, Typography } from '@acid-info/lsd-react'
+import { Typography } from '@acid-info/lsd-react'
import { CommonProps } from '@acid-info/lsd-react/dist/utils/useCommonProps'
import styled from '@emotion/styled'
import Image from 'next/image'
@@ -11,6 +11,7 @@ import {
} from '@/lib/unbody/unbody.types'
import { Authors } from '../Authors'
import { UnbodyGraphQl } from '@/lib/unbody/unbody-content.types'
+import { Tags } from '@/components/Tags'
export enum PostImageRatio {
PORTRAIT = 'portrait',
@@ -174,15 +175,7 @@ export default function Post({
)}
- {tags.length > 0 && (
-
- {tags.map((tag) => (
-
- {tag}
-
- ))}
-
- )}
+ {tags.length > 0 && }
)
}
@@ -224,11 +217,6 @@ const CustomTypography = styled(Typography)`
overflow: hidden;
word-break: break-word;
`
-const TagContainer = styled.div`
- display: flex;
- gap: 8px;
- overflow-x: auto;
-`
const PodcastAuthor = styled.div`
display: flex;
diff --git a/src/components/Article/Header/Article.Tags.tsx b/src/components/Tags/Tags.tsx
similarity index 77%
rename from src/components/Article/Header/Article.Tags.tsx
rename to src/components/Tags/Tags.tsx
index 81bc22a..7c5e4e1 100644
--- a/src/components/Article/Header/Article.Tags.tsx
+++ b/src/components/Tags/Tags.tsx
@@ -1,7 +1,7 @@
import { Tag } from '@acid-info/lsd-react'
import styled from '@emotion/styled'
-const ArticleTags = ({ tags }: { tags: string[] }) =>
+const Tags = ({ tags }: { tags: string[] }) =>
tags.length > 0 ? (
{tags.map((tag) => (
@@ -15,7 +15,6 @@ const ArticleTags = ({ tags }: { tags: string[] }) =>
const TagContainer = styled.div`
display: flex;
gap: 8px;
- margin-top: 16px;
`
-export default ArticleTags
+export default Tags
diff --git a/src/components/Tags/index.tsx b/src/components/Tags/index.tsx
new file mode 100644
index 0000000..5c27918
--- /dev/null
+++ b/src/components/Tags/index.tsx
@@ -0,0 +1 @@
+export { default as Tags } from './Tags'