Merge pull request #2746 from matrix-org/bwindels/flairnolayout

Prevent flair pushing timeline downwards
matrix-org · Mar 5, 2019 · 96196d8 · 96196d8
2 parents 534ca0e + 624572d
commit 96196d8
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss
@@ -58,12 +58,16 @@ limitations under the License.
 .mx_EventTile .mx_SenderProfile .mx_Flair {
     opacity: 0.7;
     margin-left: 5px;
-}
-
-.mx_EventTile .mx_SenderProfile .mx_Flair img {
-    vertical-align: -2px;
-    margin-right: 2px;
-    border-radius: 8px;
+    display: inline-block;
+    vertical-align: top;
+    height: 16px;
+    overflow: hidden;
+
+    img {
+        vertical-align: -2px;
+        margin-right: 2px;
+        border-radius: 8px;
+    }
 }
 
 .mx_EventTile .mx_MessageTimestamp {

diff --git a/src/components/views/elements/Flair.js b/src/components/views/elements/Flair.js
@@ -117,7 +117,7 @@ export default class Flair extends React.Component {
 
     render() {
         if (this.state.profiles.length === 0) {
-            return <div />;
+            return <span className="mx_Flair" />;
         }
         const avatars = this.state.profiles.map((profile, index) => {
             return <FlairAvatar key={index} groupProfile={profile} />;