diff --git a/src/components/Blog/BlogArticle/BlogArticle.style.ts b/src/components/Blog/BlogArticle/BlogArticle.style.ts
index 0eed1363b..b228b07a2 100644
--- a/src/components/Blog/BlogArticle/BlogArticle.style.ts
+++ b/src/components/Blog/BlogArticle/BlogArticle.style.ts
@@ -170,11 +170,11 @@ export const BlogArticleContentContainer = styled(Box)(({ theme }) => ({
},
[theme.breakpoints.up('sm' as Breakpoint)]: {
- margin: theme.spacing(4, 'auto'),
+ margin: theme.spacing(0, 'auto'),
maxWidth: '100%',
},
[theme.breakpoints.up('md' as Breakpoint)]: {
- margin: theme.spacing(8, 'auto'),
+ margin: theme.spacing(0, 'auto'),
maxWidth: '100%',
},
[theme.breakpoints.up('lg' as Breakpoint)]: {
@@ -195,10 +195,10 @@ export const BlogMetaContainer = styled(Box)(({ theme }) => ({
display: 'flex',
justifyContent: 'space-between',
alignItems: 'flex-start',
- marginTop: theme.spacing(8),
gap: theme.spacing(2),
flexDirection: 'column',
[theme.breakpoints.up('sm' as Breakpoint)]: {
+ marginTop: theme.spacing(8),
alignItems: 'center',
flexDirection: 'row',
},
diff --git a/src/components/Blog/BlogArticle/BlogArticle.tsx b/src/components/Blog/BlogArticle/BlogArticle.tsx
index 39600c4cb..16d6d6caf 100644
--- a/src/components/Blog/BlogArticle/BlogArticle.tsx
+++ b/src/components/Blog/BlogArticle/BlogArticle.tsx
@@ -75,58 +75,72 @@ export const BlogArticle = ({
return (
<>
-
- {!!tags?.data[0]?.attributes.Title ? (
-
- {tags.data[0].attributes?.Title}
-
- ) : (
-
- )}
- {!!createdAt ? (
-
-
- {formatDate(publishedAt || createdAt)}
-
- {t('blog.minRead', { minRead: minRead })}
-
- ) : (
-
- )}
-
- {title ? (
- {title}
- ) : (
-
- )}
-
-
- {author?.data?.attributes?.Avatar.data?.attributes?.url ? (
-
+
+
+ {tags?.data[0]?.attributes.Title ? (
+
+ {tags.data[0].attributes?.Title}
+
) : (
-
+
)}
- {author?.data ? (
-
- {author.data?.attributes.Name}
-
+ {createdAt ? (
+
+
+ {formatDate(publishedAt || createdAt)}
+
+ {t('blog.minRead', { minRead: minRead })}
+
) : (
-
+
)}
-
-
-
-
+
+ {title ? (
+ {title}
+ ) : (
+
+ )}
+
+ {subtitle ? (
+
+ {subtitle}
+
+ ) : (
+
+ )}
+
+
+
+ {author?.data?.attributes?.Avatar.data?.attributes?.url ? (
+
+ ) : (
+
+ )}
+ {author?.data ? (
+
+ {author.data?.attributes.Name}
+
+ ) : (
+
+ )}
+
+
+
+
+
{image?.data && (
- {subtitle ? (
-
- {subtitle}
-
- ) : (
-
- )}
{content ? (