From e1c340f4bcffe8b6b398c6c57f3e31b7efd7826e Mon Sep 17 00:00:00 2001
From: Zaid Abdulla <zaid@genieacs.com>
Date: Fri, 19 Oct 2018 19:29:31 -0700
Subject: [PATCH] Fix style issues for long-text elements

---
 client/css/app.css | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/client/css/app.css b/client/css/app.css
index 1215e27..a877a64 100644
--- a/client/css/app.css
+++ b/client/css/app.css
@@ -41,6 +41,10 @@ a {
     color: white;
     background-color: var(--color4);
   }
+  /* text-decoration does not propagate to inline-block children */
+  & span {
+    text-decoration: inherit;
+  }
 }
 
 strong,
@@ -648,10 +652,15 @@ span.tag {
 
 span.long-text {
   display: inline-block;
-  overflow: hidden;
+  overflow-x: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 400px;
+  /*
+  "overflow: hidden" changes the baseline as explained here:
+  https://stackoverflow.com/questions/9273016/why-is-this-inline-block-element-pushed-downward
+  */
+  vertical-align: top;
 }
 
 span.long-text-overflowed {