added login stamp

src/components/flow/FlowGrid/styles.module.scss

@@ -1,4 +1,4 @@
-@import "src/styles/variables";
+@import 'src/styles/variables';
 
 @mixin mobile {
   @media (max-width: $cell * 2) {

src/components/flow/FlowLoginStamp/index.tsx

@@ -0,0 +1,35 @@
+import React, { FC, useCallback } from 'react';
+
+import { Filler } from '~/components/containers/Filler';
+import { Button } from '~/components/input/Button';
+import { Dialog } from '~/constants/modal';
+import { useShowModal } from '~/hooks/modal/useShowModal';
+
+import styles from './styles.module.scss';
+
+const FlowLoginStamp = () => {
+  const showModal = useShowModal(Dialog.Login);
+
+  const onClick = useCallback(() => showModal({}), []);
+
+  return (
+    <div className={styles.stamp}>
+      <Filler />
+
+      <div className={styles.content}>
+        <h2>Привет, друг</h2>
+        <p>Ночь темна и полна опасностей, не желаешь ли войти?</p>
+        <Button
+          stretchy
+          color="outline-white"
+          className={styles.button}
+          onClick={onClick}
+        >
+          Впустите меня!
+        </Button>
+      </div>
+    </div>
+  );
+};
+
+export { FlowLoginStamp };

src/components/flow/FlowLoginStamp/styles.module.scss

@@ -0,0 +1,42 @@
+@import 'src/styles/variables';
+
+.stamp {
+  @include outer_shadow;
+
+  background: #2b0011 url('/images/join_us.svg') 50% 100%;
+  background-size: cover;
+  width: 100%;
+  border-radius: $cell_radius;
+  display: flex;
+  flex-direction: column;
+}
+
+.content {
+  padding: $gap;
+  box-sizing: border-box;
+  flex: 0 1;
+
+  h2 {
+    font: $font_cell_title;
+    text-transform: uppercase;
+    word-break: break-word;
+
+    @include tablet {
+      font: $font_18_semibold;
+    }
+  }
+
+  p {
+    margin: 0.5em 0;
+    line-height: 1.4em;
+    font: $font_16_medium;
+
+    @include phone {
+      font: $font_14_medium;
+    }
+  }
+}
+
+.button {
+  margin-top: 1.4em;
+}