From 7ec3be0b2fd046284f4261a54564bf58aae6435a Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Tue, 24 Oct 2023 01:35:02 +0300 Subject: [PATCH] Mobile navigation fixes --- public/locales/en/translation.json | 3 + public/locales/ru/translation.json | 5 +- src/components/Nav/Header/Header.module.scss | 57 +++++++++++++++---- src/components/Nav/Header/Header.tsx | 31 +++++++--- src/components/Nav/HeaderAuth.tsx | 9 +++ .../_shared/Subscribe/Subscribe.tsx | 1 + src/pages/about/discussionRules.page.tsx | 2 +- src/pages/about/principles.page.tsx | 2 +- src/styles/app.scss | 5 +- 9 files changed, 91 insertions(+), 24 deletions(-) diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index cdfd8ca5..d5c49e3c 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -100,6 +100,7 @@ "Discours is created with our common effort": "Discours exists because of our common effort", "Discussing": "Discussing", "Discussion rules": "Discussion rules", + "Discussion rules in social networks": "Discussion rules", "Discussions": "Discussions", "Dogma": "Dogma", "Draft successfully deleted": "Draft successfully deleted", @@ -183,6 +184,7 @@ "Just start typing...": "Just start typing...", "Knowledge base": "Knowledge base", "Last rev.": "Посл. изм.", + "Language": "Language", "Let's log in": "Let's log in", "Link copied": "Link copied", "Link sent, check your email": "Link sent, check your email", @@ -308,6 +310,7 @@ "Success": "Success", "Successfully authorized": "Authorization successful", "Suggest an idea": "Suggest an idea", + "Support the project": "Support the project", "Support us": "Help the magazine", "Terms of use": "Site rules", "Text checking": "Text checking", diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json index 07af69c1..fc2f9075 100644 --- a/public/locales/ru/translation.json +++ b/public/locales/ru/translation.json @@ -103,7 +103,8 @@ "Discours is an intellectual environment, a web space and tools that allows authors to collaborate with readers and come together to co-create publications and media projects": "Дискурс — это интеллектуальная среда, веб-пространство и инструменты, которые позволяют авторам сотрудничать с читателями и объединяться для совместного создания публикаций и медиапроектов.
Мы убеждены, один голос хорошо, а много — лучше. Самые потрясающиe истории мы создаём вместе.", "Discours is created with our common effort": "Дискурс существует благодаря нашему общему вкладу", "Discussing": "Обсуждаемое", - "Discussion rules": "Правила сообществ самиздата в соцсетях", + "Discussion rules": "Правила дискуссий", + "Discussion rules in social networks": "Правила сообществ самиздата в соцсетях", "Discussions": "Дискуссии", "Dogma": "Догма", "Draft successfully deleted": "Черновик успешно удален", @@ -192,6 +193,7 @@ "Just start typing...": "Просто начните печатать...", "Karma": "Карма", "Knowledge base": "База знаний", + "Language": "Язык", "Last rev.": "Посл. изм.", "Let's log in": "Давайте авторизуемся", "Link copied": "Ссылка скопирована", @@ -327,6 +329,7 @@ "Success": "Успешно", "Successfully authorized": "Авторизация успешна", "Suggest an idea": "Предложить идею", + "Support the project": "Поддержать проект", "Support us": "Помочь журналу", "Terms of use": "Правила сайта", "Text checking": "Проверка текста", diff --git a/src/components/Nav/Header/Header.module.scss b/src/components/Nav/Header/Header.module.scss index 5cc89763..56faae9f 100644 --- a/src/components/Nav/Header/Header.module.scss +++ b/src/components/Nav/Header/Header.module.scss @@ -74,8 +74,11 @@ img { height: 20px; + margin-top: 0.3rem; object-fit: contain; object-position: left; + position: relative; + top: 0.3rem; transition: height 0.2s; vertical-align: middle; width: 100px; @@ -155,7 +158,7 @@ display: block; font-size: 3.2rem !important; font-weight: bold; - margin: 0 0 5rem; + margin: 0 0 4rem; } li { @@ -192,8 +195,9 @@ } :global(.view-switcher) { - margin-top: 0; + margin: 0 -0.5rem; overflow: hidden; + padding: 0; } li { @@ -224,20 +228,51 @@ } } -.mainNavigationSocial a { - display: flex; - justify-content: space-between; +.mainNavigationSocial { + font-size: 2rem; + font-weight: 500; + + .mainNavigation .mainNavigationMobile & { + margin-bottom: 0 !important; + } + + a { + align-items: center; + display: flex; + + &:hover { + .icon { + filter: invert(1); + } + } - &:hover { .icon { - filter: invert(1); + height: 3.8rem; + margin-right: 0.3em; + width: 3.8rem; } } +} - .icon { - height: 3.8rem; - width: 3.8rem; - } +.languageSelectorMobile { + border: 2px solid #e8e8e8; + border-radius: 1.6rem; + display: block; + font-family: inherit; + font-size: 1.7rem; + height: 5.6rem; + margin-bottom: 5rem; + padding: 0 1.2rem; + width: 100%; +} + +.mainNavigationAdditionalLinks { + border-top: 1px solid #ccc; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: 1rem; + padding: 1.6rem 0 2rem; } .mobileDescription { diff --git a/src/components/Nav/Header/Header.tsx b/src/components/Nav/Header/Header.tsx index d68c8dcd..65b27900 100644 --- a/src/components/Nav/Header/Header.tsx +++ b/src/components/Nav/Header/Header.tsx @@ -227,16 +227,16 @@ export const Header = (props: Props) => {
-

{t('Join the community')}

+

{t('Participating')}

@@ -244,44 +244,57 @@ export const Header = (props: Props) => {

{t('Newsletter')}

+ +

{t('Newsletter')}

+ + +
+ {t('Dogma')} + + {t('Principles')} +
+

{

+ +
+
+ + +
+
+ +
{renderIconedButton({ diff --git a/src/components/_shared/Subscribe/Subscribe.tsx b/src/components/_shared/Subscribe/Subscribe.tsx index 569527b5..214ebb1a 100644 --- a/src/components/_shared/Subscribe/Subscribe.tsx +++ b/src/components/_shared/Subscribe/Subscribe.tsx @@ -106,6 +106,7 @@ export const Subscribe = (props: Props) => {
+
Подпишитесь на рассылку лучших публикаций
{emailError()}
diff --git a/src/pages/about/discussionRules.page.tsx b/src/pages/about/discussionRules.page.tsx index 7f03e424..5a97f12b 100644 --- a/src/pages/about/discussionRules.page.tsx +++ b/src/pages/about/discussionRules.page.tsx @@ -4,7 +4,7 @@ import { Title } from '@solidjs/meta' export const DiscussionRulesPage = () => { const { t } = useLocalize() - const title = t('Discussion rules') + const title = t('Discussion rules in social networks') return ( {title} diff --git a/src/pages/about/principles.page.tsx b/src/pages/about/principles.page.tsx index 88378c9f..314f1895 100644 --- a/src/pages/about/principles.page.tsx +++ b/src/pages/about/principles.page.tsx @@ -61,7 +61,7 @@ export const PrinciplesPage = () => {

- Как участвовать в самиздате + Как у нас принято себя вести

diff --git a/src/styles/app.scss b/src/styles/app.scss index 4f75474e..46347217 100644 --- a/src/styles/app.scss +++ b/src/styles/app.scss @@ -987,8 +987,11 @@ details { .description { @include font-size(1.4rem); - color: rgba(0 0 0 / 40%); + + .pretty-form__item + & { + margin-top: -2rem; + } } [data-custom-scroll='on'] {