about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/styles/about.scss
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2019-10-01 04:54:29 +0200
committerThibaut Girka <thib@sitedethib.com>2019-10-03 13:20:13 +0200
commitff4b95a2542e68f162b899b1b8996902a3cbb202 (patch)
tree54b455fea01f5270159e8b4b6c7f70388373d523 /app/javascript/flavours/glitch/styles/about.scss
parentbc4313369fb1ca6eae94954029901593345303b7 (diff)
[Glitch] Fix long domain block descriptions breaking table layout
Port SCSS changes from c35376132b6675c21c2c85dd2456cf0779e89ad9 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/styles/about.scss')
-rw-r--r--app/javascript/flavours/glitch/styles/about.scss21
1 files changed, 16 insertions, 5 deletions
diff --git a/app/javascript/flavours/glitch/styles/about.scss b/app/javascript/flavours/glitch/styles/about.scss
index 7c129674d..a38ca99b4 100644
--- a/app/javascript/flavours/glitch/styles/about.scss
+++ b/app/javascript/flavours/glitch/styles/about.scss
@@ -145,8 +145,6 @@ $small-breakpoint: 960px;
 
     thead tr,
     tbody tr {
-      break-after: auto;
-      break-inside: avoid;
       border-bottom: 1px solid lighten($ui-base-color, 4%);
       font-size: 1em;
       line-height: 1.625;
@@ -167,12 +165,25 @@ $small-breakpoint: 960px;
       padding: 8px;
       align-self: start;
       align-items: start;
+      word-break: break-all;
 
       &.nowrap {
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
         width: 25%;
+        position: relative;
+
+        &::before {
+          content: '&nbsp;';
+          visibility: hidden;
+        }
+
+        span {
+          position: absolute;
+          left: 8px;
+          right: 8px;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
       }
     }
   }