UX: aligns categories and tags in topic lists

UX: aligns categories and tags in topic lists

History:

Minor visual weirdness on topic listing - category and tags - ux - Discourse Meta

diff --git a/app/assets/stylesheets/common/base/_topic-list.scss b/app/assets/stylesheets/common/base/_topic-list.scss
index 067353a..d276ea0 100644
--- a/app/assets/stylesheets/common/base/_topic-list.scss
+++ b/app/assets/stylesheets/common/base/_topic-list.scss
@@ -133,10 +133,17 @@
 
   .link-bottom-line {
     font-size: $font-down-1;
-    a.badge-wrapper.box {
+    display: flex;
+    align-items: center;
+    a.badge-wrapper.box,
+    a.discourse-tag.box {
       padding-top: 0;
       padding-bottom: 0;
     }
+    .discourse-tag.simple:after,
+    .discourse-tag.box {
+      margin-right: 0.25em;
+    }
   }
 
   .topic-featured-link {
diff --git a/app/assets/stylesheets/common/base/tagging.scss b/app/assets/stylesheets/common/base/tagging.scss
index e85e138..23d3867 100644
--- a/app/assets/stylesheets/common/base/tagging.scss
+++ b/app/assets/stylesheets/common/base/tagging.scss
@@ -124,14 +124,9 @@ $tag-color: $primary-medium;
 }
 
 .topic-list-item .discourse-tags {
-  display: inline-block;
+  display: inline-flex;
   font-weight: normal;
   font-size: $font-down-1;
-
-  .discourse-tag.box {
-    position: relative;
-    top: 2px;
-  }
 }
 
 .categories-list .topic-list-latest .discourse-tags {
@@ -153,15 +148,16 @@ $tag-color: $primary-medium;
 }
 
 .discourse-tag.bullet {
-  margin-right: 0.25em;
+  margin-right: 0.5em;
+  display: inline-flex;
+  align-items: center;
   &:before {
     background: $primary-low-mid;
     margin-right: 5px;
     position: relative;
-    width: 8px;
-    height: 8px;
+    width: 9px;
+    height: 9px;
     display: inline-block;
-    vertical-align: middle;
     content: "";
   }
 }

GitHub
sha: 6fb42131

This commit has been mentioned on Discourse Meta. There might be relevant details there: