Merge pull request #43 from GetStream/develop

Publish develop changes to NPM

Author: petyosi

src/styles/Thread.scss

@@ -136,7 +136,15 @@
         padding-top: 0;
 
         &.str-chat__thread--full {
+          position: fixed;
+          top: 0;
+          right: 0;
+          height: 100vh;
+          background: var(--white);
+          z-index: 1000;
           margin: 0;
+          width: 100vw;
+          max-width: 100%;
         }
 
         .str-chat__gallery {
@@ -257,6 +265,18 @@
   .str-chat__thread {
     background: transparent;
 
+    &--full {
+      position: fixed;
+      top: 0;
+      right: 0;
+      height: 100vh;
+      background: var(--white);
+      z-index: 1000;
+      margin: 0;
+      width: 100vw;
+      max-width: 100%;
+    }
+
     &-header {
       background: var(--white30);
     }

src/styles/_base.scss

@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,400i,700,700i');
-
 .str-chat {
   box-sizing: border-box;
 
@@ -15,16 +13,6 @@
   clear: both;
 }
 
-// button {
-//   cursor: pointer;
-//   background-color: transparent;
-//   border: none;
-//   padding: 0;
-//   display: flex;
-//   align-items: center;
-//   width: auto;
-// }
-
 .messenger-chat {
   &.str-chat {
     display: flex;
@@ -143,6 +131,10 @@ $emoji-flag-unicode-range: U+1F1E6-1F1FF;
       display: flex;
       flex-direction: column;
       flex: 1;
+
+      &--hideOnThread {
+        display: none;
+      }
     }
 
     .rfu-dropzone {

src/styles/_variables.scss

@@ -1,5 +1,8 @@
 /* fonts */
-$main-font: 'IBM Plex Sans', sans-serif;
+/* https://systemfontstack.com/ */
+$system-stack-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu,
+  Cantarell, 'Helvetica Neue', sans-serif;
+$main-font: #{$system-stack-font};
 $second-font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 
 $base-font-weight: 400;

src/styles/vendor/react-file-utils.scss

@@ -139,6 +139,8 @@
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
+  border: none;
+  background: transparent;
 }
 .rfu-icon-button svg {
   margin: 4px;