Merge pull request #50 from Discours/connect-page

Created connect page

src/components/Pages/ConnectPage.tsx

@@ -0,0 +1,45 @@
+import { MainLayout } from '../Layouts/MainLayout'
+
+export const ConnectPage = () => {
+  return (
+    <MainLayout>
+      <article class="container container--static-page">
+        <div class="row">
+          <h1 class="col-md-8 offset-md-2">
+            <span class="wrapped">Предложить идею</span>
+          </h1>
+          <div class="col-md-8 col-lg-6 offset-md-3">
+            <p>
+              Хотите что-то предложить, обсудить или посоветовать? Поделиться темой или идеей? Напишите нам
+              скорее! Если укажете свою почту, мы&nbsp;обязательно ответим.
+            </p>
+
+            <form action=".">
+              <div class="pretty-form__item">
+                <select id="subject">
+                  <option value="">Сотрудничество</option>
+                  <option value="">Посоветовать тему</option>
+                  <option value="">Сообщить об ошибке</option>
+                  <option value="">Предложить проект</option>
+                  <option value="">Волонтерство</option>
+                  <option value="">Другое</option>
+                </select>
+              </div>
+              <div class="pretty-form__item">
+                <input type="text" id="contact-email" placeholder="Email для обратной связи" />
+                <label for="contact-email">Email для обратной связи</label>
+              </div>
+              <div class="pretty-form__item">
+                <textarea id="message" placeholder="Текст сообщения" />
+                <label for="message">Текст сообщения</label>
+              </div>
+              <button class="button">Отправить письмо</button>
+            </form>
+          </div>
+        </div>
+      </article>
+    </MainLayout>
+  )
+}
+
+export default ConnectPage

src/components/Root.tsx

@@ -29,6 +29,7 @@ import { ProjectsPage } from './Pages/about/ProjectsPage'
 import { TermsOfUsePage } from './Pages/about/TermsOfUsePage'
 import { ThanksPage } from './Pages/about/ThanksPage'
 import { CreatePage } from './Pages/CreatePage'
+import { ConnectPage } from './Pages/ConnectPage'
 import { renewSession } from '../stores/auth'
 
 // TODO: lazy load
@@ -59,6 +60,7 @@ type RootSearchParams = {
 }
 
 const pagesMap: Record<keyof Routes, Component<PageProps>> = {
+  connect: ConnectPage,
   create: CreatePage,
   home: HomePage,
   topics: AllTopicsPage,

src/components/Views/Connect.tsx

@@ -1,39 +0,0 @@
-export const ConnectView = () => (
-  <>
-    <article class="container">
-      <div class="row">
-        <h1 class="col-md-8 offset-md-2">
-          <span class="wrapped">Предложить идею</span>
-        </h1>
-        <div class="col-md-8 col-lg-6 offset-md-3">
-          <p>
-            Хотите что-то предложить, обсудить или посоветовать? Поделиться темой или идеей? Напишите нам
-            скорее! Если укажете свою почту, мы&nbsp;обязательно ответим.
-          </p>
-
-          <form action=".">
-            <div class="pretty-form__item">
-              <select id="subject">
-                <option value="">Сотрудничество</option>
-                <option value="">Посоветовать тему</option>
-                <option value="">Сообщить об ошибке</option>
-                <option value="">Предложить проект</option>
-                <option value="">Волонтерство</option>
-                <option value="">Другое</option>
-              </select>
-            </div>
-            <div class="pretty-form__item">
-              <input type="text" id="contact-email" placeholder="Email для обратной связи" />
-              <label for="contact-email">Email для обратной связи</label>
-            </div>
-            <div class="pretty-form__item">
-              <textarea id="message" placeholder="Текст сообщения" />
-              <label for="message">Текст сообщения</label>
-            </div>
-            <button class="button">Отправить письмо</button>
-          </form>
-        </div>
-      </div>
-    </article>
-  </>
-)

src/pages/connect.astro

@@ -0,0 +1,14 @@
+---
+import Zine from '../layouts/zine.astro'
+import { Root } from '../components/Root'
+import { initRouter } from '../stores/router'
+
+const { pathname, search } = Astro.url
+initRouter(pathname, search)
+
+Astro.response.headers.set('Cache-Control', 's-maxage=1, stale-while-revalidate')
+---
+
+<Zine>
+  <Root client:load />
+</Zine>

src/stores/router.ts

@@ -6,6 +6,7 @@ import { useStore } from '@nanostores/solid'
 // TODO: more
 export interface Routes {
   home: void
+  connect: void
   create: void
   topics: void
   topic: 'slug'
@@ -30,6 +31,7 @@ const searchParamsStore = createSearchParams()
 const routerStore = createRouter<Routes>(
   {
     home: '/',
+    connect: '/connect',
     create: '/create',
     topics: '/topics',
     topic: '/topic/:slug',