Page creation basics (#7)

* Page cration basics

* remove unused code

* add client-side Header validation

* remove static method

* rm await duplication

src/frontend/styles/components/writing.pcss

@@ -0,0 +1,20 @@
+.writing-header {
+  display: flex;
+  padding: 15px 0;
+  margin-top: calc(-1 * var(--layout-padding-vertical));
+  position: sticky;
+  top: 0;
+  background: #fff;
+  z-index: 2;
+  box-shadow: 0 3px 10px #fff;
+
+  &__save {
+    @apply --button;
+    margin-left: auto;
+  }
+
+  &__left {
+    margin: auto 0;
+    color: var(--color-text-second);
+  }
+}

src/frontend/styles/layout.pcss

@@ -18,6 +18,6 @@
 
   &__aside,
   &__content {
-    padding: 40px 0;
+    padding: var(--layout-padding-vertical) 0;
   }
 }

src/frontend/styles/main.pcss

@@ -3,6 +3,7 @@
 @import url('layout.pcss');
 @import url('components/header.pcss');
 @import url('components/aside.pcss');
+@import url('components/writing.pcss');
 
 body {
   font-family: system-ui, Helvetica, Arial, Verdana;

src/frontend/styles/vars.pcss

@@ -8,6 +8,7 @@
    * Site layout sizes
    */
   --layout-padding-horisontal: 40px;
+  --layout-padding-vertical: 40px;
   --layout-width-aside: 250px;
   --layout-width-main-col: 650px;