UX: subcategory image tweaks (#34083)

app/assets/javascripts/discourse/app/components/categories-boxes.gjs

@@ -129,12 +129,11 @@ export default class CategoriesBoxes extends Component {
                   <div class="subcategories">
                     {{#each c.subcategories as |sc|}}
                       <a class="subcategory" href={{sc.url}}>
-                        <span class="subcategory-image-placeholder">
-                          {{#if sc.uploaded_logo.url}}
+                        {{#if sc.uploaded_logo.url}}
+                          <span class="subcategory-image-placeholder">
                             <CategoryLogo @category={{sc}} />
-                          {{/if}}
-                        </span>
-
+                          </span>
+                        {{/if}}
                         {{categoryLink sc hideParent="true"}}
                       </a>
                     {{/each}}

app/assets/stylesheets/common/base/category-list.scss

@@ -256,13 +256,13 @@
   .subcategories {
     display: flex;
     flex-flow: wrap;
+    gap: var(--space-2);
 
     .subcategory {
       display: flex;
       align-items: center;
 
       @include ellipsis;
-      margin-bottom: 0.6em;
 
       .badge-category__wrapper {
         overflow: hidden;
@@ -270,8 +270,12 @@
 
       .subcategory-image-placeholder {
         display: inline-block;
-        margin-right: 0.6em;
         flex: 1 0 auto;
+
+        .category-logo.aspect-image {
+          margin-top: 0;
+          margin-right: var(--space-1);
+        }
       }
 
       .subcategory-link {