Merge remote-tracking branch 'hub/main' into feature/sse-connect

package-lock.json

@@ -110,7 +110,7 @@
         "prosemirror-view": "1.30.2",
         "rollup": "3.21.6",
         "sass": "1.69.5",
-        "solid-js": "1.8.5",
+        "solid-js": "1.8.7",
         "solid-popper": "0.3.0",
         "solid-tiptap": "0.6.0",
         "solid-transition-group": "0.2.3",
@@ -125,7 +125,7 @@
         "typescript": "5.2.2",
         "typograf": "7.1.0",
         "uniqolor": "1.1.0",
-        "vike": "0.4.146",
+        "vike": "0.4.148",
         "vite": "4.5.0",
         "vite-plugin-mkcert": "1.16.0",
         "vite-plugin-sass-dts": "1.3.11",
@@ -17061,9 +17061,9 @@
       }
     },
     "node_modules/seroval": {
-      "version": "0.12.4",
+      "version": "0.15.1",
-      "resolved": "https://registry.npmjs.org/seroval/-/seroval-0.12.4.tgz",
+      "resolved": "https://registry.npmjs.org/seroval/-/seroval-0.15.1.tgz",
-      "integrity": "sha512-JIsZHp98o+okpYN8HEPyI9Blr0gxAUPIGvg3waXrEMFjPz9obiLYMz0uFiUGezKiCK8loosYbn8WsqO8WtAJUA==",
+      "integrity": "sha512-OPVtf0qmeC7RW+ScVX+7aOS+xoIM7pWcZ0jOWg2aTZigCydgRB04adfteBRbecZnnrO1WuGQ+C3tLeBBzX2zSQ==",
       "dev": true,
       "engines": {
         "node": ">=10"
@@ -17253,13 +17253,13 @@
       }
     },
     "node_modules/solid-js": {
-      "version": "1.8.5",
+      "version": "1.8.7",
-      "resolved": "https://registry.npmjs.org/solid-js/-/solid-js-1.8.5.tgz",
+      "resolved": "https://registry.npmjs.org/solid-js/-/solid-js-1.8.7.tgz",
-      "integrity": "sha512-xvtJvzJzWbsn35oKFhW9kNwaxG1Z/YLMsDp4tLVcYZTMPzvzQ8vEZuyDQ6nt7xDArVgZJ7TUFrJUwrui/oq53A==",
+      "integrity": "sha512-9dzrSVieh2zj3SnJ02II6xZkonR6c+j/91b7XZUNcC6xSaldlqjjGh98F1fk5cRJ8ZTkzqF5fPIWDxEOs6QZXA==",
       "dev": true,
       "dependencies": {
         "csstype": "^3.1.0",
-        "seroval": "^0.12.0"
+        "seroval": "^0.15.1"
       }
     },
     "node_modules/solid-popper": {
@@ -18662,14 +18662,14 @@
       }
     },
     "node_modules/vike": {
-      "version": "0.4.146",
+      "version": "0.4.148",
-      "resolved": "https://registry.npmjs.org/vike/-/vike-0.4.146.tgz",
+      "resolved": "https://registry.npmjs.org/vike/-/vike-0.4.148.tgz",
-      "integrity": "sha512-1vaktcDy/eitSzVaUppKJWu+6vfwxKC4kV6uzAqj3RIK+WgteH3vF6IMZ0jnjjzCpeDRCIByN8PF4c0CtzRfHA==",
+      "integrity": "sha512-2KkrY6zB+fTVwQzzcr5zAxpIT2buezDcUP5u4oFzDdxhqcV7r5CGq2PWQ3/ALA8jP/Agz0ZdiMbXUNGJFI+uVw==",
       "dev": true,
       "dependencies": {
         "@brillout/import": "0.2.3",
         "@brillout/json-serializer": "^0.5.8",
-        "@brillout/picocolors": "^1.0.9",
+        "@brillout/picocolors": "^1.0.10",
         "@brillout/require-shim": "^0.1.2",
         "@brillout/vite-plugin-import-build": "^0.2.20",
         "acorn": "^8.8.2",

package.json

@@ -131,7 +131,7 @@
     "prosemirror-view": "1.30.2",
     "rollup": "3.21.6",
     "sass": "1.69.5",
-    "solid-js": "1.8.5",
+    "solid-js": "1.8.7",
     "solid-popper": "0.3.0",
     "solid-tiptap": "0.6.0",
     "solid-transition-group": "0.2.3",
@@ -146,7 +146,7 @@
     "typescript": "5.2.2",
     "typograf": "7.1.0",
     "uniqolor": "1.1.0",
-    "vike": "0.4.146",
+    "vike": "0.4.148",
     "vite": "4.5.0",
     "vite-plugin-mkcert": "1.16.0",
     "vite-plugin-sass-dts": "1.3.11",

public/locales/en/translation.json

@@ -1,4 +1,5 @@
 {
+  "A guide to horizontal editorial: how an open journal works": "A guide to horizontal editorial: how an open journal works",
   "About": "About",
   "About the project": "About the project",
   "Add a few topics so that the reader knows what your content is about and can find it on pages of topics that interest them. Topics can be swapped, the first topic becomes the title": "Add a few topics so that the reader knows what your content is about and can find it on pages of topics that interest them. Topics can be swapped, the first topic becomes the title",
@@ -17,7 +18,7 @@
   "Add signature": "Add signature",
   "Add subtitle": "Add subtitle",
   "Add url": "Add url",
-  "Address on Discourse": "Address on Discourse",
+  "Address on Discours": "Address on Discours",
   "Album name": "Название aльбома",
   "Alignment center": "Alignment center",
   "Alignment left": "Alignment left",
@@ -40,6 +41,7 @@
   "Back": "Back",
   "Back to editor": "Back to editor",
   "Back to main page": "Back to main page",
+  "Be the first to rate": "Be the first to rate",
   "Become an author": "Become an author",
   "Bold": "Bold",
   "Bookmarked": "Saved",
@@ -71,8 +73,11 @@
   "Comment successfully deleted": "Comment successfully deleted",
   "Comments": "Comments",
   "Communities": "Communities",
+  "Community Discussion Rules": "Community Discussion Rules",
   "Community Principles": "Community Principles",
+  "Community values and rules of engagement for the open editorial team": "Community values and rules of engagement for the open editorial team",
   "Confirm": "Confirm",
+  "Contribute to free samizdat. Support Discours - an independent non-profit publication that works only for you. Become a pillar of the open newsroom": "Contribute to free samizdat. Support Discours - an independent non-profit publication that works only for you. Become a pillar of the open newsroom",
   "Cooperate": "Cooperate",
   "Copy": "Copy",
   "Copy link": "Copy link",
@@ -97,11 +102,13 @@
   "Delete userpic": "Delete userpic",
   "Description": "Description",
   "Discours": "Discours",
+  "Discours Manifest": "Discours Manifest",
+  "Discours Partners": "Discours Partners",
   "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": "Discours is&#160;an&#160;intellectual environment, a&#160;web space and tools that allows authors to&#160;collaborate with readers and come together to&#160;co-create publications and media projects.<br/><em>We&#160;are convinced that one voice is&#160;good, but many is&#160;better. We&#160;create the most amazing stories together</em>",
   "Discours is created with our common effort": "Discours exists because of our common effort",
+  "Discours – an open magazine about culture, science and society": "Discours – an open magazine about culture, science and society",
   "Discussing": "Discussing",
   "Discussion rules": "Discussion rules",
-  "Discussion rules in social networks": "Discussion rules",
   "Discussions": "Discussions",
   "Do you really want to reset all changes?": "Do you really want to reset all changes?",
   "Dogma": "Dogma",
@@ -152,7 +159,7 @@
   "Help": "Помощь",
   "Help to edit": "Help to edit",
   "Here you can customize your profile the way you want.": "Here you can customize your profile the way you want.",
-  "Here you can manage all your Discourse subscriptions": "Here you can manage all your Discourse subscriptions",
+  "Here you can manage all your Discours subscriptions": "Here you can manage all your Discours subscriptions",
   "Here you can upload your photo": "Here you can upload your photo",
   "Hide table of contents": "Hide table of contents",
   "Highlight": "Highlight",
@@ -160,11 +167,13 @@
   "Horizontal collaborative journalistic platform": "Horizontal collaborative journalism platform",
   "Hot topics": "Hot topics",
   "Hotkeys": "Горячие клавиши",
+  "How Discours works": "How Discours works",
   "How can I help/skills": "How can I help/skills",
   "How it works": "How it works",
   "How to help": "How to help?",
   "How to write a good article": "Как написать хорошую статью",
   "How to write an article": "How to write an article",
+  "Hundreds of people from different countries and cities share their knowledge and art on the Discours. Join us!": "Hundreds of people from different countries and cities share their knowledge and art on the Discours. Join us!",
   "I have an account": "I have an account!",
   "I have no account yet": "I don't have an account yet",
   "I know the password": "I know the password",
@@ -173,6 +182,7 @@
   "Inbox": "Inbox",
   "Incut": "Incut",
   "Independant magazine with an open horizontal cooperation about culture, science and society": "Independant magazine with an open horizontal cooperation about culture, science and society",
+  "Independent media project about culture, science, art and society with horizontal editing": "Independent media project about culture, science, art and society with horizontal editing",
   "Insert footnote": "Insert footnote",
   "Insert video link": "Insert video link",
   "Interview": "Interview",
@@ -195,13 +205,14 @@
   "Let's log in": "Let's log in",
   "Link copied": "Link copied",
   "Link sent, check your email": "Link sent, check your email",
+  "List of authors of the open editorial community": "List of authors of the open editorial community",
   "Lists": "Lists",
   "Literature": "Literature",
   "Load more": "Show more",
   "Loading": "Loading",
   "Logout": "Logout",
   "Looks like you forgot to upload the video": "Looks like you forgot to upload the video",
-  "Manifest": "Manifest",
+  "Manifest of samizdat: principles and mission of an open magazine with a horizontal editorial board": "Manifest of samizdat: principles and mission of an open magazine with a horizontal editorial board",
   "Manifesto": "Manifesto",
   "Many files, choose only one": "Many files, choose only one",
   "Mark as read": "Mark as read",
@@ -236,6 +247,7 @@
   "Ordered list": "Ordered list",
   "Our regular contributor": "Our regular contributor",
   "Paragraphs": "Абзацев",
+  "Participate in the Discours: share information, join the editorial team": "Участвуйте в Дискурсе: делитесь информацией, присоединяйтесь к редакции",
   "Participating": "Participating",
   "Participation": "Participation",
   "Partners": "Partners",
@@ -261,6 +273,7 @@
   "Popular": "Popular",
   "Popular authors": "Popular authors",
   "Principles": "Community principles",
+  "Professional principles that the open editorial team follows in its work": "Professional principles that the open editorial team follows in its work",
   "Profile": "Profile",
   "Profile settings": "Profile settings",
   "Publications": "Publications",
@@ -281,6 +294,7 @@
   "Required": "Required",
   "Resend code": "Send confirmation",
   "Restore password": "Restore password",
+  "Rules of the journal Discours": "Rules of the journal Discours",
   "Save draft": "Save draft",
   "Save settings": "Save settings",
   "Saving...": "Saving...",
@@ -291,6 +305,7 @@
   "Sections": "Sections",
   "Security": "Security",
   "Select": "Select",
+  "Self-publishing exists thanks to the help of wonderful people from all over the world. Thank you!": "Samizdat exists thanks to the help of wonderful people from all over the world. Thank you!",
   "Send": "Send",
   "Send link again": "Send link again",
   "Settings": "Settings",
@@ -326,12 +341,17 @@
   "Success": "Success",
   "Successfully authorized": "Authorization successful",
   "Suggest an idea": "Suggest an idea",
+  "Support Discours": "Support Discours",
   "Support the project": "Support the project",
-  "Support us": "Help the magazine",
   "Terms of use": "Site rules",
   "Text checking": "Text checking",
   "Thank you": "Thank you",
+  "Thank you!": "Thank you!",
   "The address is already taken": "The address is already taken",
+  "The most interesting publications on the topic": "The most interesting publications on the topic {topicName}",
+  "Thematic table of contents of the magazine. Here you can find all the topics that community authors have written about.": "Thematic table of contents of the magazine. Here you can find all the topics that community authors have written about.",
+  "Thematic table of contents of the magazine. Here you can find all the topics that the community authors wrote about": "Thematic table of contents of the magazine. Here you can find all the topics that the community authors wrote about",
+  "Themes and plots": "Themes and plots",
   "Theory": "Theory",
   "There are unsaved changes in your profile settings. Are you sure you want to leave the page without saving?": "There are unsaved changes in your profile settings. Are you sure you want to leave the page without saving?",
   "There are unsaved changes in your publishing settings. Are you sure you want to leave the page without saving?": "There are unsaved changes in your publishing settings. Are you sure you want to leave the page without saving?",
@@ -380,8 +400,9 @@
   "Welcome to Discours to subscribe to new publications": "Welcome to Discours to subscribe to new publications",
   "Welcome to Discours to vote": "Welcome to Discours to vote",
   "Where": "From",
+  "Why you can earn a hole in your karma and how to receive rays of gratitude for your contribution to discussions in samizdat communities": "Why you can earn a hole in your karma and how to receive rays of gratitude for your contribution to discussions in samizdat communities",
   "Words": "Слов",
-  "Work with us": "Cooperate with Discourse",
+  "Work with us": "Cooperate with Discours",
   "Write a comment...": "Write a comment...",
   "Write a short introduction": "Write a short introduction",
   "Write about the topic": "Write about the topic",
@@ -412,7 +433,8 @@
   "community": "community",
   "contents": "contents",
   "delimiter": "delimiter",
-  "discussion": "discourse",
+  "discussion": "Discours",
+  "dogma keywords": "Discours.io, dogma, editorial principles, code of ethics, journalism, community",
   "drafts": "drafts",
   "earlier": "earlier",
   "email not confirmed": "email not confirmed",
@@ -428,6 +450,7 @@
   "italic": "italic",
   "journal": "journal",
   "jpg, .png, max. 10 mb.": "jpg, .png, макс. 10 мб.",
+  "keywords": "Discours.io, Discours magazine, Discours, culture, science, art, society, independent journalism, literature, music, cinema, video, photography",
   "literature": "literature",
   "marker list": "marker list",
   "min. 1400×1400 pix": "мин. 1400×1400 пикс.",
@@ -437,6 +460,7 @@
   "or sign in with social networks": "or sign in with social networks",
   "personal data usage and email notifications": "to process personal data and receive email notifications",
   "post": "post",
+  "principles keywords": "Discours.io, communities, values, editorial rules, polyphony, creation",
   "register": "register",
   "repeat": "repeat",
   "shout": "post",
@@ -451,7 +475,9 @@
   "subscription_rp": "subscription",
   "subscriptions": "subscriptions",
   "terms of use": "terms of use",
+  "terms of use keywords": "Discours.io, site rules, terms of use",
   "today": "today",
+  "topicKeywords": "{topic}, Discours.io, articles, journalism, research",
   "topics": "topics",
   "user already exist": "user already exists",
   "video": "video",

public/locales/ru/translation.json

@@ -1,4 +1,5 @@
 {
+  "A guide to horizontal editorial: how an open journal works": "Гид по горизонтальной редакции: как работает открытый журнал",
   "A short introduction to keep the reader interested": "Добавьте вступление, чтобы заинтересовать читателя",
   "About": "О себе",
   "About the project": "О проекте",
@@ -19,7 +20,7 @@
   "Add subtitle": "Добавить подзаголовок",
   "Add to bookmarks": "Добавить в закладки",
   "Add url": "Добавить ссылку",
-  "Address on Discourse": "Адрес на Дискурсе",
+  "Address on Discours": "Адрес на Дискурсе",
   "Album name": "Название альбома",
   "Alignment center": "По центру",
   "Alignment left": "По левому краю",
@@ -43,6 +44,7 @@
   "Back": "Назад",
   "Back to editor": "Вернуться в редактор",
   "Back to main page": "Вернуться на главную",
+  "Be the first to rate": "Оцените первым",
   "Become an author": "Стать автором",
   "Bold": "Жирный",
   "Bookmarked": "Сохранено",
@@ -75,8 +77,11 @@
   "Comment successfully deleted": "Комментарий успешно удален",
   "Comments": "Комментарии",
   "Communities": "Сообщества",
+  "Community Discussion Rules": "Правила дискуссий в сообществе",
   "Community Principles": "Принципы сообщества",
+  "Community values and rules of engagement for the open editorial team": "Ценности сообщества и правила взаимодействия открытой редакции",
   "Confirm": "Подтвердить",
+  "Contribute to free samizdat. Support Discours - an independent non-profit publication that works only for you. Become a pillar of the open newsroom": "Внесите вклад в свободный самиздат. Поддержите Дискурс — независимое некоммерческое издание, которое работает только для вас. Станьте опорой открытой редакции",
   "Cooperate": "Соучаствовать",
   "Copy": "Скопировать",
   "Copy link": "Скопировать ссылку",
@@ -101,11 +106,14 @@
   "Delete userpic": "Удалить аватар",
   "Description": "Описание",
   "Discours": "Дискурс",
+  "Discours Manifest": "Манифест Дискурса",
+  "Discours Partners": "Партнеры Дискурса",
   "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": "Дискурс&#160;&#8212; это интеллектуальная среда, веб-пространство и&#160;инструменты, которые позволяют авторам сотрудничать&#160;с&#160;читателями и&#160;объединяться для совместного создания публикаций и&#160;медиапроектов.<br/>Мы&#160;убеждены, один голос хорошо, а&#160;много&#160;&#8212; лучше. Самые потрясающиe истории мы создаём вместе.",
   "Discours is created with our common effort": "Дискурс существует благодаря нашему общему вкладу",
+  "Discours – an open magazine about culture, science and society": "Дискурс – открытый журнал о культуре, науке и обществе",
+  "Discours_theme": "Тема дискурса",
   "Discussing": "Обсуждаемое",
   "Discussion rules": "Правила дискуссий",
-  "Discussion rules in social networks": "Правила сообществ самиздата в&nbsp;соцсетях",
   "Discussions": "Дискуссии",
   "Do you really want to reset all changes?": "Вы действительно хотите сбросить все изменения?",
   "Dogma": "Догма",
@@ -160,7 +168,7 @@
   "Help": "Помощь",
   "Help to edit": "Помочь редактировать",
   "Here you can customize your profile the way you want.": "Здесь можно настроить свой профиль так, как вы хотите.",
-  "Here you can manage all your Discourse subscriptions": "Здесь можно управлять всеми своими подписками на Дискурсе",
+  "Here you can manage all your Discours subscriptions": "Здесь можно управлять всеми своими подписками на Дискурсе",
   "Here you can upload your photo": "Здесь вы можете загрузить свою фотографию",
   "Hide table of contents": "Скрыть главление",
   "Highlight": "Подсветка",
@@ -168,11 +176,13 @@
   "Horizontal collaborative journalistic platform": "Открытая платформа<br/>для независимой журналистики",
   "Hot topics": "Горячие темы",
   "Hotkeys": "Горячие клавиши",
+  "How Discours works": "Как устроен Дискурс",
   "How can I help/skills": "Чем могу помочь/навыки",
   "How it works": "Как это работает",
   "How to help": "Как помочь?",
   "How to write a good article": "Как написать хорошую статью",
   "How to write an article": "Как написать статью",
+  "Hundreds of people from different countries and cities share their knowledge and art on the Discours. Join us!": "Сотни людей из разных стран и городов делятся своими знаниями и искусством на Дискурсе. Присоединяйтесь!",
   "I have an account": "У меня есть аккаунт!",
   "I have no account yet": "У меня еще нет аккаунта",
   "I know the password": "Я знаю пароль!",
@@ -181,6 +191,7 @@
   "Inbox": "Входящие",
   "Incut": "Подверстка",
   "Independant magazine with an open horizontal cooperation about culture, science and society": "Независимый журнал с открытой горизонтальной редакцией о культуре, науке и обществе",
+  "Independent media project about culture, science, art and society with horizontal editing": "Независимый медиапроект о культуре, науке, искусстве и обществе с горизонтальной редакцией",
   "Insert footnote": "Вставить сноску",
   "Insert video link": "Вставить ссылку на видео",
   "Interview": "Интервью",
@@ -205,13 +216,14 @@
   "Let's log in": "Давайте авторизуемся",
   "Link copied": "Ссылка скопирована",
   "Link sent, check your email": "Ссылка отправлена, проверьте почту",
+  "List of authors of the open editorial community": "Список авторов сообщества открытой редакции",
   "Lists": "Списки",
   "Literature": "Литература",
   "Load more": "Показать ещё",
   "Loading": "Загрузка",
   "Logout": "Выход",
   "Looks like you forgot to upload the video": "Похоже, что вы забыли загрузить видео",
-  "Manifest": "Манифест",
+  "Manifest of samizdat: principles and mission of an open magazine with a horizontal editorial board": "Манифест самиздата: принципы и миссия открытого журнала с горизонтальной редакцией",
   "Manifesto": "Манифест",
   "Many files, choose only one": "Много файлов, выберете один",
   "Mark as read": "Отметить прочитанным",
@@ -247,6 +259,7 @@
   "Ordered list": "Нумерованный список",
   "Our regular contributor": "Наш постоянный автор",
   "Paragraphs": "Абзацев",
+  "Participate in the Discours: share information, join the editorial team": "Participate in the Discours: share information, join the editorial team",
   "Participating": "Участвовать",
   "Participation": "Соучастие",
   "Partners": "Партнёры",
@@ -274,6 +287,7 @@
   "Popular authors": "Популярные авторы",
   "Preview": "Предпросмотр",
   "Principles": "Принципы сообщества",
+  "Professional principles that the open editorial team follows in its work": "Профессиональные принципы, которым открытая редакция следует в работе",
   "Profile": "Профиль",
   "Profile settings": "Настройки профиля",
   "Profile successfully saved": "Профиль успешно сохранён",
@@ -298,6 +312,7 @@
   "Required": "Поле обязательно для заполнения",
   "Resend code": "Выслать подтверждение",
   "Restore password": "Восстановить пароль",
+  "Rules of the journal Discours": "Правила журнала Дискурс",
   "Save": "Сохранить",
   "Save draft": "Сохранить черновик",
   "Save settings": "Сохранить настройки",
@@ -309,6 +324,7 @@
   "Sections": "Разделы",
   "Security": "Безопасность",
   "Select": "Выбрать",
+  "Self-publishing exists thanks to the help of wonderful people from all over the world. Thank you!": "Самиздат существуют благодаря помощи замечательных людей со всего мира. Спасибо Вам!",
   "Send": "Отправить",
   "Send link again": "Прислать ссылку ещё раз",
   "Settings": "Настройки",
@@ -346,12 +362,17 @@
   "Success": "Успешно",
   "Successfully authorized": "Авторизация успешна",
   "Suggest an idea": "Предложить идею",
+  "Support Discours": "Поддержите Дискурс",
   "Support the project": "Поддержать проект",
-  "Support us": "Помочь журналу",
   "Terms of use": "Правила сайта",
   "Text checking": "Проверка текста",
   "Thank you": "Благодарности",
+  "Thank you!": "Спасибо Вам!",
   "The address is already taken": "Адрес уже занят",
+  "The most interesting publications on the topic": "Самые интересные публикации по теме {topicName}",
+  "Thematic table of contents of the magazine. Here you can find all the topics that community authors have written about.": "Тематическое оглавление журнала. Здесь можно найти все темы, о которых писали авторы сообщества.",
+  "Thematic table of contents of the magazine. Here you can find all the topics that the community authors wrote about": "Тематическое оглавление журнала. Здесь можно найти все темы, о которых писали авторы сообщества",
+  "Themes and plots": "Темы и сюжеты",
   "Theory": "Теории",
   "There are unsaved changes in your profile settings. Are you sure you want to leave the page without saving?": "В настройках вашего профиля есть несохраненные изменения. Уверены, что хотите покинуть страницу без сохранения?",
   "There are unsaved changes in your publishing settings. Are you sure you want to leave the page without saving?": "В настройках публикации есть несохраненные изменения. Уверены, что хотите покинуть страницу без сохранения?",
@@ -401,6 +422,7 @@
   "Welcome to Discours to vote": "Войдите в Дискурс, чтобы голосовать",
   "Welcome!": "Добро пожаловать!",
   "Where": "Откуда",
+  "Why you can earn a hole in your karma and how to receive rays of gratitude for your contribution to discussions in samizdat communities": "За что можно заслужить дырку в карме и как получить лучи благодарности за вклад в дискуссии в сообществах самиздата",
   "Words": "Слов",
   "Work with us": "Сотрудничать с Дискурсом",
   "Write a comment...": "Написать комментарий...",
@@ -436,8 +458,8 @@
   "create_chat": "Создать чат",
   "create_group": "Создать группу",
   "delimiter": "разделитель",
-  "discourse_theme": "Тема дискурса",
   "discussion": "дискурс",
+  "dogma keywords": "Discours.io, догма, редакционные принципы, этический кодекс, журналистика, сообщество",
   "drafts": "черновики",
   "earlier": "ранее",
   "email not confirmed": "email не подтвержден",
@@ -453,6 +475,7 @@
   "italic": "курсив",
   "journal": "журнал",
   "jpg, .png, max. 10 mb.": "jpg, .png, макс. 10 мб.",
+  "keywords": "Discours.io, журнал Дискурс, Дискурс, культура, наука, искусство, общество, независимая журналистика, литература, музыка, кино, видео, фотографии",
   "literature": "литература",
   "marker list": "маркир. список",
   "min. 1400×1400 pix": "мин. 1400×1400 пикс.",
@@ -463,6 +486,7 @@
   "or sign in with social networks": "или войдите через соцсеть",
   "personal data usage and email notifications": "на обработку персональных данных и на получение почтовых уведомлений",
   "post": "пост",
+  "principles keywords": "Discours.io, сообщества, ценности, правила редакции, многоголосие, созидание",
   "register": "зарегистрируйтесь",
   "repeat": "повторить",
   "shout": "пост",
@@ -477,7 +501,9 @@
   "subscribers": "подписчиков",
   "subscribing...": "Подписка...",
   "terms of use": "правилами пользования сайтом",
+  "terms of use keywords": "Discours.io, правила сайта, terms of use",
   "today": "сегодня",
+  "topicKeywords": "{topic}, Discours.io, статьи, журналистика, исследования",
   "topics": "темы",
   "user already exist": "пользователь уже существует",
   "video": "видео",

public/robots.txt

@@ -1,2 +1,2 @@
 User-agent: *
-Disallow: /
+Allow: /

src/components/App.tsx

@@ -51,7 +51,6 @@ const pagesMap: Record<keyof typeof ROUTES, Component<PageProps>> = {
   authorAbout: AuthorPage,
   inbox: InboxPage,
   expo: ExpoPage,
-  expoLayout: ExpoPage,
   connect: ConnectPage,
   create: CreatePage,
   edit: EditPage,

src/components/Article/Comment/Comment.module.scss

@@ -4,7 +4,6 @@
   transition: background-color 0.3s;
   position: relative;
   list-style: none;
-  background: rgb(0 0 0 / 10%);
 
   @include media-breakpoint-down(sm) {
     padding-right: 0;

src/components/Article/FullArticle.tsx

@@ -2,7 +2,7 @@ import type { Author, Shout, Topic } from '../../graphql/schema/core.gen'
 
 import { getPagePath } from '@nanostores/router'
 import { createPopper } from '@popperjs/core'
-import { Link } from '@solidjs/meta'
+import { Link, Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 import { createEffect, For, createMemo, onMount, Show, createSignal, onCleanup } from 'solid-js'
 import { isServer } from 'solid-js/web'
@@ -14,7 +14,7 @@ import { MediaItem } from '../../pages/types'
 import { DEFAULT_HEADER_OFFSET, router, useRouter } from '../../stores/router'
 import { capitalize } from '../../utils/capitalize'
 import { getImageUrl } from '../../utils/getImageUrl'
-import { getDescription } from '../../utils/meta'
+import { getDescription, getKeywords } from '../../utils/meta'
 import { Icon } from '../_shared/Icon'
 import { Image } from '../_shared/Image'
 import { Lightbox } from '../_shared/Lightbox'
@@ -289,8 +289,26 @@ export const FullArticle = (props: Props) => {
     }
   }
 
+  const ogImage = props.article.cover
+    ? getImageUrl(props.article.cover, { width: 1200 })
+    : getImageUrl('production/image/logo_image.png')
+  const description = getDescription(props.article.description || body())
+  const ogTitle = props.article.title
+  const keywords = getKeywords(props.article)
+
   return (
     <>
+      <Meta name="descprition" content={description} />
+      <Meta name="keywords" content={keywords} />
+      <Meta name="og:type" content="article" />
+      <Meta name="og:title" content={ogTitle} />
+      <Meta name="og: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} />
+      <Meta name="twitter:image" content={ogImage} />
+
       <For each={imageUrls()}>{(imageUrl) => <Link rel="preload" as="image" href={imageUrl} />}</For>
       <div class="wide-container">
         <div class="row position-relative">
@@ -450,7 +468,7 @@ export const FullArticle = (props: Props) => {
                   <div class={styles.shoutStatsItem} ref={triggerRef}>
                     <SharePopup
                       title={props.article.title}
-                      description={getDescription(props.article.body)}
+                      description={description}
                       imageUrl={props.article.cover}
                       containerCssClass={stylesHeader.control}
                       trigger={
@@ -484,7 +502,7 @@ export const FullArticle = (props: Props) => {
                 isOwner={canEdit()}
                 containerCssClass={clsx(stylesHeader.control, styles.articlePopupOpener)}
                 title={props.article.title}
-                description={getDescription(props.article.body)}
+                description={description}
                 imageUrl={props.article.cover}
                 shareUrl={getShareUrl({ pathname: `/${props.article.slug}` })}
                 trigger={

src/components/Discours/Footer.tsx

@@ -17,7 +17,7 @@ export const Footer = () => {
       header: 'About the project',
       items: [
         {
-          title: 'Manifest',
+          title: 'Discours Manifest',
           slug: '/about/manifest',
         },
         {
@@ -51,7 +51,7 @@ export const Footer = () => {
           slug: '/create',
         },
         {
-          title: 'Support us',
+          title: 'Support Discours',
           slug: '/about/help',
         },
         {

src/components/Feed/ArticleCard/ArticleCard.tsx

@@ -46,7 +46,7 @@ export type ArticleCardProps = {
     withViewed?: boolean
     noAuthorLink?: boolean
   }
-  desktopCoverSize: 'XS' | 'S' | 'M' | 'L'
+  desktopCoverSize?: 'XS' | 'S' | 'M' | 'L'
   article: Shout
 }
 
@@ -114,6 +114,7 @@ export const ArticleCard = (props: ArticleCardProps) => {
   const [isCoverImageLoadError, setIsCoverImageLoadError] = createSignal(false)
   const [isCoverImageLoading, setIsCoverImageLoading] = createSignal(true)
 
+  const description = getDescription(props.article.body)
   return (
     <section
       class={clsx(styles.shoutCard, props.settings?.additionalClass, {
@@ -325,7 +326,7 @@ export const ArticleCard = (props: ArticleCardProps) => {
                     <SharePopup
                       containerCssClass={stylesHeader.control}
                       title={title}
-                      description={getDescription(props.article.body)}
+                      description={description}
                       imageUrl={props.article.cover}
                       shareUrl={getShareUrl({ pathname: `/${props.article.slug}` })}
                       isVisible={(value) => setIsActionPopupActive(value)}
@@ -348,7 +349,7 @@ export const ArticleCard = (props: ArticleCardProps) => {
                   isOwner={canEdit()}
                   containerCssClass={stylesHeader.control}
                   title={title}
-                  description={getDescription(props.article.body)}
+                  description={description}
                   imageUrl={props.article.cover}
                   shareUrl={getShareUrl({ pathname: `/${props.article.slug}` })}
                   isVisible={(value) => setIsActionPopupActive(value)}

src/components/Feed/Sidebar/Sidebar.module.scss

@@ -29,12 +29,6 @@
     white-space: nowrap;
   }
 
-  a:hover {
-    .sidebarItemName {
-      background: #000;
-    }
-  }
-
   .userpic {
     margin-right: 1.2rem;
   }
@@ -108,12 +102,13 @@
     }
 
     &:hover {
-      img {
+      .sidebarItemName,
-        filter: invert(1);
+      .counter {
+        background: var(--background-color-invert);
       }
 
-      .counter {
+      img {
-        background: #000;
+        filter: invert(1);
       }
     }
   }

src/components/Nav/ConfirmModal/ConfirmModal.module.scss

@@ -4,6 +4,7 @@
 
   .confirmModalTitle {
     @include font-size(3.2rem);
+
     color: var(--default-color);
     font-weight: 700;
     margin: 0 3rem;

src/components/ProfileSettings/ProfileSettings.tsx

@@ -259,7 +259,7 @@ export const ProfileSettings = () => {
                       </Show>
                     </div>
 
-                    <h4>{t('Address on Discourse')}</h4>
+                    <h4>{t('Address on Discours')}</h4>
                     <div class="pretty-form__item">
                       <div class={styles.discoursName}>
                         <label for="user-address">https://{hostname()}/author/</label>

src/components/Views/AllAuthors.tsx

@@ -1,5 +1,6 @@
 import type { Author } from '../../graphql/schema/core.gen'
 
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 import { createEffect, createMemo, createSignal, For, Show } from 'solid-js'
 
@@ -7,7 +8,9 @@ import { useLocalize } from '../../context/localize'
 import { useRouter } from '../../stores/router'
 import { setAuthorsSort, useAuthorsStore } from '../../stores/zine/authors'
 import { dummyFilter } from '../../utils/dummyFilter'
+import { getImageUrl } from '../../utils/getImageUrl'
 import { scrollHandler } from '../../utils/scroll'
+import { Loading } from '../_shared/Loading'
 import { SearchField } from '../_shared/SearchField'
 import { AuthorBadge } from '../Author/AuthorBadge'
 
@@ -17,14 +20,15 @@ type AllAuthorsPageSearchParams = {
   by: '' | 'name' | 'shouts' | 'followers'
 }
 
-type AllAuthorsViewProps = {
+type Props = {
   authors: Author[]
+  isLoaded: boolean
 }
 
 const PAGE_SIZE = 20
 const ALPHABET = [...'АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ@']
 
-export const AllAuthorsView = (props: AllAuthorsViewProps) => {
+export const AllAuthorsView = (props: Props) => {
   const { t, lang } = useLocalize()
   const [limit, setLimit] = createSignal(PAGE_SIZE)
   const { searchParams, changeSearchParam } = useRouter<AllAuthorsPageSearchParams>()
@@ -82,7 +86,25 @@ export const AllAuthorsView = (props: AllAuthorsViewProps) => {
   })
 
   const showMore = () => setLimit((oldLimit) => oldLimit + PAGE_SIZE)
-  const AllAuthorsHead = () => (
+
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Authors')
+  const description = t('List of authors of the open editorial community')
+
+  return (
+    <div class={clsx(styles.allAuthorsPage, 'wide-container')}>
+      <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} />
+      <Show when={props.isLoaded} fallback={<Loading />}>
+        <div class="offset-md-5">
           <div class="row">
             <div class="col-lg-20 col-xl-18">
               <h1>{t('Authors')}</h1>
@@ -109,14 +131,8 @@ export const AllAuthorsView = (props: AllAuthorsViewProps) => {
               </ul>
             </div>
           </div>
-  )
 
-  return (
-    <div class={clsx(styles.allAuthorsPage, 'wide-container')}>
           <Show when={sortedAuthors().length > 0}>
-        <div class="offset-md-5">
-          <AllAuthorsHead />
-
             <Show when={searchParams().by === 'name'}>
               <div class="row">
                 <div class="col-lg-20 col-xl-18">
@@ -190,6 +206,7 @@ export const AllAuthorsView = (props: AllAuthorsViewProps) => {
                 </div>
               </div>
             </Show>
+          </Show>
         </div>
       </Show>
     </div>

src/components/Views/AllTopics.tsx

@@ -1,5 +1,6 @@
 import type { Topic } from '../../graphql/schema/core.gen'
 
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 import { createEffect, createMemo, createSignal, For, Show } from 'solid-js'
 
@@ -9,7 +10,9 @@ import { useRouter } from '../../stores/router'
 import { setTopicsSort, useTopicsStore } from '../../stores/zine/topics'
 import { capitalize } from '../../utils/capitalize'
 import { dummyFilter } from '../../utils/dummyFilter'
+import { getImageUrl } from '../../utils/getImageUrl'
 import { scrollHandler } from '../../utils/scroll'
+import { Loading } from '../_shared/Loading'
 import { SearchField } from '../_shared/SearchField'
 import { TopicCard } from '../Topic/Card'
 
@@ -19,13 +22,14 @@ type AllTopicsPageSearchParams = {
   by: 'shouts' | 'authors' | 'title' | ''
 }
 
-type AllTopicsViewProps = {
+type Props = {
   topics: Topic[]
+  isLoaded: boolean
 }
 
 const PAGE_SIZE = 20
 
-export const AllTopicsView = (props: AllTopicsViewProps) => {
+export const AllTopicsView = (props: Props) => {
   const { t, lang } = useLocalize()
   const { searchParams, changeSearchParam } = useRouter<AllTopicsPageSearchParams>()
   const [limit, setLimit] = createSignal(PAGE_SIZE)
@@ -106,8 +110,25 @@ export const AllTopicsView = (props: AllTopicsViewProps) => {
     </div>
   )
 
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Themes and plots')
+  const description = t(
+    'Thematic table of contents of the magazine. Here you can find all the topics that the community authors wrote about',
+  )
+
   return (
     <div class={clsx(styles.allTopicsPage, 'wide-container')}>
+      <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} />
+      <Show when={props.isLoaded} fallback={<Loading />}>
         <div class="row">
           <div class="col-md-19 offset-md-5">
             <AllTopicsHead />
@@ -204,6 +225,7 @@ export const AllTopicsView = (props: AllTopicsViewProps) => {
             </Show>
           </div>
         </div>
+      </Show>
     </div>
   )
 }

src/components/Views/Author/Author.tsx

@@ -1,6 +1,7 @@
 import type { Author, Shout, Topic } from '../../../graphql/schema/core.gen'
 
 import { getPagePath } from '@nanostores/router'
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 import { Show, createMemo, createSignal, Switch, onMount, For, Match, createEffect } from 'solid-js'
 
@@ -9,6 +10,8 @@ import { apiClient } from '../../../graphql/client/core'
 import { router, useRouter } from '../../../stores/router'
 import { loadShouts, useArticlesStore } from '../../../stores/zine/articles'
 import { useAuthorsStore } from '../../../stores/zine/authors'
+import { getImageUrl } from '../../../utils/getImageUrl'
+import { getDescription } from '../../../utils/meta'
 import { restoreScrollPosition, saveScrollPosition } from '../../../utils/scroll'
 import { splitToPages } from '../../../utils/splitToPages'
 import { Loading } from '../../_shared/Loading'
@@ -127,8 +130,23 @@ export const AuthorView = (props: Props) => {
     }
   })
 
+  const ogImage = props.author?.userpic
+    ? getImageUrl(props.author.userpic, { width: 1200 })
+    : getImageUrl('production/image/logo_image.png')
+  const description = getDescription(props.author?.bio)
+  const ogTitle = props.author?.name
+
   return (
     <div class={styles.authorPage}>
+      <Meta name="descprition" content={description} />
+      <Meta name="og:type" content="profile" />
+      <Meta name="og:title" content={ogTitle} />
+      <Meta name="og: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} />
+      <Meta name="twitter:image" content={ogImage} />
       <div class="wide-container">
         <Show when={author()} fallback={<Loading />}>
           <>

src/components/Views/Expo/Expo.tsx

@@ -3,38 +3,63 @@ import { clsx } from 'clsx'
 import { createEffect, createMemo, createSignal, For, on, onCleanup, onMount, Show } from 'solid-js'
 
 import { useLocalize } from '../../../context/localize'
-import { LoadShoutsOptions, Shout } from '../../../graphql/schema/core.gen'
+import {
+  LoadRandomTopShoutsParams,
+  LoadShoutsFilters,
+  LoadShoutsOptions,
+  Shout,
+} from '../../../graphql/schema/core.gen'
 import { LayoutType } from '../../../pages/types'
-import { router, useRouter } from '../../../stores/router'
+import { router } from '../../../stores/router'
 import { loadShouts, resetSortedArticles, useArticlesStore } from '../../../stores/zine/articles'
+import { apiClient } from '../../../utils/apiClient'
+import { getServerDate } from '../../../utils/getServerDate'
 import { restoreScrollPosition, saveScrollPosition } from '../../../utils/scroll'
 import { splitToPages } from '../../../utils/splitToPages'
 import { Button } from '../../_shared/Button'
 import { ConditionalWrapper } from '../../_shared/ConditionalWrapper'
 import { Loading } from '../../_shared/Loading'
+import { ArticleCardSwiper } from '../../_shared/SolidSwiper/ArticleCardSwiper'
 import { ArticleCard } from '../../Feed/ArticleCard'
 
 import styles from './Expo.module.scss'
 
 type Props = {
   shouts: Shout[]
+  layout: LayoutType
 }
-export const PRERENDERED_ARTICLES_COUNT = 28
+
+export const PRERENDERED_ARTICLES_COUNT = 24
 const LOAD_MORE_PAGE_SIZE = 16
+
 export const Expo = (props: Props) => {
   const [isLoaded, setIsLoaded] = createSignal<boolean>(Boolean(props.shouts))
   const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false)
 
+  const [randomTopArticles, setRandomTopArticles] = createSignal<Shout[]>([])
+  const [randomTopMonthArticles, setRandomTopMonthArticles] = createSignal<Shout[]>([])
+
   const { t } = useLocalize()
-  const { page: getPage } = useRouter()
+
-  const getLayout = createMemo<LayoutType>(() => getPage().params['layout'] as LayoutType)
   const { sortedArticles } = useArticlesStore({
     shouts: isLoaded() ? props.shouts : [],
   })
 
-  const loadMore = async (count) => {
+  const getLoadShoutsFilters = (filters: LoadShoutsFilters = {}): LoadShoutsFilters => {
-    saveScrollPosition()
+    const result = { ...filters }
+
+    if (props.layout) {
+      filters.layout = props.layout
+    } else {
+      filters.excludeLayout = 'article'
+    }
+
+    return result
+  }
+
+  const loadMore = async (count: number) => {
     const options: LoadShoutsOptions = {
+      filters: getLoadShoutsFilters(),
       limit: count,
       offset: sortedArticles().length,
     }
@@ -45,9 +70,39 @@ export const Expo = (props: Props) => {
 
     const { hasMore } = await loadShouts(options)
     setIsLoadMoreButtonVisible(hasMore)
+  }
+
+  const loadMoreWithoutScrolling = async (count: number) => {
+    saveScrollPosition()
+    await loadMore(count)
     restoreScrollPosition()
   }
 
+  const loadRandomTopArticles = async () => {
+    const params: LoadRandomTopShoutsParams = {
+      filters: getLoadShoutsFilters(),
+      limit: 10,
+      fromRandomCount: 100,
+    }
+
+    const result = await apiClient.getRandomTopShouts(params)
+    setRandomTopArticles(result)
+  }
+
+  const loadRandomTopMonthArticles = async () => {
+    const now = new Date()
+    const fromDate = getServerDate(new Date(now.setMonth(now.getMonth() - 1)))
+
+    const params: LoadRandomTopShoutsParams = {
+      filters: getLoadShoutsFilters({ fromDate }),
+      limit: 10,
+      fromRandomCount: 10,
+    }
+
+    const result = await apiClient.getRandomTopShouts(params)
+    setRandomTopMonthArticles(result)
+  }
+
   const pages = createMemo<Shout[][]>(() =>
     splitToPages(sortedArticles(), PRERENDERED_ARTICLES_COUNT, LOAD_MORE_PAGE_SIZE),
   )
@@ -65,14 +120,21 @@ export const Expo = (props: Props) => {
     if (sortedArticles().length === PRERENDERED_ARTICLES_COUNT) {
       loadMore(LOAD_MORE_PAGE_SIZE)
     }
+
+    loadRandomTopArticles()
+    loadRandomTopMonthArticles()
   })
 
   createEffect(
     on(
-      () => getLayout(),
+      () => props.layout,
       () => {
         resetSortedArticles()
+        setRandomTopArticles([])
+        setRandomTopMonthArticles([])
         loadMore(PRERENDERED_ARTICLES_COUNT + LOAD_MORE_PAGE_SIZE)
+        loadRandomTopArticles()
+        loadRandomTopMonthArticles()
       },
       { defer: true },
     ),
@@ -83,7 +145,7 @@ export const Expo = (props: Props) => {
   })
 
   const handleLoadMoreClick = () => {
-    loadMore(LOAD_MORE_PAGE_SIZE)
+    loadMoreWithoutScrolling(LOAD_MORE_PAGE_SIZE)
   }
 
   return (
@@ -91,19 +153,19 @@ export const Expo = (props: Props) => {
       <Show when={sortedArticles().length > 0} fallback={<Loading />}>
         <div class="wide-container">
           <ul class={clsx('view-switcher', styles.navigation)}>
-            <li class={clsx({ 'view-switcher__item--selected': !getLayout() })}>
+            <li class={clsx({ 'view-switcher__item--selected': !props.layout })}>
               <ConditionalWrapper
-                condition={Boolean(getLayout())}
+                condition={Boolean(props.layout)}
-                wrapper={(children) => <a href={getPagePath(router, 'expo')}>{children}</a>}
+                wrapper={(children) => <a href={getPagePath(router, 'expo', { layout: '' })}>{children}</a>}
               >
                 <span class={clsx('linkReplacement')}>{t('All')}</span>
               </ConditionalWrapper>
             </li>
-            <li class={clsx({ 'view-switcher__item--selected': getLayout() === 'literature' })}>
+            <li class={clsx({ 'view-switcher__item--selected': props.layout === 'literature' })}>
               <ConditionalWrapper
-                condition={getLayout() !== 'literature'}
+                condition={props.layout !== 'literature'}
                 wrapper={(children) => (
-                  <a href={getPagePath(router, 'expoLayout', { layout: 'literature' })}>{children}</a>
+                  <a href={getPagePath(router, 'expo', { layout: 'literature' })}>{children}</a>
                 )}
               >
                 <span class={clsx('linkReplacement')}>{t('Literature')}</span>
@@ -119,21 +181,21 @@ export const Expo = (props: Props) => {
                 <span class={clsx('linkReplacement')}>{t('Music')}</span>
               </ConditionalWrapper>
             </li>
-            <li class={clsx({ 'view-switcher__item--selected': getLayout() === 'image' })}>
+            <li class={clsx({ 'view-switcher__item--selected': props.layout === 'image' })}>
               <ConditionalWrapper
-                condition={getLayout() !== 'image'}
+                condition={props.layout !== 'image'}
                 wrapper={(children) => (
-                  <a href={getPagePath(router, 'expoLayout', { layout: 'image' })}>{children}</a>
+                  <a href={getPagePath(router, 'expo', { layout: 'image' })}>{children}</a>
                 )}
               >
                 <span class={clsx('linkReplacement')}>{t('Gallery')}</span>
               </ConditionalWrapper>
             </li>
-            <li class={clsx({ 'view-switcher__item--selected': getLayout() === 'video' })}>
+            <li class={clsx({ 'view-switcher__item--selected': props.layout === 'video' })}>
               <ConditionalWrapper
-                condition={getLayout() !== 'video'}
+                condition={props.layout !== 'video'}
                 wrapper={(children) => (
-                  <a href={getPagePath(router, 'expoLayout', { layout: 'video' })}>{children}</a>
+                  <a href={getPagePath(router, 'expo', { layout: 'video' })}>{children}</a>
                 )}
               >
                 <span class={clsx('cursorPointer linkReplacement')}>{t('Video')}</span>
@@ -141,7 +203,7 @@ export const Expo = (props: Props) => {
             </li>
           </ul>
           <div class="row">
-            <For each={sortedArticles().slice(0, PRERENDERED_ARTICLES_COUNT)}>
+            <For each={sortedArticles().slice(0, PRERENDERED_ARTICLES_COUNT / 2)}>
               {(shout) => (
                 <div class="col-md-6 mt-md-5 col-sm-8 mt-sm-3">
                   <ArticleCard
@@ -152,6 +214,23 @@ export const Expo = (props: Props) => {
                 </div>
               )}
             </For>
+            <Show when={randomTopMonthArticles().length > 0} keyed={true}>
+              <ArticleCardSwiper title={t('Top month articles')} slides={randomTopMonthArticles()} />
+            </Show>
+            <For each={sortedArticles().slice(PRERENDERED_ARTICLES_COUNT / 2, PRERENDERED_ARTICLES_COUNT)}>
+              {(shout) => (
+                <div class="col-md-6 mt-md-5 col-sm-8 mt-sm-3">
+                  <ArticleCard
+                    article={shout}
+                    settings={{ nodate: true, nosubtitle: true, noAuthorLink: true }}
+                    desktopCoverSize="XS"
+                  />
+                </div>
+              )}
+            </For>
+            <Show when={randomTopArticles().length > 0} keyed={true}>
+              <ArticleCardSwiper title={t('Favorite')} slides={randomTopArticles()} />
+            </Show>
             <For each={pages()}>
               {(page) => (
                 <For each={page}>

src/components/Views/Feed/Feed.tsx

@@ -1,28 +1,32 @@
 import type { Author, LoadShoutsOptions, Reaction, Shout } from '../../graphql/schema/core.gen'
 
 import { getPagePath } from '@nanostores/router'
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 import { createEffect, createSignal, For, on, onMount, Show } from 'solid-js'
 
-import { useLocalize } from '../../context/localize'
+import { useLocalize } from '../../../context/localize'
-import { useReactions } from '../../context/reactions'
+import { useReactions } from '../../../context/reactions'
-import { router, useRouter } from '../../stores/router'
+import { router, useRouter } from '../../../stores/router'
-import { useArticlesStore, resetSortedArticles } from '../../stores/zine/articles'
+import { useArticlesStore, resetSortedArticles } from '../../../stores/zine/articles'
-import { useTopAuthorsStore } from '../../stores/zine/topAuthors'
+import { useTopAuthorsStore } from '../../../stores/zine/topAuthors'
-import { useTopicsStore } from '../../stores/zine/topics'
+import { useTopicsStore } from '../../../stores/zine/topics'
-import { Icon } from '../_shared/Icon'
+import { apiClient } from '../../../utils/apiClient'
-import { Loading } from '../_shared/Loading'
+import { getImageUrl } from '../../../utils/getImageUrl'
-import { CommentDate } from '../Article/CommentDate'
+import { Icon } from '../../_shared/Icon'
-import { AuthorLink } from '../Author/AhtorLink'
+import { Loading } from '../../_shared/Loading'
-import { AuthorBadge } from '../Author/AuthorBadge'
+import { CommentDate } from '../../Article/CommentDate'
-import { ArticleCard } from '../Feed/ArticleCard'
+import { AuthorLink } from '../../Author/AhtorLink'
-import { Sidebar } from '../Feed/Sidebar'
+import { AuthorBadge } from '../../Author/AuthorBadge'
+import { ArticleCard } from '../../Feed/ArticleCard'
+import { Sidebar } from '../../Feed/Sidebar'
 
 import styles from './Feed.module.scss'
-import stylesBeside from '../../components/Feed/Beside.module.scss'
+import stylesBeside from '../../Feed/Beside.module.scss'
-import stylesTopic from '../Feed/CardTopic.module.scss'
+import stylesTopic from '../../Feed/CardTopic.module.scss'
 
 export const FEED_PAGE_SIZE = 20
+const UNRATED_ARTICLES_COUNT = 5
 
 type FeedSearchParams = {
   by: 'publish_date' | 'rating' | 'last_comment'
@@ -58,13 +62,20 @@ export const FeedView = (props: Props) => {
   const { topAuthors } = useTopAuthorsStore()
   const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false)
   const [topComments, setTopComments] = createSignal<Reaction[]>([])
+  const [unratedArticles, setUnratedArticles] = createSignal<Shout[]>([])
 
   const {
     actions: { loadReactionsBy },
   } = useReactions()
 
+  const loadUnratedArticles = async () => {
+    const result = await apiClient.getUnratedShouts(UNRATED_ARTICLES_COUNT)
+    setUnratedArticles(result)
+  }
+
   onMount(() => {
     loadMore()
+    loadUnratedArticles()
   })
 
   createEffect(
@@ -113,8 +124,24 @@ export const FeedView = (props: Props) => {
     setTopComments(comments)
   })
 
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const description = t(
+    'Independent media project about culture, science, art and society with horizontal editing',
+  )
+  const ogTitle = t('Feed')
+
   return (
     <div class="wide-container feed">
+      <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} />
       <div class="row">
         <div class={clsx('col-md-5 col-xl-4', styles.feedNavigation)}>
           <Sidebar />
@@ -253,6 +280,14 @@ export const FeedView = (props: Props) => {
               </li>
             </ul>
           </section>
+          <Show when={unratedArticles().length > 0}>
+            <section class={clsx(styles.asideSection)}>
+              <h4>{t('Be the first to rate')}</h4>
+              <For each={unratedArticles()}>
+                {(article) => <ArticleCard article={article} settings={{ noimage: true, nodate: true }} />}
+              </For>
+            </section>
+          </Show>
         </aside>
       </div>
     </div>

src/components/Views/Feed/index.ts

@@ -0,0 +1 @@
+export { Feed } from './Feed'

src/components/Views/ProfileSubscriptions/ProfileSubscriptions.tsx

@@ -72,7 +72,7 @@ export const ProfileSubscriptions = () => {
           <div class="row">
             <div class="col-md-20 col-lg-18 col-xl-16">
               <h1>{t('My subscriptions')}</h1>
-              <p class="description">{t('Here you can manage all your Discourse subscriptions')}</p>
+              <p class="description">{t('Here you can manage all your Discours subscriptions')}</p>
               <Show when={following()} fallback={<Loading />}>
                 <ul class="view-switcher">
                   <li class={clsx({ 'view-switcher__item--selected': subscriptionFilter() === 'all' })}>

src/components/Views/Search.tsx

@@ -29,17 +29,14 @@ export const SearchView = (props: Props) => {
 
   const { searchParams } = useRouter<SearchPageSearchParams>()
   let searchEl: HTMLInputElement
-  const handleQueryChange = (_ev) => {
+  const handleQueryChange = () => {
     setQuery(searchEl.value)
   }
 
   const loadMore = async () => {
     saveScrollPosition()
     const { hasMore } = await loadShouts({
-      filters: {
+      filters: {},
-        title: query(),
-        body: query(),
-      },
       offset: offset(),
       limit: LOAD_MORE_PAGE_SIZE,
     })

src/components/Views/StaticPage.tsx

@@ -3,22 +3,21 @@ import { JSX } from 'solid-js'
 import { PageLayout } from '../_shared/PageLayout'
 import { TableOfContents } from '../TableOfContents'
 
-export const StaticPage = (props: {
+type Props = {
   title: string
   children: JSX.Element
-  layoutChildren: JSX.Element
+}
-}) => {
+export const StaticPage = (props: Props) => {
-  let articleBodyElement: HTMLElement | undefined
+  const articleBodyElement: { current: HTMLElement } = { current: null }
 
   return (
     <PageLayout title={props.title}>
-      {props.layoutChildren}
       <div class="wide-container">
         <div class="row">
           <article
             class="col-md-16 col-lg-14 col-xl-12 offset-md-5"
             id="articleBody"
-            ref={articleBodyElement}
+            ref={(el) => (articleBodyElement.current = el)}
           >
             {props.children}
           </article>
@@ -27,7 +26,7 @@ export const StaticPage = (props: {
             <TableOfContents
               variant="article"
               parentSelector="#articleBody"
-              body={articleBodyElement.outerHTML}
+              body={articleBodyElement.current.outerHTML}
             />
           </div>
         </div>

src/components/Views/Topic.tsx

@@ -1,15 +1,20 @@
 import type { Shout, Topic } from '../../graphql/schema/core.gen'
 
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
-import { For, Show, createMemo, onMount, createSignal } from 'solid-js'
+import { For, Show, createMemo, onMount, createSignal, createEffect } from 'solid-js'
 
 import { useLocalize } from '../../context/localize'
 import { useRouter } from '../../stores/router'
 import { loadShouts, useArticlesStore } from '../../stores/zine/articles'
 import { useAuthorsStore } from '../../stores/zine/authors'
 import { useTopicsStore } from '../../stores/zine/topics'
+import { capitalize } from '../../utils/capitalize'
+import { getImageUrl } from '../../utils/getImageUrl'
+import { getDescription } from '../../utils/meta'
 import { restoreScrollPosition, saveScrollPosition } from '../../utils/scroll'
 import { splitToPages } from '../../utils/splitToPages'
+import { Loading } from '../_shared/Loading'
 import { ArticleCardSwiper } from '../_shared/SolidSwiper/ArticleCardSwiper'
 import { Beside } from '../Feed/Beside'
 import { Row1 } from '../Feed/Row1'
@@ -23,16 +28,18 @@ type TopicsPageSearchParams = {
   by: 'comments' | '' | 'recent' | 'viewed' | 'rating' | 'commented'
 }
 
-interface TopicProps {
+interface Props {
   topic: Topic
   shouts: Shout[]
   topicSlug: string
+  isLoaded: boolean
+  title: (val: string) => string
 }
 
 export const PRERENDERED_ARTICLES_COUNT = 28
 const LOAD_MORE_PAGE_SIZE = 9 // Row3 + Row3 + Row3
 
-export const TopicView = (props: TopicProps) => {
+export const TopicView = (props: Props) => {
   const { t } = useLocalize()
   const { searchParams, changeSearchParam } = useRouter<TopicsPageSearchParams>()
 
@@ -80,8 +87,30 @@ export const TopicView = (props: TopicProps) => {
     splitToPages(sortedArticles(), PRERENDERED_ARTICLES_COUNT, LOAD_MORE_PAGE_SIZE),
   )
 
+  const pageTitle = `#${capitalize(topic().title, true)}`
+  createEffect(() => props.title(pageTitle))
+
+  const ogImage = topic().pic
+    ? getImageUrl(topic().pic, { width: 1200 })
+    : getImageUrl('production/image/logo_image.png')
+  const description = topic().body
+    ? getDescription(topic().body)
+    : t('The most interesting publications on the topic', { topicName: pageTitle })
+  const ogTitle = pageTitle
+
   return (
     <div class={styles.topicPage}>
+      <Meta name="descprition" content={description} />
+      <Meta name="keywords" content={t('topicKeywords', { topic: topic().title })} />
+      <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} />
+      <Show when={props.isLoaded} fallback={<Loading />}>
         <Show when={topic()}>
           <FullTopic topic={topic()} />
           <div class="wide-container">
@@ -177,6 +206,7 @@ export const TopicView = (props: TopicProps) => {
             </p>
           </Show>
         </Show>
+      </Show>
     </div>
   )
 }

src/components/_shared/SolidSwiper/Swiper.module.scss

@@ -85,6 +85,7 @@
         }
       }
     }
+
     &.mobileView {
       .container {
         flex-direction: column-reverse;
@@ -100,7 +101,7 @@
           padding: 0;
 
           & swiper-slide {
-            //bind to html element <swiper-slide/>
+            // bind to html element <swiper-slide/>
             width: unset !important;
           }
 

src/graphql/query/articles-load-random-top.ts

@@ -0,0 +1,46 @@
+import { gql } from '@urql/core'
+
+export default gql`
+  query LoadRandomTopShoutsQuery($params: LoadRandomTopShoutsParams) {
+    loadRandomTopShouts(params: $params) {
+      id
+      title
+      lead
+      description
+      subtitle
+      slug
+      layout
+      cover
+      lead
+      # community
+      mainTopic
+      topics {
+        id
+        title
+        body
+        slug
+        stat {
+          shouts
+          authors
+          followers
+        }
+      }
+      authors {
+        id
+        name
+        slug
+        userpic
+        createdAt
+        bio
+      }
+      createdAt
+      publishedAt
+      stat {
+        viewed
+        reacted
+        rating
+        commented
+      }
+    }
+  }
+`

src/graphql/query/articles-load-unrated.ts

@@ -0,0 +1,46 @@
+import { gql } from '@urql/core'
+
+export default gql`
+  query LoadUnratedShoutsQuery($limit: Int!) {
+    loadUnratedShouts(limit: $limit) {
+      id
+      title
+      lead
+      description
+      subtitle
+      slug
+      layout
+      cover
+      lead
+      # community
+      mainTopic
+      topics {
+        id
+        title
+        body
+        slug
+        stat {
+          shouts
+          authors
+          followers
+        }
+      }
+      authors {
+        id
+        name
+        slug
+        userpic
+        createdAt
+        bio
+      }
+      createdAt
+      publishedAt
+      stat {
+        viewed
+        reacted
+        rating
+        commented
+      }
+    }
+  }
+`

src/pages/about/discussionRules.page.tsx

@@ -1,37 +1,52 @@
-import { PageLayout } from '../../components/_shared/PageLayout'
+import { Meta } from '@solidjs/meta'
+
+import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const DiscussionRulesPage = () => {
   const { t } = useLocalize()
-  const title = t('Discussion rules in social networks')
+
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Community Discussion Rules')
+  const description = t(
+    'Why you can earn a hole in your karma and how to receive rays of gratitude for your contribution to discussions in samizdat communities',
+  )
+
   return (
-    <PageLayout title={title}>
+    <StaticPage title={ogTitle}>
       <article class="wide-container container--static-page">
-        <div class="row">
+        <Meta name="descprition" content={description} />
-          <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
+        <Meta name="keywords" content={t('principles keywords')} />
-            <h1>
+        <Meta name="og:type" content="article" />
-              <span class="wrapped" innerHTML={title} />
+        <Meta name="og:title" content={ogTitle} />
-            </h1>
+        <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>{ogTitle}</h1>
 
         <p>
-              Открытая редакция существует благодаря дружному сообществу авторов
+          Открытая редакция существует благодаря дружному сообществу авторов и&nbsp;читателей&nbsp;&mdash;
-              и&nbsp;читателей&nbsp;&mdash; вдумчивых и&nbsp;сознательных людей, приверженных ценностям
+          вдумчивых и&nbsp;сознательных людей, приверженных ценностям гуманизма, демократии и&nbsp;прав
-              гуманизма, демократии и&nbsp;прав человека. Мы&nbsp;очень ценим атмосферу осмысленного
+          человека. Мы&nbsp;очень ценим атмосферу осмысленного общения, которая здесь сложилась. Чтобы
-              общения, которая здесь сложилась. Чтобы сохранить ее&nbsp;такой&nbsp;же уютной
+          сохранить ее&nbsp;такой&nbsp;же уютной и&nbsp;творческой, мы&nbsp;составили правила общения
-              и&nbsp;творческой, мы&nbsp;составили правила общения в&nbsp;сообществе, руководствуясь
+          в&nbsp;сообществе, руководствуясь которыми каждый мог&nbsp;бы соучаствовать в&nbsp;плодотворных
-              которыми каждый мог&nbsp;бы соучаствовать в&nbsp;плодотворных дискуссиях, не&nbsp;задевая
+          дискуссиях, не&nbsp;задевая других. Ключевой принцип этих правил предельно прост&nbsp;&mdash;
-              других. Ключевой принцип этих правил предельно прост&nbsp;&mdash; уважайте ближних,
+          уважайте ближних, постарайтесь не&nbsp;нарушать законы Российской Федерации без крайней
-              постарайтесь не&nbsp;нарушать законы Российской Федерации без крайней
+          на&nbsp;то&nbsp;необходимости и&nbsp;помните, что в&nbsp;дискуссиях чутких и&nbsp;здравомыслящих
-              на&nbsp;то&nbsp;необходимости и&nbsp;помните, что в&nbsp;дискуссиях чутких
+          людей рождается истина.
-              и&nbsp;здравомыслящих людей рождается истина.
         </p>
 
         <h3>За&nbsp;что можно получить дырку в&nbsp;карме и&nbsp;выиграть бан в&nbsp;сообществе</h3>
         <ol>
           <li>
             <p>
-                  Оскорбления, личные нападки, травля и&nbsp;угрозы. В&nbsp;любом виде. Конкретного человека
+              Оскорбления, личные нападки, травля и&nbsp;угрозы. В&nbsp;любом виде. Конкретного человека или
-                  или социальной группы&nbsp;&mdash; не&nbsp;суть. Агрессия, переход на&nbsp;личности
+              социальной группы&nbsp;&mdash; не&nbsp;суть. Агрессия, переход на&nbsp;личности
               и&nbsp;токсичность едва&nbsp;ли способствуют плодотворному общению.
             </p>
           </li>
@@ -45,9 +60,8 @@ export const DiscussionRulesPage = () => {
 
           <li>
             <p>
-                  Спам, реклама, фейкньюз, ссылки на&nbsp;пропагандистские СМИ, вбросы дезинформации,
+              Спам, реклама, фейкньюз, ссылки на&nbsp;пропагандистские СМИ, вбросы дезинформации, специально
-                  специально уводящий от&nbsp;темы флуд, провокации, разжигание конфликтов, намеренный срыв
+              уводящий от&nbsp;темы флуд, провокации, разжигание конфликтов, намеренный срыв дискуссий.
-                  дискуссий.
             </p>
           </li>
 
@@ -67,35 +81,33 @@ export const DiscussionRulesPage = () => {
         <ol>
           <li>
             <p>
-                  <strong>Вежливость и&nbsp;конструктивность.</strong> Мы&nbsp;выступаем
+              <strong>Вежливость и&nbsp;конструктивность.</strong> Мы&nbsp;выступаем за&nbsp;конструктивный
-                  за&nbsp;конструктивный диалог, аргументированные комментарии и&nbsp;доброжелательное
+              диалог, аргументированные комментарии и&nbsp;доброжелательное отношение друг к&nbsp;другу.
-                  отношение друг к&nbsp;другу. Задавайте содержательные вопросы, пишите развернутые
+              Задавайте содержательные вопросы, пишите развернутые комментарии, подкрепляйте
-                  комментарии, подкрепляйте их&nbsp;аргументами, чтобы диалог был полезен всем участникам,
+              их&nbsp;аргументами, чтобы диалог был полезен всем участникам, помогая глубже понять тему
-                  помогая глубже понять тему и&nbsp;разобраться в&nbsp;вопросе. И, пожалуйста, уважайте
+              и&nbsp;разобраться в&nbsp;вопросе. И, пожалуйста, уважайте собеседника, даже если он&nbsp;вам
-                  собеседника, даже если он&nbsp;вам лично не&nbsp;импонирует: только так получаются
+              лично не&nbsp;импонирует: только так получаются продуктивные дискуссии.
-                  продуктивные дискуссии.
             </p>
           </li>
 
           <li>
             <p>
-                  <strong>Обмен знаниями и&nbsp;историями.</strong> Осмысленные высказывания по&nbsp;теме
+              <strong>Обмен знаниями и&nbsp;историями.</strong> Осмысленные высказывания по&nbsp;теме поста,
-                  поста, оригинальные рассуждения, рассказы о&nbsp;личном опыте и&nbsp;проектах, обмен
+              оригинальные рассуждения, рассказы о&nbsp;личном опыте и&nbsp;проектах, обмен профессиональной
-                  профессиональной экспертизой, наблюдения и&nbsp;реальные истории
+              экспертизой, наблюдения и&nbsp;реальные истории из&nbsp;жизни&nbsp;&mdash; чем больше
-                  из&nbsp;жизни&nbsp;&mdash; чем больше мы&nbsp;делимся друг с&nbsp;другом знаниями, тем
+              мы&nbsp;делимся друг с&nbsp;другом знаниями, тем интереснее и&nbsp;плодотворнее становится
-                  интереснее и&nbsp;плодотворнее становится наше общение. Помните, что каждый вдумчивый
+              наше общение. Помните, что каждый вдумчивый ответ повышает качество дискуссий
-                  ответ повышает качество дискуссий в&nbsp;сообществе и&nbsp;делает чтение самиздата ещё
+              в&nbsp;сообществе и&nbsp;делает чтение самиздата ещё интереснее.
-                  интереснее.
             </p>
           </li>
 
           <li>
             <p>
-                  <strong>Чувство юмора и&nbsp;добродушие.</strong> Остроумие и&nbsp;дружелюбие
+              <strong>Чувство юмора и&nbsp;добродушие.</strong> Остроумие и&nbsp;дружелюбие не&nbsp;только
-                  не&nbsp;только направляют дискуссии в&nbsp;продуктивное русло, но&nbsp;и&nbsp;улучшают
+              направляют дискуссии в&nbsp;продуктивное русло, но&nbsp;и&nbsp;улучшают настроение.
-                  настроение. Не&nbsp;вредите негативом, которого в&nbsp;интернете и&nbsp;без нас хватает,
+              Не&nbsp;вредите негативом, которого в&nbsp;интернете и&nbsp;без нас хватает,
-                  и&nbsp;не&nbsp;травите на&nbsp;корню классные инициативы&nbsp;&mdash; всё великое
+              и&nbsp;не&nbsp;травите на&nbsp;корню классные инициативы&nbsp;&mdash; всё великое начинается
-                  начинается с&nbsp;малого. Мы&nbsp;за&nbsp;поддерживающую и&nbsp;вдохновляющую атмосферу
+              с&nbsp;малого. Мы&nbsp;за&nbsp;поддерживающую и&nbsp;вдохновляющую атмосферу
               в&nbsp;сообществе. Надеемся, вы&nbsp;тоже.
             </p>
           </li>
@@ -103,19 +115,16 @@ export const DiscussionRulesPage = () => {
           <li>
             <p>
               <strong>Благодарность и&nbsp;поддержка.</strong> Если публикация вам зашла,
-                  не&nbsp;стесняйтесь ставить лайки, делиться понравившимися материалами, благодарить
+              не&nbsp;стесняйтесь ставить лайки, делиться понравившимися материалами, благодарить авторов,
-                  авторов, читателей, художников и&nbsp;редакторов в&nbsp;комментариях. Цените
+              читателей, художников и&nbsp;редакторов в&nbsp;комментариях. Цените и&nbsp;поддерживайте
-                  и&nbsp;поддерживайте классные проекты, сильные тексты, новое искусство, осмысленные
+              классные проекты, сильные тексты, новое искусство, осмысленные комментарии и&nbsp;вклад других
-                  комментарии и&nbsp;вклад других в&nbsp;самиздат&nbsp;&mdash; сотрудничество делает нас
+              в&nbsp;самиздат&nbsp;&mdash; сотрудничество делает нас сильнее и&nbsp;усиливает звучание идей
-                  сильнее и&nbsp;усиливает звучание идей и&nbsp;смыслов, которые помогают лучше понимать
+              и&nbsp;смыслов, которые помогают лучше понимать мир.
-                  мир.
             </p>
           </li>
         </ol>
-          </div>
-        </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/about/dogma.page.tsx

@@ -1,14 +1,29 @@
-import { PageLayout } from '../../components/_shared/PageLayout'
+import { Meta } from '@solidjs/meta'
-import { useLocalize } from '../../context/localize'
+
+import { StaticPage } from '../../components/Views/StaticPage'
+import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
-// TODO: l10n
 export const DogmaPage = () => {
   const { t } = useLocalize()
+
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Dogma')
+  const description = t('Professional principles that the open editorial team follows in its work')
+
   return (
-    <PageLayout title={t('Dogma')}>
+    <StaticPage title={ogTitle}>
+      <Meta name="descprition" content={description} />
+      <Meta name="keywords" content={t('dogma 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} />
       <article class="wide-container container--static-page">
-        <div class="row">
-          <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
         <h4>Редакционные принципы</h4>
         <p>
           Дискурс — журнал с открытой горизонтальной редакцией. Содержание журнала определяется прямым
@@ -18,23 +33,23 @@ export const DogmaPage = () => {
         <ol>
           <li>
             <b>На первое место ставим факты.</b> Наша задача — не судить, а наблюдать и непредвзято
-                фиксировать происходящее. Все утверждения и выводы, которые мы делаем, подтверждаются
+            фиксировать происходящее. Все утверждения и выводы, которые мы делаем, подтверждаются фактами,
-                фактами, цифрами, мнениями экспертов или ссылками на авторитетные источники.
+            цифрами, мнениями экспертов или ссылками на авторитетные источники.
           </li>
           <li>
             <b>Ответственно относимся к источникам.</b>
-                Мы выбираем только надежные источники, проверяем информацию и рассказываем, как и откуда мы
+            Мы выбираем только надежные источники, проверяем информацию и рассказываем, как и откуда мы её
-                её получили, кроме случаев, когда это может нанести вред источникам. Тогда мы не раскроем
+            получили, кроме случаев, когда это может нанести вред источникам. Тогда мы не раскроем их, даже
-                их, даже в суде.
+            в суде.
           </li>
           <li>
-                <b>Выбираем компетентных и независимых экспертов</b>, понимая всю степень ответственности
+            <b>Выбираем компетентных и независимых экспертов</b>, понимая всю степень ответственности перед
-                перед аудиторией.
+            аудиторией.
           </li>
           <li>
             <b>
-                  Даем возможность высказаться всем заинтересованным сторонам, но не присоединяемся ни к
+              Даем возможность высказаться всем заинтересованным сторонам, но не присоединяемся ни к чьему
-                  чьему лагерю.
+              лагерю.
             </b>
             Ко всем событиям, компаниям и людям мы относимся с одинаковым скептицизмом.
           </li>
@@ -48,10 +63,8 @@ export const DogmaPage = () => {
             .
           </li>
         </ol>
-          </div>
-        </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/about/guide.page.tsx

@@ -2,36 +2,40 @@ import { Meta } from '@solidjs/meta'
 
 import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const GuidePage = () => {
   const { t } = useLocalize()
-  const title = t('How it works')
+
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('How Discours works')
+  const description = t('A guide to horizontal editorial: how an open journal works')
 
   return (
-    <StaticPage
+    <StaticPage title={ogTitle}>
-      title={title}
-      layoutChildren={
       <>
-          <Meta name="description" content={title} />
+        <Meta name="descprition" content={description} />
-          <Meta name="keywords" content={t('Discours') + ',' + title} />
+        <Meta name="keywords" content={t('keywords')} />
-          <Meta property="og:title" content={title} />
+        <Meta name="og:type" content="article" />
-          <Meta property="og:description" content={title} />
+        <Meta name="og:title" content={ogTitle} />
-          <Meta property="og:image" content="/images/participation.png" />
+        <Meta name="og:image" content={ogImage} />
-          <Meta property="og:image:width" content="1200" />
+        <Meta name="twitter:image" content={ogImage} />
-          <Meta property="og:image:height" content="630" />
+        <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} />
+        <article class="wide-container container--static-page">
           <h1 id="about">
-        <span class="wrapped">Как устроен Дискурс</span>
+            <span class="wrapped">{ogTitle}</span>
           </h1>
 
           <p>
-        Дискурс&nbsp;&mdash; независимый журнал о&nbsp;культуре, науке, искусстве и&nbsp;обществе с&nbsp;
+            Дискурс&nbsp;&mdash; независимый журнал о&nbsp;культуре, науке, искусстве и&nbsp;обществе
+            с&nbsp;
             <a href="/about/manifest">открытой редакцией</a>. У&nbsp;нас нет главного редактора, инвестора
-        и&nbsp;вообще никого, кто&nbsp;бы принимал единоличные решения. Вместо традиционных иерархий Дискурс
+            и&nbsp;вообще никого, кто&nbsp;бы принимал единоличные решения. Вместо традиционных иерархий
-        основан на&nbsp;принципах прямой демократии: в&nbsp;нашем горизонтальном сообществе все редакционные
+            Дискурс основан на&nbsp;принципах прямой демократии: в&nbsp;нашем горизонтальном сообществе все
-        вопросы решаются открытым голосованием авторов журнала. Вот как это работает.
+            редакционные вопросы решаются открытым голосованием авторов журнала. Вот как это работает.
           </p>
           <h3 id="how-it-works">Как устроен сайт Дискурса</h3>
           <p>Дискурс состоит из&nbsp;четырех основных разделов:</p>
@@ -39,16 +43,16 @@ export const GuidePage = () => {
             <li>
               <p>
                 <a href="/topics">Темы</a>
-            &nbsp;&mdash; у&nbsp;нас публикуются исследования, обзоры, эссе, интервью, репортажи, аналитика
+                &nbsp;&mdash; у&nbsp;нас публикуются исследования, обзоры, эссе, интервью, репортажи,
-            и&nbsp;другие материалы о&nbsp;культуре, науке, искусстве и&nbsp;обществе.
+                аналитика и&nbsp;другие материалы о&nbsp;культуре, науке, искусстве и&nbsp;обществе.
               </p>
             </li>
             <li>
               <p>
                 <a href="/topic/art">Искусство</a>
-            &nbsp;&mdash; здесь, например, представлены художественные произведения: литература, живопись,
+                &nbsp;&mdash; здесь, например, представлены художественные произведения: литература,
-            музыка, фотографии, видео. Этот раздел помогает прозвучать новому искусству, которое создают
+                живопись, музыка, фотографии, видео. Этот раздел помогает прозвучать новому искусству,
-            российские художники, писатели, режиссёры и&nbsp;музыканты.
+                которое создают российские художники, писатели, режиссёры и&nbsp;музыканты.
               </p>
             </li>
             {/*
@@ -79,24 +83,24 @@ export const GuidePage = () => {
             материалы по&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>,{' '}
+            ), по&nbsp;тематике (<a href="/topic/cinema">кино</a>, <a href="/topic/philosophy">философия</a>
-        <a href="/topic/history">история</a>, <a href="/topic/absurdism">абсурдизм</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;следить
+            &raquo;). Темы объединяют сотни публикаций, помогают ориентироваться в&nbsp;журнале
-        за&nbsp;интересными материалами.
+            и&nbsp;следить за&nbsp;интересными материалами.
           </p>
 
           <section>
             <h3 id="become-author">Как стать автором журнала</h3>
             <p>
               Дискурс объединяет журналистов, активистов, музыкантов, художников, фотографов, режиссеров,
-          философов, ученых и&nbsp;других замечательных людей. Каждый может <a href="/create">прислать</a>{' '}
+              философов, ученых и&nbsp;других замечательных людей. Каждый может{' '}
-          свой материал в&nbsp;журнал. Формат и&nbsp;тематика не&nbsp;имеют значения, единственное, что
+              <a href="/create">прислать</a> свой материал в&nbsp;журнал. Формат и&nbsp;тематика
-          важно &mdash; <a href="/how-to-write-a-good-article">хороший</a> ли&nbsp;материал. Если сообщество
+              не&nbsp;имеют значения, единственное, что важно &mdash;{' '}
-          поддержит вашу публикацию, она выйдет в&nbsp;журнале и&nbsp;станет доступна тысячам наших
+              <a href="/how-to-write-a-good-article">хороший</a> ли&nbsp;материал. Если сообщество поддержит
-          читателей.
+              вашу публикацию, она выйдет в&nbsp;журнале и&nbsp;станет доступна тысячам наших читателей.
             </p>
           </section>
 
@@ -105,41 +109,41 @@ export const GuidePage = () => {
             Все присылаемые в&nbsp;Дискурс материалы попадают в&nbsp;
             <strong>&laquo;Редакцию&raquo;</strong>. Это внутренний раздел сайта, где участники сообщества
             решают, что будет опубликовано в&nbsp;Дискурсе. Как только работа получает одобрение как минимум
-        пятерых авторов открытой редакции, она немедленно публикуется в&nbsp;журнале. Если&nbsp;же материал
+            пятерых авторов открытой редакции, она немедленно публикуется в&nbsp;журнале. Если&nbsp;же
-        набирает более&nbsp;20% голосов &laquo;против&raquo;, он&nbsp;не&nbsp;выходит и&nbsp;может быть
+            материал набирает более&nbsp;20% голосов &laquo;против&raquo;, он&nbsp;не&nbsp;выходит
-        отправлен на&nbsp;доработку. Жестких сроков рассмотрения материалов у&nbsp;нас нет, иногда это
+            и&nbsp;может быть отправлен на&nbsp;доработку. Жестких сроков рассмотрения материалов у&nbsp;нас
-        занимает час, иногда месяц, обычно&nbsp;&mdash; несколько дней.
+            нет, иногда это занимает час, иногда месяц, обычно&nbsp;&mdash; несколько дней.
           </p>
           <section>
             <p>
-          Как только сообщество поддержит публикацию, вы&nbsp;получите приглашение в&nbsp;интернет-редакцию
+              Как только сообщество поддержит публикацию, вы&nbsp;получите приглашение
-          и&nbsp;сможете голосовать за&nbsp;новые материалы.
+              в&nbsp;интернет-редакцию и&nbsp;сможете голосовать за&nbsp;новые материалы.
             </p>
           </section>
 
           <h3 id="editing">Как мы&nbsp;делаем тексты друг друга лучше</h3>
           <p>
-        Дискурс&nbsp;&mdash; журнал с&nbsp;совместным редактированием. Совершенствовать тексты нам помогает{' '}
+            Дискурс&nbsp;&mdash; журнал с&nbsp;совместным редактированием. Совершенствовать тексты нам
-        <b>система ремарок</b>. Вы&nbsp;можете выделить часть текста в&nbsp;любой статье и&nbsp;оставить
+            помогает <b>система ремарок</b>. Вы&nbsp;можете выделить часть текста в&nbsp;любой статье
-        к&nbsp;ней замечание, вопрос или предложение&nbsp;&mdash; автор текста получит совет на&nbsp;почту
+            и&nbsp;оставить к&nbsp;ней замечание, вопрос или предложение&nbsp;&mdash; автор текста получит
-        и&nbsp;сможет его учесть. Так мы&nbsp;устраняем опечатки, неточности и&nbsp;советуем друг другу, как
+            совет на&nbsp;почту и&nbsp;сможет его учесть. Так мы&nbsp;устраняем опечатки, неточности
-        сделать тексты качественнее и&nbsp;интереснее.
+            и&nbsp;советуем друг другу, как сделать тексты качественнее и&nbsp;интереснее.
           </p>
           <p>
-        Среди участников сообщества есть профессиональные редакторы, которые помогают авторам делать тексты
+            Среди участников сообщества есть профессиональные редакторы, которые помогают авторам делать
-        лучше. Если вашему материалу потребуется доработка, они помогут отредактировать текст, подобрать
+            тексты лучше. Если вашему материалу потребуется доработка, они помогут отредактировать текст,
-        иллюстрации, придумать заголовок и&nbsp;красиво сверстать публикацию. Если вы&nbsp;хотите обсудить
+            подобрать иллюстрации, придумать заголовок и&nbsp;красиво сверстать публикацию. Если
-        текст, прежде чем загрузить материал в интернет-редакцию&nbsp;&mdash; разместите его
+            вы&nbsp;хотите обсудить текст, прежде чем загрузить материал в интернет-редакцию&nbsp;&mdash;
-        в&nbsp;google-документе, откройте доступ к&nbsp;редактированию по&nbsp;ссылке и&nbsp;напишите нам
+            разместите его в&nbsp;google-документе, откройте доступ к&nbsp;редактированию по&nbsp;ссылке
-        на&nbsp;
+            и&nbsp;напишите нам на&nbsp;
             <a href="mailto:welcome@discours.io" target="_blank">
               welcome@discours.io
             </a>
             .
           </p>
           <p>
-        Если у&nbsp;вас возникают трудности с&nbsp;тем, чтобы подобрать к&nbsp;своему материалу иллюстрации,
+            Если у&nbsp;вас возникают трудности с&nbsp;тем, чтобы подобрать к&nbsp;своему материалу
-        тоже пишите на&nbsp;
+            иллюстрации, тоже пишите на&nbsp;
             <a href="mailto:welcome@discours.io" target="_blank">
               почту
             </a>
@@ -156,23 +160,23 @@ export const GuidePage = () => {
               <p>
                 <strong>Право определять, каким будет журнал</strong>. Дискурс&nbsp;&mdash; это общественная
                 институция, созданная людьми и&nbsp;ради людей, функционирующая на&nbsp;условиях прямой
-            демократии. Авторы публикуют статьи и&nbsp;художественные проекты, участвуют в&nbsp;обсуждениях,
+                демократии. Авторы публикуют статьи и&nbsp;художественные проекты, участвуют
-            голосуют за&nbsp;работы коллег и&nbsp;таким образом вносят свой вклад в&nbsp;развитие проекта,
+                в&nbsp;обсуждениях, голосуют за&nbsp;работы коллег и&nbsp;таким образом вносят свой вклад
-            определяя содержание и&nbsp;направление журнала.
+                в&nbsp;развитие проекта, определяя содержание и&nbsp;направление журнала.
               </p>
             </li>
             <li>
               <p>
-            <strong>Возможность обратиться к&nbsp;широкой аудитории</strong>. Дискурс читают десятки тысяч
+                <strong>Возможность обратиться к&nbsp;широкой аудитории</strong>. Дискурс читают десятки
-            людей, и&nbsp;с&nbsp;каждым днем их&nbsp;становится больше.
+                тысяч людей, и&nbsp;с&nbsp;каждым днем их&nbsp;становится больше.
               </p>
             </li>
             <li>
               <p>
                 <strong>Поддержка редакции</strong>. Дискурс предоставляет авторам аккредитацию
-            на&nbsp;мероприятия, базу контактов, юридическую поддержку, ознакомление с&nbsp;книжными, кино-
+                на&nbsp;мероприятия, базу контактов, юридическую поддержку, ознакомление с&nbsp;книжными,
-            и&nbsp;музыкальными новинками до&nbsp;их&nbsp;выхода в&nbsp;свет. Если что-то из&nbsp;этого вам
+                кино- и&nbsp;музыкальными новинками до&nbsp;их&nbsp;выхода в&nbsp;свет. Если что-то
-            понадобится, пишите на&nbsp;почту{' '}
+                из&nbsp;этого вам понадобится, пишите на&nbsp;почту{' '}
                 <a href="mailto:welcome@discours.io" target="_blank">
                   welcome@discours.io
                 </a>
@@ -181,21 +185,22 @@ export const GuidePage = () => {
             </li>
             <li>
               <p>
-            <strong>Пресс-карты для корреспондентов</strong>. Три опубликованные статьи позволяют авторам
+                <strong>Пресс-карты для корреспондентов</strong>. Три опубликованные статьи позволяют
-            Дискурса получить официальные удостоверения журналистов (пресс-карты) на&nbsp;следующий год.
+                авторам Дискурса получить официальные удостоверения журналистов (пресс-карты)
-            Пресс-карты удостоверяют, что вы&nbsp;журналист и&nbsp;можете пользоваться всеми теми правами,
+                на&nbsp;следующий год. Пресс-карты удостоверяют, что вы&nbsp;журналист и&nbsp;можете
-            которые гарантирует Закон о&nbsp;СМИ. Кроме того, многие культурные институции (музеи, галереи
+                пользоваться всеми теми правами, которые гарантирует Закон о&nbsp;СМИ. Кроме того, многие
-            и&nbsp;др.) предоставляют журналистам право свободного входа.
+                культурные институции (музеи, галереи и&nbsp;др.) предоставляют журналистам право свободного
+                входа.
               </p>
             </li>
             <li>
               <p>
-            <strong>Помощь сотен специалистов в&nbsp;разных областях</strong>. В&nbsp;основе Дискурса лежит
+                <strong>Помощь сотен специалистов в&nbsp;разных областях</strong>. В&nbsp;основе Дискурса
-            идея совместного редактирования. Участники редакционного сообщества&nbsp;&mdash; несколько сотен
+                лежит идея совместного редактирования. Участники редакционного сообщества&nbsp;&mdash;
-            журналистов, исследователей, художников, литераторов из&nbsp;разных стран &mdash; изучают
+                несколько сотен журналистов, исследователей, художников, литераторов из&nbsp;разных стран
-            материалы друг друга до&nbsp;публикации и&nbsp;помогают сделать их&nbsp;качественнее
+                &mdash; изучают материалы друг друга до&nbsp;публикации и&nbsp;помогают сделать
-            и&nbsp;интереснее. Так, в&nbsp;редакции нередко складываются творческие союзы: например, авторов
+                их&nbsp;качественнее и&nbsp;интереснее. Так, в&nbsp;редакции нередко складываются творческие
-            текстов и&nbsp;художников, создающих для них иллюстрации.
+                союзы: например, авторов текстов и&nbsp;художников, создающих для них иллюстрации.
               </p>
             </li>
             <li>
@@ -229,12 +234,15 @@ export const GuidePage = () => {
             с&nbsp;дайджестом лучших материалов.
           </p>
           <p>
-        Если вы&nbsp;хотите сотрудничать, что-то обсудить или предложить &mdash; пожалуйста, пишите на&nbsp;
+            Если вы&nbsp;хотите сотрудничать, что-то обсудить или предложить &mdash; пожалуйста, пишите
+            на&nbsp;
             <a href="mailto:welcome@discours.io" target="_blank">
               welcome@discours.io
             </a>
             . Мы&nbsp;обязательно ответим.
           </p>
+        </article>
+      </>
     </StaticPage>
   )
 }

src/pages/about/help.page.tsx

@@ -3,38 +3,48 @@ import { Meta } from '@solidjs/meta'
 import { Donate } from '../../components/Discours/Donate'
 import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const HelpPage = () => {
   const { t } = useLocalize()
 
-  // TODO: l10n
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Support Discours')
+  const description = t(
+    'Contribute to free samizdat. Support Discours - an independent non-profit publication that works only for you. Become a pillar of the open newsroom',
+  )
+
   return (
-    <StaticPage
+    <StaticPage title={ogTitle}>
-      title={t('Support us')}
-      layoutChildren={
       <>
-          <Meta name="description" content="Здесь можно поддержать Дискурс материально." />
+        <Meta name="descprition" content={description} />
-          <Meta name="keywords" content="Discours.io, помощь, благотворительность" />
+        <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} />
+        <article class="wide-container container--static-page">
           <h1 id="help-us">
             <span class="wrapped">Как вы&nbsp;можете поддержать Дискурс?</span>
           </h1>
 
           <p>
-        Дискурс&nbsp;&mdash; уникальное независимое издание с&nbsp;горизонтальной редакцией, существующее
+            Дискурс&nbsp;&mdash; уникальное независимое издание с&nbsp;горизонтальной редакцией,
-        в&nbsp;интересах своих читателей. Ваша поддержка действительно много значит&nbsp;&mdash;
+            существующее в&nbsp;интересах своих читателей. Ваша поддержка действительно много
-        не&nbsp;только для редакции Дискурса, но&nbsp;и&nbsp;для сохранения свободной мысли
+            значит&nbsp;&mdash; не&nbsp;только для редакции Дискурса, но&nbsp;и&nbsp;для сохранения
-        и&nbsp;некоммерческого искусства в&nbsp;нашем обществе.
+            свободной мысли и&nbsp;некоммерческого искусства в&nbsp;нашем обществе.
           </p>
           <p>
             Дискурс существует на&nbsp;добровольных началах. Никакой медиахолдинг, фонд или государственная
-        структура не&nbsp;финансирует нас&nbsp;&mdash; благодаря этому мы&nbsp;можем писать о&nbsp;том, что
+            структура не&nbsp;финансирует нас&nbsp;&mdash; благодаря этому мы&nbsp;можем писать о&nbsp;том,
-        важно, а&nbsp;не&nbsp;о&nbsp;том, что выгодно. Сообщество наших волонтеров ежедневно трудится, чтобы
+            что важно, а&nbsp;не&nbsp;о&nbsp;том, что выгодно. Сообщество наших волонтеров ежедневно
-        рассказывать вам интересные, не&nbsp;освещенные другими изданиями истории&nbsp;&mdash;
+            трудится, чтобы рассказывать вам интересные, не&nbsp;освещенные другими изданиями
-        но&nbsp;мы&nbsp;не&nbsp;сможем делать это без вашей помощи. Пожертвования читателей составляют
+            истории&nbsp;&mdash; но&nbsp;мы&nbsp;не&nbsp;сможем делать это без вашей помощи. Пожертвования
-        основу нашего бюджета и&nbsp;позволяют нам существовать.
+            читателей составляют основу нашего бюджета и&nbsp;позволяют нам существовать.
           </p>
           <p>
             Если вам нравится&nbsp;то, что мы&nbsp;делаем и&nbsp;вы&nbsp;хотите, чтобы Дискурс продолжался,
@@ -48,26 +58,27 @@ export const HelpPage = () => {
           <h3 id="financial-report">На&nbsp;что пойдут деньги?</h3>
           <p>
             Ваши пожертвования пойдут на&nbsp;оплату серверов, содержание офиса, зарплату редакции
-        и&nbsp;налоги, оплату юридического сопровождения и&nbsp;труда бухгалтера, совершенствование сайта,
+            и&nbsp;налоги, оплату юридического сопровождения и&nbsp;труда бухгалтера, совершенствование
-        аренду помещения для открытой редакции, на&nbsp;печать альманаха Дискурс с&nbsp;лучшими текстами
+            сайта, аренду помещения для открытой редакции, на&nbsp;печать альманаха Дискурс с&nbsp;лучшими
-        авторов за&nbsp;полгода, а&nbsp;также на&nbsp;другие редакционные и&nbsp;технические расходы.
+            текстами авторов за&nbsp;полгода, а&nbsp;также на&nbsp;другие редакционные и&nbsp;технические
+            расходы.
           </p>
           <h3>Ваша помощь позволит нам</h3>
           <ul>
             <li>
               <h4>Оставаться бесплатным изданием.</h4>
               <p>
-            Мы&nbsp;делаем открытый журнал для всех желающих, а&nbsp;также собираем искусство лучших авторов
+                Мы&nbsp;делаем открытый журнал для всех желающих, а&nbsp;также собираем искусство лучших
-            по&nbsp;всему миру. Ваша поддержка позволяет нам становиться лучше.
+                авторов по&nbsp;всему миру. Ваша поддержка позволяет нам становиться лучше.
               </p>
             </li>
             <li>
               <h4>Создавать еще больше контента.</h4>
               <p>
-            Каждый день к&nbsp;нам присоединяются новые люди, и&nbsp;чем больше нас становится, тем больше
+                Каждый день к&nbsp;нам присоединяются новые люди, и&nbsp;чем больше нас становится, тем
-            мы&nbsp;творим и&nbsp;строже оцениваем результаты творчества друг друга. В&nbsp;результате
+                больше мы&nbsp;творим и&nbsp;строже оцениваем результаты творчества друг друга.
-            повышается и&nbsp;количество, и&nbsp;качество контента. Каждый день мы трудимся, чтобы открывать
+                В&nbsp;результате повышается и&nbsp;количество, и&nbsp;качество контента. Каждый день мы
-            нашим читателям новые грани окружающего мира.
+                трудимся, чтобы открывать нашим читателям новые грани окружающего мира.
               </p>
             </li>
             <li>
@@ -80,15 +91,16 @@ export const HelpPage = () => {
             <li>
               <h4>Модернизировать сайт.</h4>
               <p>
-            Мы&nbsp;совершенствуем платформу и&nbsp;стараемся сделать проект максимально удобным для вас.
+                Мы&nbsp;совершенствуем платформу и&nbsp;стараемся сделать проект максимально удобным для
-            Мы&nbsp;работаем над мобильной версией, новым дизайном, фукционалом, системой регистрации,
+                вас. Мы&nbsp;работаем над мобильной версией, новым дизайном, фукционалом, системой
-            навигации и&nbsp;рекомендаций, которые сделают наше общение еще увлекательней.
+                регистрации, навигации и&nbsp;рекомендаций, которые сделают наше общение еще увлекательней.
               </p>
             </li>
             <li>
               <h4>Выпускать альманах.</h4>
               <p>
-            Выпускать раз в&nbsp;полугодие печатный альманах Дискурс с&nbsp;33&nbsp;лучшими текстами сайта.
+                Выпускать раз в&nbsp;полугодие печатный альманах Дискурс с&nbsp;33&nbsp;лучшими текстами
+                сайта.
               </p>
             </li>
             <li>
@@ -106,9 +118,9 @@ export const HelpPage = () => {
           </p>
           <h3 id="other">Как ещё можно поддержать Дискурс?</h3>
           <p>
-        Есть много других способов поддержать Дискурс и&nbsp;труд наших авторов. Например, вы&nbsp;можете
+            Есть много других способов поддержать Дискурс и&nbsp;труд наших авторов. Например,
-        периодически рассказывать о&nbsp;проекте своим друзьям в&nbsp;соцсетях, делиться хорошими
+            вы&nbsp;можете периодически рассказывать о&nbsp;проекте своим друзьям в&nbsp;соцсетях, делиться
-        материалами или&nbsp;&mdash; что еще лучше&nbsp;&mdash; публиковать свои статьи
+            хорошими материалами или&nbsp;&mdash; что еще лучше&nbsp;&mdash; публиковать свои статьи
             в&nbsp;&laquo;Дискурсе&raquo;. Но&nbsp;главное, что вы&nbsp;можете сделать для Дискурса, &mdash;
             читать нас. Мы&nbsp;вкладываем в&nbsp;журнал душу, и&nbsp;внимание каждого читателя убеждает нас
             в&nbsp;правильности выбранного пути. Не&nbsp;переключайтесь.
@@ -121,6 +133,8 @@ export const HelpPage = () => {
             </a>
             .
           </p>
+        </article>
+      </>
     </StaticPage>
   )
 }

src/pages/about/manifest.page.tsx

@@ -1,17 +1,24 @@
+import { Meta } from '@solidjs/meta'
+
 import { Subscribe } from '../../components/_shared/Subscribe'
 import { Feedback } from '../../components/Discours/Feedback'
 import { Modal } from '../../components/Nav/Modal'
 import Opener from '../../components/Nav/Modal/Opener'
 import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const ManifestPage = () => {
   const { t } = useLocalize()
 
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Discours Manifest')
+  const description = t(
+    'Manifest of samizdat: principles and mission of an open magazine with a horizontal editorial board',
+  )
+
   return (
-    <StaticPage
+    <StaticPage title={ogTitle}>
-      title={t('Manifest')}
-      layoutChildren={
       <>
         <Modal variant="wide" name="feedback">
           <Feedback />
@@ -19,36 +26,45 @@ export const ManifestPage = () => {
         <Modal variant="wide" name="subscribe">
           <Subscribe />
         </Modal>
-        </>
+        <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} />
+        <article class="wide-container container--static-page">
           <h1 id="manifest">
             <span class="wrapped">Манифест</span>
           </h1>
 
           <p>
-        Дискурс&nbsp;&mdash; независимый художественно-аналитический журнал с&nbsp;горизонтальной редакцией,
+            Дискурс&nbsp;&mdash; независимый художественно-аналитический журнал с&nbsp;горизонтальной
-        основанный на&nbsp;принципах свободы слова, прямой демократии и&nbsp;совместного редактирования.
+            редакцией, основанный на&nbsp;принципах свободы слова, прямой демократии и&nbsp;совместного
-        Дискурс создаётся открытым медиасообществом ученых, журналистов, музыкантов, писателей,
+            редактирования. Дискурс создаётся открытым медиасообществом ученых, журналистов, музыкантов,
-        предпринимателей, философов, инженеров, художников и&nbsp;специалистов со&nbsp;всего мира,
+            писателей, предпринимателей, философов, инженеров, художников и&nbsp;специалистов со&nbsp;всего
-        объединившихся, чтобы вместе делать общий журнал и&nbsp;объяснять с&nbsp;разных точек зрения
+            мира, объединившихся, чтобы вместе делать общий журнал и&nbsp;объяснять с&nbsp;разных точек
-        мозаичную картину современности.
+            зрения мозаичную картину современности.
           </p>
           <p>
             Мы&nbsp;пишем о&nbsp;культуре, науке и&nbsp;обществе, рассказываем о&nbsp;новых идеях
-        и&nbsp;современном искусстве, публикуем статьи, исследования, репортажи, интервью людей, чью прямую
+            и&nbsp;современном искусстве, публикуем статьи, исследования, репортажи, интервью людей, чью
-        речь стоит услышать, и&nbsp;работы художников из&nbsp;разных стран&nbsp;&mdash; от&nbsp;фильмов
+            прямую речь стоит услышать, и&nbsp;работы художников из&nbsp;разных стран&nbsp;&mdash;
-        и&nbsp;музыки до&nbsp;живописи и&nbsp;фотографии. Помогая друг другу делать публикации качественнее
+            от&nbsp;фильмов и&nbsp;музыки до&nbsp;живописи и&nbsp;фотографии. Помогая друг другу делать
-        и&nbsp;общим голосованием выбирая лучшие материалы для журнала, мы&nbsp;создаём новую горизонтальную
+            публикации качественнее и&nbsp;общим голосованием выбирая лучшие материалы для журнала,
-        журналистику, чтобы честно рассказывать о&nbsp;важном и&nbsp;интересном.
+            мы&nbsp;создаём новую горизонтальную журналистику, чтобы честно рассказывать о&nbsp;важном
+            и&nbsp;интересном.
           </p>
           <p>
             Редакция Дискурса открыта для всех: у&nbsp;нас нет цензуры, запретных тем и&nbsp;идеологических
             рамок. Каждый может <a href="/create">прислать материал</a> в&nbsp;журнал и&nbsp;
             <a href="/about/guide">присоединиться к&nbsp;редакции</a>. Предоставляя трибуну для независимой
-        журналистики и&nbsp;художественных проектов, мы&nbsp;помогаем людям рассказывать свои истории так,
+            журналистики и&nbsp;художественных проектов, мы&nbsp;помогаем людям рассказывать свои истории
-        чтобы они были услышаны. Мы&nbsp;убеждены: чем больше голосов будет звучать на&nbsp;Дискурсе, тем
+            так, чтобы они были услышаны. Мы&nbsp;убеждены: чем больше голосов будет звучать
-        громче в&nbsp;полифонии мнений будет слышна истина.
+            на&nbsp;Дискурсе, тем громче в&nbsp;полифонии мнений будет слышна истина.
           </p>
 
           <h2 class="h2" id="participation">
@@ -65,11 +81,11 @@ export const ManifestPage = () => {
               <h3 id="contribute">Предлагать материалы</h3>
             </summary>
             <p>
-          <a href="/create">Создавайте</a> свои статьи и&nbsp;художественные работы&nbsp;&mdash; лучшие из
+              <a href="/create">Создавайте</a> свои статьи и&nbsp;художественные работы&nbsp;&mdash; лучшие
-          них будут опубликованы в&nbsp;журнале. Дискурс&nbsp;&mdash; некоммерческое издание, авторы
+              из них будут опубликованы в&nbsp;журнале. Дискурс&nbsp;&mdash; некоммерческое издание, авторы
               публикуются в&nbsp;журнале на&nbsp;общественных началах, получая при этом{' '}
-          <a href="/create?collab=true">поддержку</a> редакции, право голоса, множество других возможностей
+              <a href="/create?collab=true">поддержку</a> редакции, право голоса, множество других
-          и&nbsp;читателей по&nbsp;всему миру.
+              возможностей и&nbsp;читателей по&nbsp;всему миру.
             </p>
           </details>
 
@@ -79,8 +95,8 @@ export const ManifestPage = () => {
             </summary>
             <p>
               Дискурс существует на&nbsp;пожертвования читателей. Если вам нравится журнал, пожалуйста,{' '}
-          <a href="/about/help">поддержите</a> нашу работу. Ваши пожертвования пойдут на&nbsp;выпуск новых
+              <a href="/about/help">поддержите</a> нашу работу. Ваши пожертвования пойдут на&nbsp;выпуск
-          материалов, оплату серверов, труда программистов, дизайнеров и&nbsp;редакторов.
+              новых материалов, оплату серверов, труда программистов, дизайнеров и&nbsp;редакторов.
             </p>
           </details>
 
@@ -89,20 +105,20 @@ export const ManifestPage = () => {
               <h3 id="cooperation">Сотрудничать с&nbsp;журналом</h3>
             </summary>
             <p>
-          Мы всегда открыты для сотрудничества и&nbsp;рады единомышленникам. Если вы хотите помогать журналу
+              Мы всегда открыты для сотрудничества и&nbsp;рады единомышленникам. Если вы хотите помогать
-          с&nbsp;редактурой, корректурой, иллюстрациями, переводами, версткой, подкастами, мероприятиями,
+              журналу с&nbsp;редактурой, корректурой, иллюстрациями, переводами, версткой, подкастами,
-          фандрайзингом или как-то ещё&nbsp;&mdash; скорее пишите нам на&nbsp;
+              мероприятиями, фандрайзингом или как-то ещё&nbsp;&mdash; скорее пишите нам на&nbsp;
               <a href="mailto:welcome@discours.io">welcome@discours.io</a>.
             </p>
             <p>
               Если вы представляете некоммерческую организацию и&nbsp;хотите сделать с&nbsp;нами совместный
-          проект, получить информационную поддержку или предложить другую форму сотрудничества&nbsp;&mdash;{' '}
+              проект, получить информационную поддержку или предложить другую форму
-          <a href="mailto:welcome@discours.io">пишите</a>.
+              сотрудничества&nbsp;&mdash; <a href="mailto:welcome@discours.io">пишите</a>.
             </p>
             <p>
               Если вы разработчик и&nbsp;хотите помогать с&nbsp;развитием сайта Дискурса,{' '}
-          <a href="mailto:services@discours.io">присоединяйтесь к&nbsp;IT-команде самиздата</a>. Открытый
+              <a href="mailto:services@discours.io">присоединяйтесь к&nbsp;IT-команде самиздата</a>.
-          код платформы для независимой журналистики, а&nbsp;также всех наших спецпроектов
+              Открытый код платформы для независимой журналистики, а&nbsp;также всех наших спецпроектов
               и&nbsp;медиаинструментов находится{' '}
               <a href="https://github.com/Discours">в&nbsp;свободном доступе на&nbsp;GitHub</a>.
             </p>
@@ -115,7 +131,8 @@ export const ManifestPage = () => {
             <p>
               Советуйте Дискурс друзьям и&nbsp;знакомым. Обсуждайте и&nbsp;распространяйте наши
               публикации&nbsp;&mdash; все материалы открытой редакции можно читать и&nbsp;перепечатывать
-          бесплатно. Подпишитесь на&nbsp;самиздат <a href="https://vk.com/discoursio">ВКонтакте</a>, в&nbsp;
+              бесплатно. Подпишитесь на&nbsp;самиздат <a href="https://vk.com/discoursio">ВКонтакте</a>,
+              в&nbsp;
               <a href="https://facebook.com/discoursio">Фейсбуке</a> и&nbsp;в&nbsp;
               <a href="https://t.me/discoursio">Телеграме</a>, а&nbsp;также на&nbsp;
               <Opener name="subscribe">рассылку лучших материалов</Opener>, чтобы не&nbsp;пропустить ничего
@@ -135,11 +152,13 @@ export const ManifestPage = () => {
 
           <p>
             Если вы хотите предложить материал, сотрудничать, рассказать о&nbsp;проблеме, которую нужно
-        осветить, сообщить об&nbsp;ошибке или баге, что-то обсудить, уточнить или посоветовать, пожалуйста,{' '}
+            осветить, сообщить об&nbsp;ошибке или баге, что-то обсудить, уточнить или посоветовать,
-        <Opener name="feedback">напишите нам здесь</Opener> или на&nbsp;почту{' '}
+            пожалуйста, <Opener name="feedback">напишите нам здесь</Opener> или на&nbsp;почту{' '}
             <a href="mailto:welcome@discours.io">welcome@discours.io</a>. Мы обязательно ответим
             и&nbsp;постараемся реализовать все хорошие задумки.
           </p>
+        </article>
+      </>
     </StaticPage>
   )
 }

src/pages/about/partners.page.tsx

@@ -1,18 +1,36 @@
-import { PageLayout } from '../../components/_shared/PageLayout'
+import { Meta } from '@solidjs/meta'
+
+import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const PartnersPage = () => {
   const { t } = useLocalize()
+
+  const ogTitle = t('Partners')
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const description = t('Discours Partners')
+
   return (
-    <PageLayout title={t('Partners')}>
+    <StaticPage title={ogTitle}>
       <article class="wide-container container--static-page">
+        <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} />
         <div class="row">
           <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
             <h1>{t('Partners')}</h1>
           </div>
         </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/about/principles.page.tsx

@@ -1,43 +1,57 @@
-import { PageLayout } from '../../components/_shared/PageLayout'
+import { Meta } from '@solidjs/meta'
+
+import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const PrinciplesPage = () => {
   const { t } = useLocalize()
 
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Community Principles')
+  const description = t('Community values and rules of engagement for the open editorial team')
+
   return (
-    <PageLayout title={t('Principles')}>
+    <StaticPage title={ogTitle}>
       <article class="wide-container container--static-page">
-        <div class="row">
+        <Meta name="descprition" content={description} />
-          <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
+        <Meta name="keywords" content={t('principles 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>
-              <span class="wrapped">{t('Principles')}</span>
+          <span class="wrapped">{ogTitle}</span>
         </h1>
 
         <ol>
           <li>
             <p>
               <strong>Горизонтальность</strong>. Мы&nbsp;все разные, и&nbsp;это классно. Вертикалей
-                  в&nbsp;мире достаточно, мы&nbsp;&mdash; горизонтальное сообщество и&nbsp;ценим наши
+              в&nbsp;мире достаточно, мы&nbsp;&mdash; горизонтальное сообщество и&nbsp;ценим наши различия,
-                  различия, потому что знаем&nbsp;&mdash; в&nbsp;них наша сила. Благодаря разнообразию сотен
+              потому что знаем&nbsp;&mdash; в&nbsp;них наша сила. Благодаря разнообразию сотен голосов,
-                  голосов, усиливающих друг друга, в&nbsp;сообществе складывается неповторимая синергия,
+              усиливающих друг друга, в&nbsp;сообществе складывается неповторимая синергия, которая помогает
-                  которая помогает вместе достигать большего.
+              вместе достигать большего.
             </p>
           </li>
           <li>
             <p>
-                  <strong>Многоголосие</strong>. Мы&nbsp;ценим свободу слова и&nbsp;аргументированные
+              <strong>Многоголосие</strong>. Мы&nbsp;ценим свободу слова и&nbsp;аргументированные мнения.
-                  мнения. Предоставляя трибуну каждому, кому есть что сказать, самиздат отражает полифонию
+              Предоставляя трибуну каждому, кому есть что сказать, самиздат отражает полифонию позиций,
-                  позиций, знаний и&nbsp;опыта, которые открывают более полную картину реальности.
+              знаний и&nbsp;опыта, которые открывают более полную картину реальности.
             </p>
           </li>
           <li>
             <p>
               <strong>Взаимопомощь</strong>. Мы&nbsp;помогаем друг другу, потому что хотим, чтобы
-                  в&nbsp;мире было еще больше хорошего. Обсуждая что-то, мы&nbsp;всегда интересуемся, чем
+              в&nbsp;мире было еще больше хорошего. Обсуждая что-то, мы&nbsp;всегда интересуемся, чем можем
-                  можем помочь. В&nbsp;самиздате можно найти специалистов практически в&nbsp;любых сферах
+              помочь. В&nbsp;самиздате можно найти специалистов практически в&nbsp;любых сферах
-                  и&nbsp;получить поддержку от&nbsp;сотен людей. Благодаря коллективной экспертизе
+              и&nbsp;получить поддержку от&nbsp;сотен людей. Благодаря коллективной экспертизе глобального
-                  глобального сообщества в&nbsp;самиздате выходят крутейшие публикации, которыми можно вечно
+              сообщества в&nbsp;самиздате выходят крутейшие публикации, которыми можно вечно гордиться.
-                  гордиться.
             </p>
           </li>
           <li>
@@ -51,9 +65,9 @@ export const PrinciplesPage = () => {
           <li>
             <p>
               <strong>Созидание</strong>. Мы&nbsp;создаем, потому что любим создавать. Мы&nbsp;открыто
-                  делимся опытом, дарим идеи, обмениваемся мнениями и&nbsp;благодарим за&nbsp;критику,
+              делимся опытом, дарим идеи, обмениваемся мнениями и&nbsp;благодарим за&nbsp;критику, используя
-                  используя ее&nbsp;для совершенствования мастерства и&nbsp;саморазвития. Мы&nbsp;знаем, что
+              ее&nbsp;для совершенствования мастерства и&nbsp;саморазвития. Мы&nbsp;знаем, что мир
-                  мир не&nbsp;идеальное место, и&nbsp;делаем всё возможное, чтобы он&nbsp;стал лучше.
+              не&nbsp;идеальное место, и&nbsp;делаем всё возможное, чтобы он&nbsp;стал лучше.
             </p>
           </li>
         </ol>
@@ -63,21 +77,21 @@ export const PrinciplesPage = () => {
         </h2>
 
         <p>
-              Открытая редакция объединяет сотни потрясающих людей со&nbsp;всего мира, которые делают
+          Открытая редакция объединяет сотни потрясающих людей со&nbsp;всего мира, которые делают крутейшие
-              крутейшие вещи. Это пространство, где доверяют, вдохновляют, исследуют и&nbsp;создают новое
+          вещи. Это пространство, где доверяют, вдохновляют, исследуют и&nbsp;создают новое вместе.
-              вместе. Поскольку все в&nbsp;сообществе очень разные, как-то мы&nbsp;собрались и&nbsp;решили
+          Поскольку все в&nbsp;сообществе очень разные, как-то мы&nbsp;собрались и&nbsp;решили зафиксировать
-              зафиксировать базовые ценности открытой редакции, а&nbsp;заодно придумали универсальные
+          базовые ценности открытой редакции, а&nbsp;заодно придумали универсальные правила взаимодействия,
-              правила взаимодействия, чтобы общение было не&nbsp;только плодотворным,
+          чтобы общение было не&nbsp;только плодотворным, но&nbsp;и&nbsp;приятным для всех участников
-              но&nbsp;и&nbsp;приятным для всех участников сообщества.
+          сообщества.
         </p>
         <ol>
           <li>
             <p>
               <strong>Действуем, помогаем и&nbsp;делимся</strong>. В&nbsp;редакции мы&nbsp;создаем свои
               проекты и&nbsp;помогаем другим создавать свои&nbsp;&mdash; советами, делом, участием,
-                  вовлеченностью. Мы&nbsp;открыто делимся опытом, мнениями и&nbsp;идеями, потому что ценим
+              вовлеченностью. Мы&nbsp;открыто делимся опытом, мнениями и&nbsp;идеями, потому что ценим силу
-                  силу сотрудничества и&nbsp;знаем, что идеи реализуются скорее, лучше и&nbsp;веселее, если
+              сотрудничества и&nbsp;знаем, что идеи реализуются скорее, лучше и&nbsp;веселее, если над ними
-                  над ними трудиться сообща.
+              трудиться сообща.
             </p>
           </li>
 
@@ -109,12 +123,12 @@ export const PrinciplesPage = () => {
             <p>
               <strong>Решаем трудности не&nbsp;агрессией, а&nbsp;диалогом</strong>. Обесценивать мнения
               и&nbsp;оскорблять других людей только потому, что вы&nbsp;с&nbsp;ними
-                  не&nbsp;согласны,&nbsp;&mdash; не&nbsp;лучший способ донести свою точку зрения. Конечно,
+              не&nbsp;согласны,&nbsp;&mdash; не&nbsp;лучший способ донести свою точку зрения. Конечно, важно
-                  важно высказаться, если вас что-то не&nbsp;устраивает и&nbsp;откровенно бесит.
+              высказаться, если вас что-то не&nbsp;устраивает и&nbsp;откровенно бесит. Но&nbsp;прежде чем
-                  Но&nbsp;прежде чем сжигать оппонента гневом, попробуйте понять, почему этот
+              сжигать оппонента гневом, попробуйте понять, почему этот &laquo;нехороший человек&raquo; так
-                  &laquo;нехороший человек&raquo; так поступает. Возможно, аргументы собеседника окажутся
+              поступает. Возможно, аргументы собеседника окажутся убедительными или вам удастся изменить его
-                  убедительными или вам удастся изменить его мнение. В&nbsp;любом случае конфликты решаются
+              мнение. В&nbsp;любом случае конфликты решаются в&nbsp;диалогах и&nbsp;проходят,
-                  в&nbsp;диалогах и&nbsp;проходят, а&nbsp;налаженное взаимопонимание останется надолго.
+              а&nbsp;налаженное взаимопонимание останется надолго.
             </p>
           </li>
 
@@ -124,8 +138,7 @@ export const PrinciplesPage = () => {
               Всегда мудрее обсуждать точку зрения человека, а&nbsp;не&nbsp;его самого, даже если
               он&nbsp;вам не&nbsp;импонирует. Предвзятое отношение ограничивает кругозор, добавляет
               преждевременные морщины и&nbsp;не&nbsp;помогает окружающим стать лучше. Вежливость
-                  и&nbsp;взаимоуважение&nbsp;&mdash; краеугольная основа вдумчивых и&nbsp;осмысленных
+              и&nbsp;взаимоуважение&nbsp;&mdash; краеугольная основа вдумчивых и&nbsp;осмысленных дискуссий.
-                  дискуссий.
             </p>
           </li>
 
@@ -133,9 +146,9 @@ export const PrinciplesPage = () => {
             <p>
               <strong>Благодарим за&nbsp;помощь</strong>. Благодарите коллег даже за&nbsp;самые,
               казалось&nbsp;бы, простые вещи. &laquo;Спасибо&raquo; не&nbsp;зря называют волшебным
-                  словом&nbsp;&mdash; на&nbsp;искренней благодарности держится любое подлинное
+              словом&nbsp;&mdash; на&nbsp;искренней благодарности держится любое подлинное сотрудничество.
-                  сотрудничество. Поддержка воодушевляет на&nbsp;новые подвиги и&nbsp;напоминает, что мир
+              Поддержка воодушевляет на&nbsp;новые подвиги и&nbsp;напоминает, что мир делают прекрасным
-                  делают прекрасным не&nbsp;машины, а&nbsp;живые люди.
+              не&nbsp;машины, а&nbsp;живые люди.
             </p>
           </li>
 
@@ -151,29 +164,27 @@ export const PrinciplesPage = () => {
 
           <li>
             <p>
-                  <strong>Вместе создаем идеальную среду общения</strong>. Открытая редакция&nbsp;&mdash;
+              <strong>Вместе создаем идеальную среду общения</strong>. Открытая редакция&nbsp;&mdash; это
-                  это утопическое пространство обогащающей и&nbsp;осмысленной коммуникации. Атмосфера
+              утопическое пространство обогащающей и&nbsp;осмысленной коммуникации. Атмосфера
-                  горизонтального сообщества складывается из&nbsp;действий каждого, поэтому
+              горизонтального сообщества складывается из&nbsp;действий каждого, поэтому мы&nbsp;действуем
-                  мы&nbsp;действуем так, чтобы способствовать сотворчеству, коллективному познанию
+              так, чтобы способствовать сотворчеству, коллективному познанию и&nbsp;развитию самиздата
-                  и&nbsp;развитию самиздата и&nbsp;нашей альтернативной интеллектуальной медиасреды.
+              и&nbsp;нашей альтернативной интеллектуальной медиасреды.
             </p>
           </li>
 
           <li>
             <p>
               <strong>Помним, что всё в&nbsp;сообществе зависит от&nbsp;нас</strong>. Если нам чего-то
-                  не&nbsp;хватает, мы&nbsp;начинаем действовать&nbsp;&mdash; рассказываем об&nbsp;идее,
+              не&nbsp;хватает, мы&nbsp;начинаем действовать&nbsp;&mdash; рассказываем об&nbsp;идее, находим
-                  находим единомышленников, готовим и&nbsp;запускаем проект. Так в&nbsp;сообществе
+              единомышленников, готовим и&nbsp;запускаем проект. Так в&nbsp;сообществе становится
-                  становится на&nbsp;одну крутую активность больше. Так появилось наше сообщество. Так
+              на&nbsp;одну крутую активность больше. Так появилось наше сообщество. Так появился самиздат
-                  появился самиздат и&nbsp;все проекты открытой редакции. Чтобы в&nbsp;сообществе случилось
+              и&nbsp;все проекты открытой редакции. Чтобы в&nbsp;сообществе случилось что-то прекрасное,
-                  что-то прекрасное, достаточно просто положить этому начало.
+              достаточно просто положить этому начало.
             </p>
           </li>
         </ol>
-          </div>
-        </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/about/termsOfUse.page.tsx

@@ -1,72 +1,38 @@
 import { Meta } from '@solidjs/meta'
-import { createSignal, Show } from 'solid-js'
 
-import { Icon } from '../../components/_shared/Icon'
+import { StaticPage } from '../../components/Views/StaticPage'
-import { PageLayout } from '../../components/_shared/PageLayout'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const TermsOfUsePage = () => {
   const { t } = useLocalize()
-  const [indexExpanded, setIndexExpanded] = createSignal(true)
 
-  const toggleIndexExpanded = () => setIndexExpanded((oldExpanded) => !oldExpanded)
+  const ogTitle = t('Terms of use')
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const description = t('Rules of the journal Discours')
 
-  const title = t('Terms of use')
   return (
-    <PageLayout title={title}>
+    <StaticPage title={ogTitle}>
-      <Meta name="description" content={title} />
+      <Meta name="descprition" content={description} />
-      <Meta name="keywords" content={`Discours.io, ${title}`} />
+      <Meta name="keywords" content={t('terms of use keywords')} />
-      <Meta property="og:title" content={title} />
+      <Meta name="og:type" content="article" />
-      <Meta property="og:description" content={title} />
+      <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} />
+
       <article class="wide-container container--static-page">
-        <div class="row">
-          <div class="col-md-6 col-lg-4 order-md-last">
-            <button class="button button--content-index" onClick={toggleIndexExpanded}>
-              <Show when={!indexExpanded()}>
-                <Icon name="content-index-control" />
-              </Show>
-              <Show when={indexExpanded()}>
-                <Icon name="content-index-control-expanded" class={'expanded'} />
-              </Show>
-            </button>
-
-            <Show when={indexExpanded()}>
-              <nav class="content-index">
-                <h4>Оглавление</h4>
-
-                <ul class="nodash">
-                  <li>
-                    <a href="#terms-of-use">Пользовательское соглашение</a>
-                  </li>
-                  <li>
-                    <a href="#definitions">Определения</a>
-                  </li>
-                  <li>
-                    <a href="#copyright">Авторские права</a>
-                  </li>
-                  <li>
-                    <a href="#rules">Правила поведения</a>
-                  </li>
-                  <li>
-                    <a href="#privacy-policy">Политика конфиденциальности</a>
-                  </li>
-                  <li>
-                    <a href="#feedback">Обратная связь</a>
-                  </li>
-                </ul>
-              </nav>
-            </Show>
-          </div>
-
-          <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
         <h1 id="terms-of-use">
           <span class="wrapped">Пользовательское соглашение</span>
         </h1>
 
         <p>
-              Дискурс&nbsp;&mdash; это сообщество творческих людей, объединенных идеей делать интересный
+          Дискурс&nbsp;&mdash; это сообщество творческих людей, объединенных идеей делать интересный журнал
-              журнал для всех желающих. Авторы Дискурса сообща посредством прямого голосования определяют
+          для всех желающих. Авторы Дискурса сообща посредством прямого голосования определяют содержание
-              содержание журнала.
+          журнала.
         </p>
         <p>Для того, чтобы Дискурс работал без помех, разработаны настоящие Правила.</p>
         <h3 id="definitions">Определения</h3>
@@ -87,34 +53,33 @@ export const TermsOfUsePage = () => {
           Издательство не&nbsp;вмешивается в&nbsp;принятие редакционных решений авторским сообществом.
         </p>
         <p>
-              <strong>Альманах &laquo;Дискурс&raquo;</strong> (свидетельство о&nbsp;регистрации СМИ: ПИ
+          <strong>Альманах &laquo;Дискурс&raquo;</strong> (свидетельство о&nbsp;регистрации СМИ: ПИ &#8470;
-              &#8470; ФС77-63947 от&nbsp;18.12.15)&nbsp;&mdash; печатное периодическое издание, которое
+          ФС77-63947 от&nbsp;18.12.15)&nbsp;&mdash; печатное периодическое издание, которое выходит раз
-              выходит раз в&nbsp;год и&nbsp;состоит из&nbsp;лучших публикаций на&nbsp;Сайте за&nbsp;это
+          в&nbsp;год и&nbsp;состоит из&nbsp;лучших публикаций на&nbsp;Сайте за&nbsp;это время.
-              время.
         </p>
         <h3 id="copyright">Авторские права</h3>
         <ol>
           <li>
             <p>
               Вся информация на&nbsp;сайте (включая тексты, изображения, видеоматериалы, аудиозаписи,
-                  программный код, дизайн сайта и&nbsp;т.д.) является объектом интеллектуальной
+              программный код, дизайн сайта и&nbsp;т.д.) является объектом интеллектуальной собственности
-                  собственности ее&nbsp;правообладателей и&nbsp;охраняется законодательством РФ.
+              ее&nbsp;правообладателей и&nbsp;охраняется законодательством РФ.
             </p>
           </li>
           <li>
             <p>
               Публикуя контент на&nbsp;сайте, Пользователь на&nbsp;безвозмездной основе предоставляет
-                  Издательству право на&nbsp;воспроизведение, распространение, перевод, редактирование
+              Издательству право на&nbsp;воспроизведение, распространение, перевод, редактирование контента.
-                  контента. Данное право предоставляется Издательству на&nbsp;весь срок действия авторских
+              Данное право предоставляется Издательству на&nbsp;весь срок действия авторских прав
-                  прав Пользователя.
+              Пользователя.
             </p>
           </li>
           <li>
             <p>
-                  Пользователь предоставляет Издательству право редактировать контент, в&nbsp;том числе
+              Пользователь предоставляет Издательству право редактировать контент, в&nbsp;том числе вносить
-                  вносить в&nbsp;него изменения, сокращения и&nbsp;дополнения, снабжать его иллюстрациями
+              в&nbsp;него изменения, сокращения и&nbsp;дополнения, снабжать его иллюстрациями
-                  и&nbsp;пояснениями, исправлять ошибки и&nbsp;уточнять фактические сведения, при условии,
+              и&nbsp;пояснениями, исправлять ошибки и&nbsp;уточнять фактические сведения, при условии, что
-                  что этим не&nbsp;искажается авторский замысел.
+              этим не&nbsp;искажается авторский замысел.
             </p>
           </li>
           <li>
@@ -124,17 +89,16 @@ export const TermsOfUsePage = () => {
               <a href="https://creativecommons.org/licenses/by-nc-nd/4.0/deed.ru" target="_blank">
                 Creative Commons BY-NC-ND 4.0
               </a>
-                  . Все материалы сайта предназначены исключительно для личного некоммерческого
+              . Все материалы сайта предназначены исключительно для личного некоммерческого использования.
-                  использования. Права на&nbsp;дизайн и&nbsp;программный код сайта принадлежат Издательству.
+              Права на&nbsp;дизайн и&nbsp;программный код сайта принадлежат Издательству.
             </p>
           </li>
           <li>
             <p class="ng-binding">
-                  Все аудиовизуальные произведения являются собственностью своих авторов
+              Все аудиовизуальные произведения являются собственностью своих авторов и&nbsp;правообладателей
-                  и&nbsp;правообладателей и&nbsp;используются только в&nbsp;образовательных
+              и&nbsp;используются только в&nbsp;образовательных и&nbsp;информационных целях. Если
-                  и&nbsp;информационных целях. Если вы&nbsp;являетесь собственником того или иного
+              вы&nbsp;являетесь собственником того или иного произведения и&nbsp;не&nbsp;согласны с&nbsp;его
-                  произведения и&nbsp;не&nbsp;согласны с&nbsp;его размещением на&nbsp;сайте, пожалуйста,
+              размещением на&nbsp;сайте, пожалуйста, напишите на&nbsp;
-                  напишите на&nbsp;
               <a href="mailto:welcome@discours.io" target="_blank">
                 welcome@discours.io
               </a>
@@ -162,9 +126,9 @@ export const TermsOfUsePage = () => {
             <h4>На&nbsp;сайте запрещено:</h4>
             <ul>
               <li>
-                    Публиковать контент, авторские права на&nbsp;который принадлежат третьим лицам, без
+                Публиковать контент, авторские права на&nbsp;который принадлежат третьим лицам, без согласия
-                    согласия этих лиц. Если авторские права на контент принадлежат нескольким лицам,
+                этих лиц. Если авторские права на контент принадлежат нескольким лицам, то&nbsp;его
-                    то&nbsp;его публикация предполагает согласие их&nbsp;всех.
+                публикация предполагает согласие их&nbsp;всех.
               </li>
               <li>Размещать коммерческую и&nbsp;политическую рекламу.</li>
               <li>
@@ -173,29 +137,28 @@ export const TermsOfUsePage = () => {
               </li>
               <li>Выдавать себя за&nbsp;другого человека и&nbsp;представляться его именем.</li>
               <li>
-                    Размещать информацию, которая не&nbsp;соответствует целям создания Сайта, ущемляет
+                Размещать информацию, которая не&nbsp;соответствует целям создания Сайта, ущемляет интересы
-                    интересы других пользователей или третьих лиц, нарушает законы Российской Федерации.
+                других пользователей или третьих лиц, нарушает законы Российской Федерации.
               </li>
             </ul>
           </li>
           <li>
             <p>
-                  Пользователь несет всю ответственность за&nbsp;содержание публикуемого контента
+              Пользователь несет всю ответственность за&nbsp;содержание публикуемого контента и&nbsp;свое
-                  и&nbsp;свое взаимодействие с&nbsp;другими пользователями, и&nbsp;обязуется возместить все
+              взаимодействие с&nbsp;другими пользователями, и&nbsp;обязуется возместить все расходы
-                  расходы в&nbsp;случае предъявления каких-либо претензий третьими лицами. Издательство
+              в&nbsp;случае предъявления каких-либо претензий третьими лицами. Издательство не&nbsp;несет
-                  не&nbsp;несет ответственности за&nbsp;содержание публикуемой пользователями информации,
+              ответственности за&nbsp;содержание публикуемой пользователями информации, в&nbsp;том числе
-                  в&nbsp;том числе за&nbsp;размещенные на&nbsp;сайте комментарии. Переписка между
+              за&nbsp;размещенные на&nbsp;сайте комментарии. Переписка между Пользователем
-                  Пользователем и&nbsp;Издательством считается юридически значимой. Настоящие Правила могут
+              и&nbsp;Издательством считается юридически значимой. Настоящие Правила могут быть изменены
-                  быть изменены Издательством, изменения вступают в&nbsp;силу с&nbsp;момента публикации
+              Издательством, изменения вступают в&nbsp;силу с&nbsp;момента публикации на&nbsp;Сайте.
-                  на&nbsp;Сайте.
             </p>
           </li>
           <li>
             <p>
               Если Пользователь очевидно и&nbsp;целенаправленно нарушает правила, Издательство может
-                  и&nbsp;принять в&nbsp;отношении автора следующие меры: вынести предупреждение
+              и&nbsp;принять в&nbsp;отношении автора следующие меры: вынести предупреждение и&nbsp;обязать
-                  и&nbsp;обязать автора устранить допущенное нарушение, удалить контент, нарушающий правила,
+              автора устранить допущенное нарушение, удалить контент, нарушающий правила, заблокировать или
-                  заблокировать или удалить аккаунт нарушителя.
+              удалить аккаунт нарушителя.
             </p>
           </li>
         </ol>
@@ -208,18 +171,17 @@ export const TermsOfUsePage = () => {
                 <p>
                   Данные, которые пользователи сообщают о&nbsp;себе сами при подаче заявки, регистрации,
                   авторизации или заполнения профиля, в&nbsp;том числе ФИО и&nbsp;контактную информацию.
-                      Конфиденциальные данные, такие как идентификатор и&nbsp;электронный адрес,
+                  Конфиденциальные данные, такие как идентификатор и&nbsp;электронный адрес, используются
-                      используются для идентификации пользователя. Данные профиля, размещённые публично
+                  для идентификации пользователя. Данные профиля, размещённые публично по&nbsp;желанию
-                      по&nbsp;желанию пользователя, которое выражается фактом их&nbsp;предоставления,
+                  пользователя, которое выражается фактом их&nbsp;предоставления, используется для
-                      используется для демонстрации другим пользователям той информации о&nbsp;себе, которую
+                  демонстрации другим пользователям той информации о&nbsp;себе, которую пользователь готов
-                      пользователь готов предоставить.
+                  предоставить.
                 </p>
               </li>
               <li>
                 <p>
-                      Данные, собранные автоматическим путем, такие, как cookie-файлы. Эти
+                  Данные, собранные автоматическим путем, такие, как cookie-файлы. Эти неперсонализированные
-                      неперсонализированные данные могут использоваться для сбора статистики
+                  данные могут использоваться для сбора статистики и&nbsp;улучшения работы сайта.
-                      и&nbsp;улучшения работы сайта.
                 </p>
               </li>
             </ul>
@@ -242,8 +204,8 @@ export const TermsOfUsePage = () => {
           </li>
           <li>
             <p>
-                  Если в&nbsp;информации, предоставляемой Издательству Пользователем, содержатся
+              Если в&nbsp;информации, предоставляемой Издательству Пользователем, содержатся персональные
-                  персональные данные последнего, то&nbsp;фактом их&nbsp;предоставления он соглашается
+              данные последнего, то&nbsp;фактом их&nbsp;предоставления он соглашается
               на&nbsp;их&nbsp;обработку любым способом, не&nbsp;запрещенным законодательством РФ.
             </p>
             <p class="ng-binding">
@@ -260,8 +222,8 @@ export const TermsOfUsePage = () => {
           </li>
           <li>
             <p>
-                  Данные, которые мы&nbsp;получаем от&nbsp;вас, мы&nbsp;используем только
+              Данные, которые мы&nbsp;получаем от&nbsp;вас, мы&nbsp;используем только в&nbsp;соответствии
-                  в&nbsp;соответствии с&nbsp;принципами обработки данных, указанными в&nbsp;этом документе.
+              с&nbsp;принципами обработки данных, указанными в&nbsp;этом документе.
             </p>
           </li>
         </ol>
@@ -274,10 +236,8 @@ export const TermsOfUsePage = () => {
           </a>{' '}
           или через форму <a href="/connect">&laquo;предложить идею&raquo;</a>.
         </p>
-          </div>
-        </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/about/thanks.page.tsx

@@ -1,22 +1,32 @@
 import { Meta } from '@solidjs/meta'
 
-import { PageLayout } from '../../components/_shared/PageLayout'
+import { StaticPage } from '../../components/Views/StaticPage'
 import { useLocalize } from '../../context/localize'
+import { getImageUrl } from '../../utils/getImageUrl'
 
 export const ThanksPage = () => {
   const { t } = useLocalize()
-  const title = t('Thank you')
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Thank you')
+  const description = t(
+    'Self-publishing exists thanks to the help of wonderful people from all over the world. Thank you!',
+  )
+
   return (
-    <PageLayout title={title}>
+    <StaticPage title={ogTitle}>
-      <Meta name="description" content={title} />
-      <Meta name="keywords" content={`Discours.io, ${title}`} />
-      <Meta property="og:title" content={title} />
-      <Meta property="og:description" content={title} />
       <article class="wide-container container--static-page">
-        <div class="row">
+        <Meta name="descprition" content={description} />
-          <div class="col-md-12 col-xl-14 offset-md-5 order-md-first">
+        <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>
-              <span class="wrapped">{title}</span>
+          <span class="wrapped">{ogTitle}</span>
         </h1>
         {/*
                 <h3><b>Команда</b></h3>
@@ -45,14 +55,13 @@ export const ThanksPage = () => {
   */}
         <h3>Неоценимый вклад в&nbsp;Дискурс внесли и&nbsp;вносят</h3>
         <p>
-              Мария Бессмертная, Дамир Бикчурин, Константин Ворович, Ян&nbsp;Выговский, Эльдар Гариффулин,
+          Мария Бессмертная, Дамир Бикчурин, Константин Ворович, Ян&nbsp;Выговский, Эльдар Гариффулин, Павел
-              Павел Гафаров, Виктория Гендлина, Александр Гусев, Данила Давыдов, Константин Дубовик,
+          Гафаров, Виктория Гендлина, Александр Гусев, Данила Давыдов, Константин Дубовик, Вячеслав
-              Вячеслав Еременко, Кристина Ибрагим, Екатерина Ильина, Анна Капаева, Яна Климова, Александр
+          Еременко, Кристина Ибрагим, Екатерина Ильина, Анна Капаева, Яна Климова, Александр Коренков, Ирэна
-              Коренков, Ирэна Лесневская, Игорь Лобанов, Анастасия Лозовая, Григорий Ломизе, Евгений
+          Лесневская, Игорь Лобанов, Анастасия Лозовая, Григорий Ломизе, Евгений Медведев, Павел Никулин,
-              Медведев, Павел Никулин, Николай Носачевский, Андрей Орловский, Михаил Панин, Антон Панов,
+          Николай Носачевский, Андрей Орловский, Михаил Панин, Антон Панов, Павел Пепперштейн, Любовь
-              Павел Пепперштейн, Любовь Покровская, Илья Розовский, Денис Светличный, Павел Соколов, Сергей
+          Покровская, Илья Розовский, Денис Светличный, Павел Соколов, Сергей Стрельников, Глеб Струнников,
-              Стрельников, Глеб Струнников, Николай Тарковский, Кирилл Филимонов, Алексей Хапов, Екатерина
+          Николай Тарковский, Кирилл Филимонов, Алексей Хапов, Екатерина Харитонова
-              Харитонова
         </p>
         <h3>Авторы</h3>
         <p>
@@ -62,28 +71,25 @@ export const ThanksPage = () => {
           </a>{' '}
           за&nbsp;участие и&nbsp;поддержку проекта. Сегодня, когда для большинства деньги стали целью
           и&nbsp;основным источником мотивации, бескорыстная помощь и&nbsp;основанный на&nbsp;энтузиазме
-              труд бесценны. Именно вы&nbsp;своим трудом каждый день делаете Дискурс таким, какой
+          труд бесценны. Именно вы&nbsp;своим трудом каждый день делаете Дискурс таким, какой он&nbsp;есть.
-              он&nbsp;есть.
         </p>
         <h3>Иллюстраторы</h3>
         <p>
-              Ольга Аверинова, Регина Акчурина, Айгуль Берхеева, Екатерина Вакуленко, Анастасия Викулова,
+          Ольга Аверинова, Регина Акчурина, Айгуль Берхеева, Екатерина Вакуленко, Анастасия Викулова, Мария
-              Мария Власенко, Ванесса Гаврилова, Ольга Горше, Ксения Горшкова, Ангелина Гребенюкова, Илья
+          Власенко, Ванесса Гаврилова, Ольга Горше, Ксения Горшкова, Ангелина Гребенюкова, Илья Diliago,
-              Diliago, Антон Жаголкин, Саша Керова, Ольга Машинец, Злата Мечетина, Тала Никитина, Никита
+          Антон Жаголкин, Саша Керова, Ольга Машинец, Злата Мечетина, Тала Никитина, Никита Поздняков,
-              Поздняков, Матвей Сапегин, Татьяна Сафонова, Виктория Шибаева
+          Матвей Сапегин, Татьяна Сафонова, Виктория Шибаева
         </p>
         <h3>Меценаты</h3>
         <p>
-              Дискурс существует исключительно на&nbsp;пожертвования читателей. Мы&nbsp;бесконечно
+          Дискурс существует исключительно на&nbsp;пожертвования читателей. Мы&nbsp;бесконечно признательны
-              признательны всем, кто нас поддерживает. Ваши пожертвования&nbsp;&mdash; финансовый фундамент
+          всем, кто нас поддерживает. Ваши пожертвования&nbsp;&mdash; финансовый фундамент журнала.
-              журнала. Благодаря вам мы&nbsp;развиваем платформу качественной журналистики, которая помогает
+          Благодаря вам мы&nbsp;развиваем платформу качественной журналистики, которая помогает самым разным
-              самым разным авторам быть услышанными. Стать нашим меценатом и&nbsp;подписаться
+          авторам быть услышанными. Стать нашим меценатом и&nbsp;подписаться на&nbsp;ежемесячную поддержку
-              на&nbsp;ежемесячную поддержку проекта можно <a href="/about/help">здесь</a>.
+          проекта можно <a href="/about/help">здесь</a>.
         </p>
-          </div>
-        </div>
       </article>
-    </PageLayout>
+    </StaticPage>
   )
 }
 

src/pages/allAuthors.page.tsx

@@ -1,8 +1,7 @@
 import type { PageProps } from './types'
 
-import { createSignal, onMount, Show } from 'solid-js'
+import { createSignal, onMount } from 'solid-js'
 
-import { Loading } from '../components/_shared/Loading'
 import { PageLayout } from '../components/_shared/PageLayout'
 import { AllAuthorsView } from '../components/Views/AllAuthors'
 import { useLocalize } from '../context/localize'
@@ -24,9 +23,7 @@ export const AllAuthorsPage = (props: PageProps) => {
 
   return (
     <PageLayout title={t('Authors')}>
-      <Show when={isLoaded()} fallback={<Loading />}>
+      <AllAuthorsView isLoaded={isLoaded()} authors={props.allAuthors} />
-        <AllAuthorsView authors={props.allAuthors} />
-      </Show>
     </PageLayout>
   )
 }

src/pages/allTopics.page.tsx

@@ -1,8 +1,7 @@
 import type { PageProps } from './types'
 
-import { createSignal, onMount, Show } from 'solid-js'
+import { createSignal, onMount } from 'solid-js'
 
-import { Loading } from '../components/_shared/Loading'
 import { PageLayout } from '../components/_shared/PageLayout'
 import { AllTopicsView } from '../components/Views/AllTopics'
 import { useLocalize } from '../context/localize'
@@ -23,10 +22,8 @@ export const AllTopicsPage = (props: PageProps) => {
   })
 
   return (
-    <PageLayout title={t('All topics')}>
+    <PageLayout title={t('Themes and plots')}>
-      <Show when={isLoaded()} fallback={<Loading />}>
+      <AllTopicsView isLoaded={isLoaded()} topics={props.allTopics} />
-        <AllTopicsView topics={props.allTopics} />
-      </Show>
     </PageLayout>
   )
 }

src/pages/create.page.tsx

@@ -1,4 +1,5 @@
 import { redirectPage } from '@nanostores/router'
+import { Meta } from '@solidjs/meta'
 import { clsx } from 'clsx'
 
 import { Button } from '../components/_shared/Button'
@@ -8,6 +9,7 @@ import { AuthGuard } from '../components/AuthGuard'
 import { useLocalize } from '../context/localize'
 import { apiClient } from '../graphql/client/core'
 import { router } from '../stores/router'
+import { getImageUrl } from '../utils/getImageUrl'
 
 import { LayoutType } from './types'
 
@@ -22,9 +24,22 @@ const handleCreate = async (layout: LayoutType) => {
 
 export const CreatePage = () => {
   const { t } = useLocalize()
+  const ogImage = getImageUrl('production/image/logo_image.png')
+  const ogTitle = t('Choose a post type')
+  const description = t('Participate in the Discours: share information, join the editorial team')
 
   return (
-    <PageLayout title={t('Choose a post type')}>
+    <PageLayout 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} />
       <AuthGuard>
         <article class={clsx('wide-container', 'container--static-page', styles.Create)}>
           <h1>{t('Choose a post type')}</h1>

src/pages/expo/expo.page.route.ts

@@ -1,4 +1,5 @@
 import { ROUTES } from '../../stores/router'
 import { getServerRoute } from '../../utils/getServerRoute'
 
-export default getServerRoute(ROUTES.expo)
+// yes, it's a hack
+export default getServerRoute(ROUTES.expo.replace(':layout?', '*'))

src/pages/expo/expo.page.server.ts

@@ -4,12 +4,16 @@ import type { PageProps } from '../types'
 import { PRERENDERED_ARTICLES_COUNT } from '../../components/Views/Expo/Expo'
 import { apiClient } from '../../graphql/client/core'
 
-export const onBeforeRender = async (_pageContext: PageContext) => {
+export const onBeforeRender = async (pageContext: PageContext) => {
+  const { layout } = pageContext.routeParams
+
   const expoShouts = await apiClient.getShouts({
     filters: { layouts: ['audio', 'video', 'literature', 'image'] },
     limit: PRERENDERED_ARTICLES_COUNT,
   })
+
   const pageProps: PageProps = { expoShouts, seo: { title: '' } }
+
   return {
     pageContext: {
       pageProps,

src/pages/expo/expo.page.tsx

@@ -1,6 +1,6 @@
 import type { PageProps } from '../types'
 
-import { createMemo } from 'solid-js'
+import { createEffect, createMemo, on } from 'solid-js'
 
 import { PageLayout } from '../../components/_shared/PageLayout'
 import { Topics } from '../../components/Nav/Topics'
@@ -14,7 +14,7 @@ export const ExpoPage = (props: PageProps) => {
   const { page } = useRouter()
   const getLayout = createMemo<LayoutType>(() => page().params['layout'] as LayoutType)
 
-  const title = createMemo(() => {
+  const getTitle = () => {
     switch (getLayout()) {
       case 'audio': {
         return t('Audio')
@@ -32,12 +32,22 @@ export const ExpoPage = (props: PageProps) => {
         return t('Art')
       }
     }
-  })
+  }
+
+  createEffect(
+    on(
+      () => getLayout(),
+      () => {
+        document.title = getTitle()
+      },
+      { defer: true },
+    ),
+  )
 
   return (
-    <PageLayout withPadding={true} zeroBottomPadding={true} title={title()}>
+    <PageLayout withPadding={true} zeroBottomPadding={true} title={getTitle()}>
       <Topics />
-      <Expo shouts={props.expoShouts} />
+      <Expo shouts={props.expoShouts} layout={getLayout()} />
     </PageLayout>
   )
 }

src/pages/expo/expoLayout.page.route.ts

@@ -1,4 +0,0 @@
-import { ROUTES } from '../../stores/router'
-import { getServerRoute } from '../../utils/getServerRoute'
-
-export default getServerRoute(ROUTES.expoLayout)

src/pages/expo/expoLayout.page.server.ts

@@ -1,21 +0,0 @@
-import type { PageContext } from '../../renderer/types'
-import type { PageProps } from '../types'
-
-import { PRERENDERED_ARTICLES_COUNT } from '../../components/Views/Expo/Expo'
-import { apiClient } from '../../graphql/client/core'
-
-export const onBeforeRender = async (pageContext: PageContext) => {
-  const { layout } = pageContext.routeParams
-  const options = {
-    filters: { layouts: [layout] },
-    limit: PRERENDERED_ARTICLES_COUNT,
-  }
-  const expoShouts = await apiClient.getShouts(options)
-  const pageProps: PageProps = { expoShouts, seo: { title: '' } }
-
-  return {
-    pageContext: {
-      pageProps,
-    },
-  }
-}

src/pages/feed.page.tsx

@@ -2,7 +2,7 @@ import { createEffect, Match, on, onCleanup, Switch } from 'solid-js'
 
 import { PageLayout } from '../components/_shared/PageLayout'
 import { AuthGuard } from '../components/AuthGuard'
-import { FeedView } from '../components/Views/Feed'
+import { Feed } from '../components/Views/Feed'
 import { useLocalize } from '../context/localize'
 import { ReactionsProvider } from '../context/reactions'
 import { LoadShoutsOptions } from '../graphql/schema/core.gen'
@@ -40,13 +40,13 @@ export const FeedPage = () => {
   return (
     <PageLayout title={t('Feed')}>
       <ReactionsProvider>
-        <Switch fallback={<FeedView loadShouts={handleFeedLoadShouts} />}>
+        <Switch fallback={<Feed loadShouts={handleFeedLoadShouts} />}>
           <Match when={page().route === 'feed'}>
-            <FeedView loadShouts={handleFeedLoadShouts} />
+            <Feed loadShouts={handleFeedLoadShouts} />
           </Match>
           <Match when={page().route === 'feedMy'}>
             <AuthGuard>
-              <FeedView loadShouts={handleMyFeedLoadShouts} />
+              <Feed loadShouts={handleMyFeedLoadShouts} />
             </AuthGuard>
           </Match>
         </Switch>

src/pages/topic.page.tsx

@@ -1,8 +1,7 @@
 import type { PageProps } from './types'
 
-import { createEffect, createMemo, createSignal, on, onCleanup, onMount, Show } from 'solid-js'
+import { createEffect, createMemo, createSignal, on, onCleanup, onMount } from 'solid-js'
 
-import { Loading } from '../components/_shared/Loading'
 import { PageLayout } from '../components/_shared/PageLayout'
 import { PRERENDERED_ARTICLES_COUNT, TopicView } from '../components/Views/Topic'
 import { ReactionsProvider } from '../context/reactions'
@@ -12,13 +11,12 @@ import { loadTopic } from '../stores/zine/topics'
 
 export const TopicPage = (props: PageProps) => {
   const { page } = useRouter()
-
   const slug = createMemo(() => page().params['slug'] as string)
 
   const [isLoaded, setIsLoaded] = createSignal(
     Boolean(props.topicShouts) && Boolean(props.topic) && props.topic.slug === slug(),
   )
-
+  const [pageTitle, setPageTitle] = createSignal<string>()
   const preload = () =>
     Promise.all([
       loadShouts({ filters: { topic: slug() }, limit: PRERENDERED_ARTICLES_COUNT, offset: 0 }),
@@ -53,15 +51,15 @@ export const TopicPage = (props: PageProps) => {
   const usePrerenderedData = props.topic?.slug === slug()
 
   return (
-    <PageLayout title={props.seo?.title}>
+    <PageLayout title={pageTitle()}>
       <ReactionsProvider>
-        <Show when={isLoaded()} fallback={<Loading />}>
         <TopicView
+          title={(title) => setPageTitle(title)}
+          isLoaded={isLoaded()}
           topic={usePrerenderedData ? props.topic : null}
           shouts={usePrerenderedData ? props.topicShouts : null}
           topicSlug={slug()}
         />
-        </Show>
       </ReactionsProvider>
     </PageLayout>
   )

src/stores/router.ts

@@ -37,8 +37,7 @@ export const ROUTES = {
   projects: '/about/projects',
   termsOfUse: '/about/terms-of-use',
   thanks: '/about/thanks',
-  expo: '/expo',
+  expo: '/expo/:layout?',
-  expoLayout: '/expo/:layout',
   profileSettings: '/profile/settings',
   profileSecurity: '/profile/security',
   profileSubscriptions: '/profile/subscriptions',

src/stores/zine/articles.ts

@@ -195,14 +195,6 @@ export const resetSortedArticles = () => {
   setSortedArticles([])
 }
 
-export const createArticle = async ({ article }: { article: ShoutInput }) => {
-  try {
-    await apiClient.createArticle({ article })
-  } catch (error) {
-    console.error(error)
-  }
-}
-
 type InitialState = {
   shouts?: Shout[]
 }

src/utils/getServerDate.ts

@@ -0,0 +1,4 @@
+export const getServerDate = (date: Date): string => {
+  // 2023-12-31
+  return date.toISOString().slice(0, 10)
+}

src/utils/meta.ts

@@ -1,10 +1,24 @@
+import { Shout } from '../graphql/types.gen'
+
+const MAX_DESCRIPTION_LENGTH = 150
 export const getDescription = (body: string): string => {
   if (!body) {
     return ''
   }
   const descriptionWordsArray = body
-    .slice(0, 150) // meta description is roughly 155 characters long
+    .replaceAll(/<[^>]*>/g, ' ')
-    .replaceAll(/<[^>]*>/g, '')
+    .replaceAll(/\s+/g, ' ')
     .split(' ')
-  return descriptionWordsArray.splice(0, descriptionWordsArray.length - 1).join(' ') + '...'
+  // ¯\_(ツ)_/¯ maybe need to remove the punctuation
+  let description = ''
+  let i = 0
+  while (i < descriptionWordsArray.length && description.length < MAX_DESCRIPTION_LENGTH) {
+    description += descriptionWordsArray[i] + ' '
+    i++
+  }
+  return description.trim()
+}
+
+export const getKeywords = (shout: Shout): string => {
+  return shout.topics.map((topic) => topic.title).join(', ')
 }