Merge pull request #49 from gVguy/master

Improve demo chat layout

Author: palkan

src/modules/blocks/demo.scss

@@ -56,6 +56,7 @@ $className: 'demo';
     }
 
     &__input {
+      width: 100%;
       max-width: 100%;
       appearance: none;
       border: none;
@@ -75,12 +76,13 @@ $className: 'demo';
       margin: 0 5px 5px 5px;
       color: $fontPrimaryInvertedColor;
       background-color: $accentPrimaryColor;
+      align-self: flex-end;
 
       &_theirs {
         color: $fontPrimaryColor;
         border-color: #dcdcdc;
         background-color: #dcdcdc;
-        align-self: flex-end;
+        align-self: flex-start;
       }
     }
 
@@ -101,7 +103,7 @@ $className: 'demo';
       border-bottom: 1px solid $borderPrimaryColor;
 
       &_offline {
-        & [role=status] {
+        & [role='status'] {
           color: $fontSecondaryColor;
 
           &::before {
@@ -134,13 +136,13 @@ $className: 'demo';
 
     &__status {
       font-size: 0.8rem;
-      color: #48BE00;
+      color: #48be00;
       font-weight: bold;
       text-decoration: none;
       position: relative;
 
       &::before {
-        content: "•";
+        content: '•';
         font-size: 40px;
         position: absolute;
         left: -14px;
@@ -149,4 +151,4 @@ $className: 'demo';
       }
     }
   }
-}
+}