From 020768f5b1b15b26286fec069604a1bdad940d01 Mon Sep 17 00:00:00 2001
From: Untone <anton.rewin@gmail.com>
Date: Wed, 3 Jul 2024 10:23:36 +0300
Subject: [PATCH] guide-static

---
 src/components/Nav/Header/Header.tsx          |  33 +--
 src/routes/guide/index.tsx                    | 244 ++++++++++++++++++
 .../topic/{[slug].tsx => [...slug].tsx}       |   0
 3 files changed, 256 insertions(+), 21 deletions(-)
 create mode 100644 src/routes/guide/index.tsx
 rename src/routes/topic/{[slug].tsx => [...slug].tsx} (100%)

diff --git a/src/components/Nav/Header/Header.tsx b/src/components/Nav/Header/Header.tsx
index d33743e4..bde33d89 100644
--- a/src/components/Nav/Header/Header.tsx
+++ b/src/components/Nav/Header/Header.tsx
@@ -50,10 +50,7 @@ export const Header = (props: Props) => {
   const [fixed, setFixed] = createSignal(false)
   const [isSharePopupVisible, setIsSharePopupVisible] = createSignal(false)
   const [isProfilePopupVisible, setIsProfilePopupVisible] = createSignal(false)
-  const [isKnowledgeBaseVisible, setIsKnowledgeBaseVisible] = createSignal(false)
-  const [isTopicsVisible, setIsTopicsVisible] = createSignal(false)
-  const [isZineVisible, setIsZineVisible] = createSignal(false)
-  const [isFeedVisible, setIsFeedVisible] = createSignal(false)
+  const [isTopMenuVisible, setIsTopMenuVisible] = createSignal(false)
   const { session } = useSession()
 
   const toggleFixed = () => setFixed(!fixed())
@@ -128,10 +125,7 @@ export const Header = (props: Props) => {
 
   const toggleSubnavigation = (isShow: boolean, signal?: (v: boolean) => void) => {
     clearTimer()
-    setIsKnowledgeBaseVisible(false)
-    setIsTopicsVisible(false)
-    setIsZineVisible(false)
-    setIsFeedVisible(false)
+    setIsTopMenuVisible(false)
 
     if (signal) {
       signal(isShow)
@@ -203,12 +197,12 @@ export const Header = (props: Props) => {
               <ul class="view-switcher">
                 <For each={['', 'feed', 'topics', 'authors', 'guide']}>
                   {(route: string) => (
-                    <li classList={{ 'view-switcher__item--selected': route === loc.pathname }}>
+                    <li classList={{ 'view-switcher__item--selected': loc.pathname.includes(route) }}>
                       <A
-                        class={clsx({ [styles.mainNavigationItemActive]: loc.pathname === route })}
+                        class={clsx({ [styles.mainNavigationItemActive]: loc.pathname.includes(route) })}
                         href={`/${route}`}
                         onClick={(event) => handleToggleMenuByLink(event, `/${route}`)}
-                        onMouseOver={() => toggleSubnavigation(true, setIsZineVisible)}
+                        onMouseOver={() => toggleSubnavigation(true, setIsTopMenuVisible)}
                         onMouseOut={() => hideSubnavigation()}
                       >
                         {t(route || 'journal')}
@@ -343,28 +337,27 @@ export const Header = (props: Props) => {
 
           <div
             class={clsx(styles.subnavigation, 'col')}
-            classList={{ hidden: !isKnowledgeBaseVisible() }}
             onMouseOver={clearTimer}
             onMouseOut={() => hideSubnavigation()}
           >
             <ul class="nodash">
               <li>
-                <a href="/about/manifest">{t('Manifesto')}</a>
+                <A href="/about/manifest">{t('Manifesto')}</A>
               </li>
               <li>
-                <a href="/about/dogma">{t('Dogma')}</a>
+                <A href="/about/dogma">{t('Dogma')}</A>
               </li>
               <li>
-                <a href="/about/principles">{t('Community Principles')}</a>
+                <A href="/about/principles">{t('Community Principles')}</A>
               </li>
               <li>
-                <a href="/about/guide">{t('Platform Guide')}</a>
+                <A href="/about/guide">{t('Platform Guide')}</A>
               </li>
               <li>
-                <a href="/about/manifest#participation">{t('Support us')}</a>
+                <A href="/about/manifest#participation">{t('Support us')}</A>
               </li>
               <li>
-                <a href="/about/help">{t('How to help')}</a>
+                <A href="/about/help">{t('How to help')}</A>
               </li>
               <li class={styles.rightItem}>
                 <A href="/connect">
@@ -377,7 +370,7 @@ export const Header = (props: Props) => {
 
           <div
             class={clsx(styles.subnavigation, 'col')}
-            classList={{ hidden: !isZineVisible() }}
+            classList={{ hidden: !isTopMenuVisible() }}
             onMouseOver={clearTimer}
             onMouseOut={() => hideSubnavigation()}
           >
@@ -423,7 +416,6 @@ export const Header = (props: Props) => {
 
           <div
             class={clsx(styles.subnavigation, 'col')}
-            classList={{ hidden: !isTopicsVisible() }}
             onMouseOver={clearTimer}
             onMouseOut={() => hideSubnavigation()}
           >
@@ -450,7 +442,6 @@ export const Header = (props: Props) => {
 
           <div
             class={clsx(styles.subnavigation, styles.subnavigationFeed, 'col')}
-            classList={{ hidden: !isFeedVisible() }}
             onMouseOver={clearTimer}
             onMouseOut={() => hideSubnavigation()}
           >
diff --git a/src/routes/guide/index.tsx b/src/routes/guide/index.tsx
new file mode 100644
index 00000000..abc16b0c
--- /dev/null
+++ b/src/routes/guide/index.tsx
@@ -0,0 +1,244 @@
+import { Meta } from '@solidjs/meta'
+import { createMemo } from 'solid-js'
+import { StaticPage } from '../../components/Views/StaticPage'
+import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
+
+export default () => {
+  const { t } = useLocalize()
+  const ogImage = createMemo(() => getImageUrl('production/image/logo_image.png'))
+  const ogTitle = createMemo(() => t('How Discours works'))
+  const description = createMemo(() => t('A guide to horizontal editorial: how an open journal works'))
+
+  return (
+    <StaticPage title={ogTitle()}>
+      <>
+        <Meta name="descprition" content={description()} />
+        <Meta name="keywords" content={t('keywords')} />
+        <Meta name="og:type" content="article" />
+        <Meta name="og:title" content={ogTitle()} />
+        <Meta name="og:image" content={ogImage()} />
+        <Meta name="twitter:image" content={ogImage()} />
+        <Meta name="og:description" content={description()} />
+        <Meta name="twitter:card" content="summary_large_image" />
+        <Meta name="twitter:title" content={ogTitle()} />
+        <Meta name="twitter:description" content={description()} />
+
+        <h1 id="about">
+          <span class="wrapped">{ogTitle()}</span>
+        </h1>
+
+        <p>
+          Дискурс&nbsp;&mdash; независимый журнал о&nbsp;культуре, науке, искусстве и&nbsp;обществе с&nbsp;
+          <a href="/about/manifest">открытой редакцией</a>. У&nbsp;нас нет главного редактора, инвестора
+          и&nbsp;вообще никого, кто&nbsp;бы принимал единоличные решения. Вместо традиционных иерархий
+          Дискурс основан на&nbsp;принципах прямой демократии: в&nbsp;нашем горизонтальном сообществе все
+          редакционные вопросы решаются открытым голосованием авторов журнала. Вот как это работает.
+        </p>
+        <h3 id="how-it-works">Как устроен сайт Дискурса</h3>
+        <p>Дискурс состоит из&nbsp;четырех основных разделов:</p>
+        <ul>
+          <li>
+            <p>
+              <a href="/topics">Темы</a>
+              &nbsp;&mdash; у&nbsp;нас публикуются исследования, обзоры, эссе, интервью, репортажи,
+              аналитика и&nbsp;другие материалы о&nbsp;культуре, науке, искусстве и&nbsp;обществе.
+            </p>
+          </li>
+          <li>
+            <p>
+              <a href="/topic/art">Искусство</a>
+              &nbsp;&mdash; здесь, например, представлены художественные произведения: литература, живопись,
+              музыка, фотографии, видео. Этот раздел помогает прозвучать новому искусству, которое создают
+              российские художники, писатели, режиссёры и&nbsp;музыканты.
+            </p>
+          </li>
+          {/*
+        <li>
+      <p>
+      <a href="/topic/events">События</a>&nbsp;— в&nbsp;этом разделе
+      публикуются самые важные, по&nbsp;мнению редакции, культурные
+      события России — выставки, лекции, концерты, кинопоказы, фестивали,
+      художественные и политические&nbsp;акции. Напишите&nbsp;нам
+      на&nbsp;<a href="mailto:welcome@discours.io" target="_blank">почту</a>, если вы
+      хотите разместить объявление. Мы делаем&nbsp;это
+      на&nbsp;безвозмездной основе.
+      </p>
+    </li >
+        <li>
+          <p>
+            <a href="/create" class="ng-scope" target="_blank">Редакция</a>&nbsp;—
+            это внутренний раздел, где появляются новые материалы, которые присылают
+            в&nbsp;редакцию. Здесь авторы обсуждают, редактируют и&nbsp;оценивают
+            публикации, определяя таким образом содержание журнала.
+          </p>
+        </li>
+*/}
+        </ul>
+        <p>
+          Материалы в&nbsp;Дискурсе объединяются по&nbsp;<b>темам</b>
+          &mdash;&nbsp;ключевым словам, которые располагаются в&nbsp;конце материалов и&nbsp;связывают
+          материалы по&nbsp;жанрам (например, <a href="/topic/interview">интервью</a>,{' '}
+          <a href="/topic/reportage">репортажи</a>, <a href="/topic/essay">эссе</a>,{' '}
+          <a href="/topic/likbez">ликбезы</a>
+          ), по&nbsp;тематике (<a href="/topic/cinema">кино</a>, <a href="/topic/philosophy">философия</a>,{' '}
+          <a href="/topic/history">история</a>, <a href="/topic/absurdism">абсурдизм</a>,{' '}
+          <a href="/topic/sex">секс</a> и&nbsp;т.д.) или в&nbsp;серии (как &laquo;
+          <a href="/topic/zakony-mira">Законы мира</a>&raquo; или &laquo;
+          <a href="/topic/za-liniey-mannergeyma">За&nbsp;линией Маннергейма</a>
+          &raquo;). Темы объединяют сотни публикаций, помогают ориентироваться в&nbsp;журнале и&nbsp;следить
+          за&nbsp;интересными материалами.
+        </p>
+
+        <section>
+          <h3 id="become-author">Как стать автором журнала</h3>
+          <p>
+            Дискурс объединяет журналистов, активистов, музыкантов, художников, фотографов, режиссеров,
+            философов, ученых и&nbsp;других замечательных людей. Каждый может <a href="/create">прислать</a>{' '}
+            свой материал в&nbsp;журнал. Формат и&nbsp;тематика не&nbsp;имеют значения, единственное, что
+            важно &mdash; <a href="/how-to-write-a-good-article">хороший</a> ли&nbsp;материал. Если
+            сообщество поддержит вашу публикацию, она выйдет в&nbsp;журнале и&nbsp;станет доступна тысячам
+            наших читателей.
+          </p>
+        </section>
+
+        <h3 id="voting">Как проходит голосование</h3>
+        <p>
+          Все присылаемые в&nbsp;Дискурс материалы попадают в&nbsp;
+          <strong>&laquo;Редакцию&raquo;</strong>. Это внутренний раздел сайта, где участники сообщества
+          решают, что будет опубликовано в&nbsp;Дискурсе. Как только работа получает одобрение как минимум
+          пятерых авторов открытой редакции, она немедленно публикуется в&nbsp;журнале. Если&nbsp;же
+          материал набирает более&nbsp;20% голосов &laquo;против&raquo;, он&nbsp;не&nbsp;выходит
+          и&nbsp;может быть отправлен на&nbsp;доработку. Жестких сроков рассмотрения материалов у&nbsp;нас
+          нет, иногда это занимает час, иногда месяц, обычно&nbsp;&mdash; несколько дней.
+        </p>
+        <section>
+          <p>
+            Как только сообщество поддержит публикацию, вы&nbsp;получите приглашение
+            в&nbsp;интернет-редакцию и&nbsp;сможете голосовать за&nbsp;новые материалы.
+          </p>
+        </section>
+
+        <h3 id="editing">Как мы&nbsp;делаем тексты друг друга лучше</h3>
+        <p>
+          Дискурс&nbsp;&mdash; журнал с&nbsp;совместным редактированием. Совершенствовать тексты нам
+          помогает <b>система ремарок</b>. Вы&nbsp;можете выделить часть текста в&nbsp;любой статье
+          и&nbsp;оставить к&nbsp;ней замечание, вопрос или предложение&nbsp;&mdash; автор текста получит
+          совет на&nbsp;почту и&nbsp;сможет его учесть. Так мы&nbsp;устраняем опечатки, неточности
+          и&nbsp;советуем друг другу, как сделать тексты качественнее и&nbsp;интереснее.
+        </p>
+        <p>
+          Среди участников сообщества есть профессиональные редакторы, которые помогают авторам делать
+          тексты лучше. Если вашему материалу потребуется доработка, они помогут отредактировать текст,
+          подобрать иллюстрации, придумать заголовок и&nbsp;красиво сверстать публикацию. Если
+          вы&nbsp;хотите обсудить текст, прежде чем загрузить материал в интернет-редакцию&nbsp;&mdash;
+          разместите его в&nbsp;google-документе, откройте доступ к&nbsp;редактированию по&nbsp;ссылке
+          и&nbsp;напишите нам на&nbsp;
+          <a href="mailto:welcome@discours.io" target="_blank" rel="noreferrer">
+            welcome@discours.io
+          </a>
+          .
+        </p>
+        <p>
+          Если у&nbsp;вас возникают трудности с&nbsp;тем, чтобы подобрать к&nbsp;своему материалу
+          иллюстрации, тоже пишите на&nbsp;
+          <a href="mailto:welcome@discours.io" target="_blank" rel="noreferrer">
+            почту
+          </a>
+          &mdash; наши коллеги-художники могут вам помочь{' '}
+          <a href="/create?collab" target="_blank" rel="noreferrer">
+            в&nbsp;режиме совместного редактирования
+          </a>
+          .
+        </p>
+
+        <h3 id="perks">Что сообщество дает авторам</h3>
+        <ul>
+          <li>
+            <p>
+              <strong>Право определять, каким будет журнал</strong>. Дискурс&nbsp;&mdash; это общественная
+              институция, созданная людьми и&nbsp;ради людей, функционирующая на&nbsp;условиях прямой
+              демократии. Авторы публикуют статьи и&nbsp;художественные проекты, участвуют
+              в&nbsp;обсуждениях, голосуют за&nbsp;работы коллег и&nbsp;таким образом вносят свой вклад
+              в&nbsp;развитие проекта, определяя содержание и&nbsp;направление журнала.
+            </p>
+          </li>
+          <li>
+            <p>
+              <strong>Возможность обратиться к&nbsp;широкой аудитории</strong>. Дискурс читают десятки тысяч
+              людей, и&nbsp;с&nbsp;каждым днем их&nbsp;становится больше.
+            </p>
+          </li>
+          <li>
+            <p>
+              <strong>Поддержка редакции</strong>. Дискурс предоставляет авторам аккредитацию
+              на&nbsp;мероприятия, базу контактов, юридическую поддержку, ознакомление с&nbsp;книжными,
+              кино- и&nbsp;музыкальными новинками до&nbsp;их&nbsp;выхода в&nbsp;свет. Если что-то
+              из&nbsp;этого вам понадобится, пишите на&nbsp;почту{' '}
+              <a href="mailto:welcome@discours.io" target="_blank" rel="noreferrer">
+                welcome@discours.io
+              </a>
+              &nbsp;&mdash; поможем.
+            </p>
+          </li>
+          <li>
+            <p>
+              <strong>Пресс-карты для корреспондентов</strong>. Три опубликованные статьи позволяют авторам
+              Дискурса получить официальные удостоверения журналистов (пресс-карты) на&nbsp;следующий год.
+              Пресс-карты удостоверяют, что вы&nbsp;журналист и&nbsp;можете пользоваться всеми теми правами,
+              которые гарантирует Закон о&nbsp;СМИ. Кроме того, многие культурные институции (музеи, галереи
+              и&nbsp;др.) предоставляют журналистам право свободного входа.
+            </p>
+          </li>
+          <li>
+            <p>
+              <strong>Помощь сотен специалистов в&nbsp;разных областях</strong>. В&nbsp;основе Дискурса
+              лежит идея совместного редактирования. Участники редакционного сообщества&nbsp;&mdash;
+              несколько сотен журналистов, исследователей, художников, литераторов из&nbsp;разных стран
+              &mdash; изучают материалы друг друга до&nbsp;публикации и&nbsp;помогают сделать
+              их&nbsp;качественнее и&nbsp;интереснее. Так, в&nbsp;редакции нередко складываются творческие
+              союзы: например, авторов текстов и&nbsp;художников, создающих для них иллюстрации.
+            </p>
+          </li>
+          <li>
+            <p>
+              <strong>Пространство общения полное выдающихся людей</strong>. Дискурс&nbsp;&mdash; большое
+              живое сообщество интеллектуалов, разбросанных по&nbsp;всему земному шару. Вступив
+              в&nbsp;редакцию, вы&nbsp;сможете познакомиться со&nbsp;множеством интересных людей, которые
+              определяют повестку завтрашнего дня, вдохновляют окружающих, создают новое и&nbsp;изучают
+              старое, ищут знания и&nbsp;готовы ими делиться, чтобы менять мир в&nbsp;соответствии
+              со&nbsp;своими идеалами.
+            </p>
+          </li>
+        </ul>
+
+        <h3 id="contacts">Как быть в&nbsp;курсе</h3>
+        <p>
+          За&nbsp;свежими публикациями Дискурса можно следить не&nbsp;только на&nbsp;сайте,
+          но&nbsp;и&nbsp;на&nbsp;страницах в&nbsp;
+          <a href="https://facebook.com/discoursio/" target="_blank" rel="noreferrer">
+            Фейсбуке
+          </a>
+          ,{' '}
+          <a href="https://vk.com/discoursio" target="_blank" rel="noreferrer">
+            ВКонтакте
+          </a>{' '}
+          и&nbsp;
+          <a href="https://t.me/discoursio" target="_blank" rel="noreferrer">
+            Телеграме
+          </a>
+          . А&nbsp;ещё раз в&nbsp;месяц мы&nbsp;отправляем <a href="#subscribe">почтовую рассылку</a>{' '}
+          с&nbsp;дайджестом лучших материалов.
+        </p>
+        <p>
+          Если вы&nbsp;хотите сотрудничать, что-то обсудить или предложить &mdash; пожалуйста, пишите
+          на&nbsp;
+          <a href="mailto:welcome@discours.io" target="_blank" rel="noreferrer">
+            welcome@discours.io
+          </a>
+          . Мы&nbsp;обязательно ответим.
+        </p>
+      </>
+    </StaticPage>
+  )
+}
diff --git a/src/routes/topic/[slug].tsx b/src/routes/topic/[...slug].tsx
similarity index 100%
rename from src/routes/topic/[slug].tsx
rename to src/routes/topic/[...slug].tsx