mastofe

commit: 07994eed002375025f0c377079500d25e87cb641
parent: bab9afaa092e0eb8b3f11fdcdaf7a75d3ce94566
Author: Lynx Kotoura <lynx@lv9.org>
Date:   Mon, 28 Aug 2017 07:01:07 +0900

Adjust "signed in as" pages (#4720)

* Adjust "signed in as" pages


Fix min-width


Set width of .account-header .name

To apply text-overflow and overflow settings
Set overflow for detailed-status__display-name

* Remove trailing whitespace

Diffstat:
M
app/javascript/styles/components.scss
2
++
M
app/javascript/styles/containers.scss
6
+++++-
M
app/javascript/styles/forms.scss
4
++++

3 files changed, 11 insertions(+), 1 deletion(-)
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
@@ -1057,6 +1057,8 @@
   strong,
   span {
     display: block;
+    text-overflow: ellipsis;
+    overflow: hidden;
   }
 
   strong {
diff --git a/app/javascript/styles/containers.scss b/app/javascript/styles/containers.scss
@@ -72,7 +72,7 @@
   margin-bottom: -30px;
   margin-top: 40px;
 
-  @media screen and (max-width: 400px) {
+  @media screen and (max-width: 440px) {
     width: 100%;
     margin: 0;
     margin-bottom: 10px;
@@ -97,10 +97,13 @@
   .name {
     flex: 1 1 auto;
     color: $ui-secondary-color;
+    width: calc(100% - 88px);
 
     .username {
       display: block;
       font-weight: 500;
+      text-overflow: ellipsis;
+      overflow: hidden;
     }
   }
 
@@ -108,5 +111,6 @@
     display: block;
     font-size: 32px;
     line-height: 40px;
+    margin-left: 8px;
   }
 }
diff --git a/app/javascript/styles/forms.scss b/app/javascript/styles/forms.scss
@@ -359,6 +359,10 @@ code {
     color: $ui-secondary-color;
     font-weight: 500;
   }
+
+  @media screen and (max-width: 740px) and (min-width: 441px) {
+    margin-top: 40px;
+  }
 }
 
 .qr-wrapper {