category badge alignment fix

category badge alignment fix
From c84b837d50fd33cf3166d9e7cda6fb1e84fbf191 Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Sat, 8 Dec 2018 22:33:11 -0500
Subject: [PATCH] category badge alignment fix


diff --git a/app/assets/stylesheets/common/base/header.scss b/app/assets/stylesheets/common/base/header.scss
index 732f06d..1a7708a 100644
--- a/app/assets/stylesheets/common/base/header.scss
+++ b/app/assets/stylesheets/common/base/header.scss
@@ -9,6 +9,7 @@
   box-shadow: shadow("header");
 
   > .wrap {
+    box-sizing: border-box;
     width: 100%;
     height: 100%;
     .contents {
@@ -257,6 +258,9 @@
   }
   .badge-wrapper {
     margin-right: 8px;
+    &.bullet {
+      padding-top: 1px; // alignment hack
+    }
   }
   .badge-wrapper.bullet {
     .badge-category-parent-bg,

GitHub

I don’t like this fix, but it’s simple and works in all browsers.

I want to spend some time in the near future normalizing how categories + tags are structured in HTML (docked header vs undocked title), because there are some variations that make alignment across category styles and browsers very annoying.

2 Likes