From 180db86fd2727a19fcb0dce0b4ba60b8ab49f66a Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Fri, 18 Nov 2022 21:54:32 +0300 Subject: [PATCH 1/3] Added search component to the all authors page --- src/components/Views/AllAuthors.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/src/components/Views/AllAuthors.tsx b/src/components/Views/AllAuthors.tsx index 91db2bd3..9afe63b8 100644 --- a/src/components/Views/AllAuthors.tsx +++ b/src/components/Views/AllAuthors.tsx @@ -9,6 +9,7 @@ import styles from '../../styles/AllTopics.module.scss' import { clsx } from 'clsx' import { useSession } from '../../context/session' import { locale } from '../../stores/ui' +import { SearchField } from '../_shared/SearchField' type AllAuthorsPageSearchParams = { by: '' | 'name' | 'shouts' | 'rating' @@ -50,6 +51,11 @@ export const AllAuthorsView = (props: Props) => { return keys }) + // TODO make search + const searchAuthors = (value) => { + let q = value.toLowerCase() + } + const showMore = () => setLimit((oldLimit) => oldLimit + PAGE_SIZE) return ( @@ -72,10 +78,7 @@ export const AllAuthorsView = (props: Props) => { {t('By alphabet')}
  • - - - {t('Search author')} - +
    • From 9f537a75c1dc7475137e98e4e3ad1de838224175 Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Sat, 19 Nov 2022 16:04:42 +0300 Subject: [PATCH 2/3] Fixed alltopics and all authors page style --- src/components/Views/AllAuthors.tsx | 38 +++++++------- src/components/Views/AllTopics.tsx | 81 +++++++++++++---------------- src/styles/AllTopics.module.scss | 16 +++--- 3 files changed, 65 insertions(+), 70 deletions(-) diff --git a/src/components/Views/AllAuthors.tsx b/src/components/Views/AllAuthors.tsx index 9afe63b8..66e483ec 100644 --- a/src/components/Views/AllAuthors.tsx +++ b/src/components/Views/AllAuthors.tsx @@ -59,29 +59,27 @@ export const AllAuthorsView = (props: Props) => { const showMore = () => setLimit((oldLimit) => oldLimit + PAGE_SIZE) return ( -
    +
    0}>
    -
    -
    -

    {t('Authors')}

    -

    {t('Subscribe who you like to tune your personal feed')}

    +
    +

    {t('Authors')}

    +

    {t('Subscribe who you like to tune your personal feed')}

    - -
    +
    { } const AllTopicsHead = () => ( -
    -
    -

    {t('Topics')}

    -

    {t('Subscribe what you like to tune your personal feed')}

    +
    +

    {t('Topics')}

    +

    {t('Subscribe what you like to tune your personal feed')}

    - -
    +
    ) return ( -
    +
    0 || searchResults().length > 0}> -
    -
    -
      - - {(letter, index) => ( -
    • - - {letter} - - {letter} -
      • - )} -       -
    -
    +
    +
      + + {(letter, index) => ( +
    • + + {letter} + + {letter} +
      • + )} +       +
    @@ -183,9 +179,8 @@ export const AllTopicsView = (props: AllTopicsViewProps) => { {(topic) => (
    -
    - {topic.title} -
    + {topic.title} + {topic.stat.shouts}
    )}     @@ -238,12 +233,10 @@ export const AllTopicsView = (props: AllTopicsViewProps) => { limit()}> -
    -
    - -
    +
    +
    diff --git a/src/styles/AllTopics.module.scss b/src/styles/AllTopics.module.scss index ef536a42..3a79472d 100644 --- a/src/styles/AllTopics.module.scss +++ b/src/styles/AllTopics.module.scss @@ -1,6 +1,6 @@ .allTopicsPage { .group { - font-weight: bold; + @include font-size(1.6rem); margin: 3em 0 9.6rem; @include media-breakpoint-down(sm) { @@ -17,11 +17,7 @@ } .topic { - margin-bottom: 1.6rem; - - @include media-breakpoint-down(sm) { - margin-left: 2.6rem; - } + margin-bottom: 2.4rem; } } @@ -54,6 +50,7 @@ } .alphabet { + color: rgba(0, 0, 0, 0.2); display: flex; flex-wrap: wrap; font-weight: 700; @@ -66,3 +63,10 @@ margin-right: 3%; } } + +.articlesCounter { + @include font-size(1.2rem); + + margin-left: 0.5em; + vertical-align: super; +} From 94f9e77203f68a5bde3d25c2fcaa0560f854ca0a Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Mon, 21 Nov 2022 00:23:12 +0300 Subject: [PATCH 3/3] Style fixes --- src/components/Discours/Banner.module.scss | 5 - src/components/Discours/Banner.tsx | 28 +++-- src/components/Discours/Footer.module.scss | 6 - src/components/Discours/Footer.tsx | 2 +- src/components/Discours/Hero.scss | 4 - src/components/Discours/Hero.tsx | 58 ++++----- src/components/Discours/Subscribe.module.scss | 4 + src/components/Feed/Beside.tsx | 118 +++++++++--------- src/components/Feed/Group.tsx | 112 +++++++++-------- src/components/Feed/Row1.tsx | 8 +- src/components/Feed/Row2.tsx | 35 +++--- src/components/Feed/Row3.tsx | 20 +-- src/components/Feed/Row5.tsx | 24 ++-- src/components/Feed/RowShort.tsx | 34 ++--- src/components/Feed/Slider.tsx | 56 +++++---- src/components/Views/AllAuthors.tsx | 86 +++++++------ src/components/Views/AllTopics.tsx | 36 +++--- src/styles/app.scss | 17 ++- 18 files changed, 331 insertions(+), 322 deletions(-) diff --git a/src/components/Discours/Banner.module.scss b/src/components/Discours/Banner.module.scss index 5a8bfc89..667b4a79 100644 --- a/src/components/Discours/Banner.module.scss +++ b/src/components/Discours/Banner.module.scss @@ -29,13 +29,8 @@ display: flex; flex-direction: column; justify-content: center; - padding-left: 0; padding-top: 1em; - @include media-breakpoint-up(sm) { - padding-left: $grid-gutter-width; - } - a { display: inline-block; margin: 0 1em 1em 0; diff --git a/src/components/Discours/Banner.tsx b/src/components/Discours/Banner.tsx index f14d2a8e..ed9bd925 100644 --- a/src/components/Discours/Banner.tsx +++ b/src/components/Discours/Banner.tsx @@ -6,19 +6,21 @@ import { clsx } from 'clsx' export default () => { return (
    -
    -
    -

    {t('Discours is created with our common effort')}

    -

    - {t('Support us')} - {t('Become an author')} - showModal('auth')}> - {t('Join the community')} - -

    -
    -
    - {t('Discours')} +
    +
    +
    +

    {t('Discours is created with our common effort')}

    +

    + {t('Support us')} + {t('Become an author')} + showModal('auth')}> + {t('Join the community')} + +

    +
    +
    + {t('Discours')} +
    diff --git a/src/components/Discours/Footer.module.scss b/src/components/Discours/Footer.module.scss index 990b9ed6..624d5a47 100644 --- a/src/components/Discours/Footer.module.scss +++ b/src/components/Discours/Footer.module.scss @@ -34,12 +34,6 @@ margin-top: 0.8rem; } - .wideContainer { - @include media-breakpoint-down(sm) { - padding: 0 $container-padding-x; - } - } - ::selection { background: #fff; color: #000; diff --git a/src/components/Discours/Footer.tsx b/src/components/Discours/Footer.tsx index 1f5fe364..f22423d3 100644 --- a/src/components/Discours/Footer.tsx +++ b/src/components/Discours/Footer.tsx @@ -109,7 +109,7 @@ export const Footer = () => { ] return (