fix: header styles

hackforplay · Nov 20, 2019 · 56c342d · 56c342d
1 parent d88cf8f
commit 56c342d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/src/header.tsx b/src/header.tsx
@@ -19,7 +19,6 @@ export function Header() {
         Menu
       </IconButton>
       <span>TITLE</span>
-      <div className={flex.blank}></div>
       <CollaboratorIcons />
       <IconButton name="cloud" onClick={debug}>
         Debug

diff --git a/src/styles/button.scss b/src/styles/button.scss
@@ -88,6 +88,9 @@
   span {
     margin-left: 2px;
     padding: 2px 8px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 }
 

diff --git a/src/styles/collaborator-icons.scss b/src/styles/collaborator-icons.scss
@@ -13,10 +13,12 @@ $gap: 5px;
 }
 
 .wrapper {
-  justify-content: flex-end;
+  flex: 1;
+  justify-content: flex-start;
   flex-direction: row-reverse;
   padding: 4px $overlap;
   margin-right: 8px;
+  overflow: hidden;
 }
 
 .item {
@@ -68,7 +70,7 @@ $gap: 5px;
   .text {
     flex: 1;
     color: $alterColor;
-    margin: -5px 4px 0 0;
+    margin: -2px 4px 0 0;
     overflow: hidden;
 
     .userName {

diff --git a/src/styles/element.scss b/src/styles/element.scss
@@ -27,10 +27,11 @@
 // ヘッダー
 .header {
   @include shadow(1);
-  flex: 0 0 32px;
+  flex: 0 0 44px;
   color: $textColor;
   background-color: $paperColor;
   z-index: 100;
+  overflow: hidden;
 }
 
 // テキストセル