diff --git a/src/components/Article/CommentDate.module.scss b/src/components/Article/CommentDate.module.scss index 65f3983e..7f41f215 100644 --- a/src/components/Article/CommentDate.module.scss +++ b/src/components/Article/CommentDate.module.scss @@ -1,16 +1,17 @@ .commentDates { - @include font-size(1.2rem); - - flex: 1; - display: flex; - gap: 1rem; + color: #9fa1a7; align-items: center; - justify-content: flex-start; + display: flex; + flex: 1; + @include font-size(1.2rem); font-size: 1.2rem; + gap: 1rem; + justify-content: flex-start; margin: 0 1em 4px 0; - color: rgb(0 0 0 / 30%); .date { + font-weight: 500; + .icon { line-height: 1; width: 1rem; diff --git a/src/components/Article/FullArticle.tsx b/src/components/Article/FullArticle.tsx index 57ee81b4..61940471 100644 --- a/src/components/Article/FullArticle.tsx +++ b/src/components/Article/FullArticle.tsx @@ -33,6 +33,7 @@ import { Icon } from '../_shared/Icon' import { SolidSwiper } from '../_shared/SolidSwiper' import styles from './Article.module.scss' +import { CardTopic } from '../Feed/CardTopic' interface Props { article: Shout @@ -137,14 +138,7 @@ export const FullArticle = (props: Props) => {
- +

{props.article.title}

diff --git a/src/components/Feed/ArticleCard.module.scss b/src/components/Feed/ArticleCard.module.scss index 585a3175..6d4d9a22 100644 --- a/src/components/Feed/ArticleCard.module.scss +++ b/src/components/Feed/ArticleCard.module.scss @@ -93,6 +93,7 @@ } .shoutCardCover { + background: rgb(0 0 0 / 30%); height: 0; margin-bottom: 1.6rem; overflow: hidden; @@ -136,7 +137,8 @@ } .shoutDate { - color: rgb(0 0 0 / 50%); + color: #9fa1a7; + font-weight: 500; } .shoutDetails { @@ -401,6 +403,10 @@ } } + &.shoutCardNoImage { + background: rgb(0 0 0 / 50%); + } + &, a, .shoutCardTitle, @@ -775,7 +781,3 @@ .shoutTopicTop { margin-bottom: 0.4rem !important; } - -.shoutCardNoImage:not(.shoutCardFeed) { - background: rgb(0 0 0 / 50%); -} diff --git a/src/components/Feed/ArticleCard.tsx b/src/components/Feed/ArticleCard.tsx index 72310918..78d3bf5f 100644 --- a/src/components/Feed/ArticleCard.tsx +++ b/src/components/Feed/ArticleCard.tsx @@ -109,10 +109,12 @@ export const ArticleCard = (props: ArticleCardProps) => { [styles.shoutCardNoImage]: !cover }} > - +
- {title + + {title +
diff --git a/src/components/Feed/Beside.module.scss b/src/components/Feed/Beside.module.scss index 8adc5404..b26d4395 100644 --- a/src/components/Feed/Beside.module.scss +++ b/src/components/Feed/Beside.module.scss @@ -14,6 +14,10 @@ li { margin-bottom: 1.6rem; + &:last-child { + margin-bottom: 0; + } + &.top { border-bottom: 1px solid #e1e1e1; display: flex; diff --git a/src/components/Views/Feed.tsx b/src/components/Views/Feed.tsx index 952e1f3c..a0bf8254 100644 --- a/src/components/Views/Feed.tsx +++ b/src/components/Views/Feed.tsx @@ -150,29 +150,31 @@ export const FeedView = () => { {(article) => } -
-

{t('Popular authors')}

- - {t('All authors')} - - -
+
+
+

{t('Popular authors')}

+ + {t('All authors')} + + +
-
    - - {(author) => ( -
  • - -
  • - )} -
    -
+
    + + {(author) => ( +
  • + +
  • + )} +
    +
+
{(article) => }