header plugs is back again

src/components/main/Header/index.tsx

@@ -15,6 +15,7 @@ import { pick } from 'ramda';
 import { UserButton } from '../UserButton';
 import { Icon } from '~/components/input/Icon';
 import { Notifications } from '../Notifications';
+import { URLS } from '~/constants/urls';
 
 const mapStateToProps = state => ({
   user: pick(['username', 'is_user', 'photo'])(selectUser(state)),
@@ -42,7 +43,17 @@ const HeaderUnconnected: FC<IProps> = memo(
 
         {is_user && (
           <div className={style.plugs}>
-            <Notifications />
+            <Link className={style.item} to={URLS.BASE}>
+              FLOW
+            </Link>
+
+            <Link className={style.item} to={URLS.BORIS}>
+              BORIS
+            </Link>
+
+            <div className={style.item}>
+              <Notifications />
+            </div>
           </div>
         )}
 

src/components/main/Header/style.scss

@@ -17,18 +17,6 @@
   text-transform: uppercase;
   align-items: center;
 
-  &::after {
-    content: ' ';
-    margin-left: $spc;
-    background: white;
-    width: 4px;
-    height: $gap;
-    display: block;
-    opacity: 0.2;
-    border-radius: 4px;
-    margin-right: 10px;
-  }
-
   & > a.item,
   & > div.item {
     font: $font_16_medium;
@@ -50,6 +38,17 @@
       padding-left: $spc + $gap;
     }
 
+    &::after {
+      content: ' ';
+      margin-left: $spc;
+      background: white;
+      width: 4px;
+      height: $gap;
+      display: block;
+      opacity: 0.2;
+      border-radius: 4px;
+    }
+
     &:last-child {
       // padding-right: 0;
 

src/components/main/Notifications/styles.scss

@@ -20,6 +20,9 @@
   fill: white;
   position: relative;
   outline: none;
+  color: white;
+  word-wrap: initial;
+  white-space: initial;
 
   &.active {
     .icon {