From e72a8ded30f6b4abba15dd85d907d70d1de67178 Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Wed, 7 Jun 2023 00:16:40 +0300 Subject: [PATCH] Fixed sidebar style on the feed page --- public/icons/hash.svg | 4 +++ public/locales/en/translation.json | 4 +-- public/locales/ru/translation.json | 8 ++--- .../Feed/Sidebar/Sidebar.module.scss | 18 +++++++++-- src/components/Feed/Sidebar/Sidebar.tsx | 32 ++++++++++++------- src/components/Views/Feed.module.scss | 6 ++-- 6 files changed, 47 insertions(+), 25 deletions(-) create mode 100644 public/icons/hash.svg diff --git a/public/icons/hash.svg b/public/icons/hash.svg new file mode 100644 index 00000000..1c9a012e --- /dev/null +++ b/public/icons/hash.svg @@ -0,0 +1,4 @@ + + + diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 8a0b11c0..e22e6509 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -290,7 +290,7 @@ "community": "community", "delimiter": "delimiter", "discussion": "discourse", - "discussions": "discussions", + "Discussions": "Discussions", "drafts": "drafts", "email not confirmed": "email not confirmed", "enter": "enter", @@ -307,7 +307,7 @@ "marker list": "marker list", "music": "music", "my feed": "my ribbon", - "notifications": "notifications", + "Notifications": "Notifications", "number list": "number list", "personal data usage and email notifications": "to process personal data and receive email notifications", "post": "post", diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json index cf8af412..bd9bafde 100644 --- a/public/locales/ru/translation.json +++ b/public/locales/ru/translation.json @@ -289,7 +289,7 @@ "You've reached a non-existed page": "Вы попали на несуществующую страницу", "You've successfully logged out": "Вы успешно вышли из аккаунта", "Your name will appear on your profile page and as your signature in publications, comments and responses.": "Ваше имя появится на странице вашего профиля и как ваша подпись в публикациях, комментариях и откликах", - "accomplices": "соучастники", + "Accomplices": "Соучастники", "actions": "действия", "add link": "добавить ссылку", "all topics": "все темы", @@ -308,13 +308,13 @@ "delimiter": "разделитель", "discourse_theme": "Тема дискурса", "discussion": "дискурс", - "discussions": "дискуссии", + "Discussions": "Дискуссии", "drafts": "черновики", "email not confirmed": "email не подтвержден", "enter": "войдите", "feed": "лента", "follower": "подписчик", - "general feed": "общая лента", + "general feed": "Общая лента", "header 1": "заголовок 1", "header 2": "заголовок 2", "header 3": "заголовок 3", @@ -325,7 +325,7 @@ "marker list": "маркир. список", "music": "музыка", "my feed": "моя лента", - "notifications": "уведомления", + "Notifications": "Уведомления", "number list": "нумер. список", "or": "или", "personal data usage and email notifications": "на обработку персональных данных и на получение почтовых уведомлений", diff --git a/src/components/Feed/Sidebar/Sidebar.module.scss b/src/components/Feed/Sidebar/Sidebar.module.scss index 8a0db25c..600dc052 100644 --- a/src/components/Feed/Sidebar/Sidebar.module.scss +++ b/src/components/Feed/Sidebar/Sidebar.module.scss @@ -11,7 +11,6 @@ } .sidebarItemName { - margin-right: 0.5em; position: relative; overflow: hidden; text-overflow: ellipsis; @@ -19,7 +18,6 @@ .counter { @include font-size(1.2rem); - align-items: center; align-self: flex-start; background: #f6f6f6; @@ -78,6 +76,7 @@ height: 2rem; margin-right: 0.5em; vertical-align: middle; + text-align: center; width: 2.2rem; img { @@ -90,7 +89,7 @@ h4 { @include font-size(1.2rem); - + font-weight: bold; color: #9fa1a7; cursor: pointer; letter-spacing: 0.05em; @@ -119,3 +118,16 @@ display: none; } } + +.subscriptions { + .icon { + text-align: center; + + img { + display: inline-block; + height: 1.6rem; + vertical-align: middle; + width: 1.6rem; + } + } +} diff --git a/src/components/Feed/Sidebar/Sidebar.tsx b/src/components/Feed/Sidebar/Sidebar.tsx index 29521c53..c82904c1 100644 --- a/src/components/Feed/Sidebar/Sidebar.tsx +++ b/src/components/Feed/Sidebar/Sidebar.tsx @@ -8,6 +8,7 @@ import { useSeenStore } from '../../../stores/zine/seen' import { useSession } from '../../../context/session' import { useLocalize } from '../../../context/localize' import styles from './Sidebar.module.scss' +import { clsx } from 'clsx' type FeedSidebarProps = { authors: Author[] @@ -28,7 +29,7 @@ export const Sidebar = (props: FeedSidebarProps) => { const { authorEntities } = useAuthorsStore({ authors: props.authors }) const { articlesByTopic } = useArticlesStore() const { topicEntities } = useTopicsStore() - const [isSubscriptionsVisible, setSubscriptionsVisible] = createSignal(false) + const [isSubscriptionsVisible, setSubscriptionsVisible] = createSignal(true) const checkTopicIsSeen = (topicSlug: string) => { return articlesByTopic()[topicSlug]?.every((article) => Boolean(seen()[article.slug])) @@ -45,30 +46,30 @@ export const Sidebar = (props: FeedSidebarProps) => { }, { icon: 'feed-my', - title: t('my feed') + title: t('My feed') }, { icon: 'feed-collaborate', - title: t('accomplices') + title: t('Accomplices') }, { icon: 'feed-discussion', - title: t('discussions'), + title: t('Discussions'), counter: 4 }, { icon: 'feed-drafts', - title: t('drafts'), + title: t('Drafts'), counter: 14 }, { icon: 'bookmark', - title: t('bookmarks'), + title: t('Bookmarks'), counter: 6 }, { icon: 'feed-notifications', - title: t('notifications') + title: t('Notifications') } ] @@ -82,8 +83,8 @@ export const Sidebar = (props: FeedSidebarProps) => { {item.icon && } {item.title} - {item.counter && 18} + {item.counter && 18} )} @@ -99,7 +100,8 @@ export const Sidebar = (props: FeedSidebarProps) => { > {t('My subscriptions')} -