patch 5 (#1279)

ui/scss/component/_claim-list.scss

@@ -214,10 +214,27 @@
   }
 
   .claim-preview {
+    .claim-preview__text {
+      overflow: hidden;
+    }
     .claim-preview-metadata {
+      .claim-tile__info {
         .media__subtitle {
+          width: calc(100% - 2.1rem);
           .button {
             display: inline;
+            .button__content {
+              width: 100%;
+              .channel-name {
+                width: 100%;
+                p {
+                  width: 99%;
+                  white-space: nowrap;
+                  overflow: hidden;
+                  text-overflow: ellipsis;
+                }
+              }
+            }
           }
           span:not(.channel-name) {
             font-size: var(--font-xsmall);
@@ -225,6 +242,7 @@
         }
       }
     }
+  }
 
   &:hover {
     .claim__menu-button {

ui/scss/component/_main.scss

@@ -634,7 +634,7 @@ body {
       .claim-preview__wrapper {
         a {
           .button__content {
-            align-items: unset;
+            // align-items: unset;
           }
         }
       }
@@ -954,7 +954,7 @@ body {
 
     > :first-child {
       position: fixed;
-      background-color: var(--color-background);
+      // background-color: var(--color-background);
       width: calc(40% - var(--spacing-l));
       margin-top: var(--spacing-xl);
     }

ui/scss/component/section.scss

@@ -139,11 +139,12 @@
     text-align: center;
     font-size: var(--font-large);
     font-weight: var(--font-weight-base);
-    background-color: var(--color-background);
+    background-color: var(--color-header-background);
     position: absolute;
-    height: var(--spacing-xl);
+    height: var(--spacing-l);
     top: calc(var(--spacing-xl) / 2 + 10px);
-    padding: 0 var(--spacing-l);
+    padding: 0 var(--spacing-s) 0 var(--spacing-s);
+    border-radius: var(--border-radius);
   }
 }
 

ui/scss/init/_gui.scss

@@ -1208,6 +1208,15 @@ img {
 }
 .icon--ExternalLink {
   margin-top: -5px;
+  margin-left: 2px;
+  margin-left: var(--spacing-xxs) !important;
+}
+.markdown-preview {
+  .icon--ExternalLink {
+    flex-shrink: 0;
+    margin-bottom: -1px !important;
+    // margin-left:2px !important;
+  }
 }
 .hide-ribbon {
   .claim-tile__repost-author {