pleroma-fe

commit: 5db70a212d365550866e60d7f64b7a5b1792f236
parent: bebd5c3328422aacf65996776e282d032347c5c9
Author: lambadalambda <gitgud@rogerbraun.net>
Date:   Wed,  1 Mar 2017 11:13:46 -0500

Merge branch 'fix/remove-unread-notifications-offset' into 'develop'

Fix the very visible padding offset in unread notification caused by the border.

See merge request !35
Diffstat:
M
src/components/notifications/notifications.scss
15
++++++++++-----

1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
@@ -13,12 +13,12 @@
     }
   }
 
-  .unseen {
-    border-left: 4px solid rgba(255, 48, 16, 0.65);
-  }
-
   .notification {
-    padding: 0.4em 0 0 0.7em;
+    // Will have to use pixels here to ensure consistent distance with
+    // pad alone and pad + border, browsers bad at rounding this with em,
+    // they love to give a 1 pixel ghost offset with 0.7em vs 0.3em + 0.4em,
+    // which does not happen with 10px vs 4px + 6px.
+    padding: 0.4em 0 0 10px;
     display: flex;
     border-bottom: 1px solid silver;
 
@@ -62,4 +62,9 @@
       border: none
     }
   }
+
+  .unseen {
+    border-left: 4px solid rgba(255, 48, 16, 0.65);
+    padding-left: 6px;
+  }
 }