Merge pull request #21376 from overleaf/jel-spacing-gallery

[web] Fix spacing between sections, columns, and rows on gallery redesign

GitOrigin-RevId: 3c787baa7300c0f39705f71f8821f8da69a837a5

services/web/frontend/stylesheets/bootstrap-5/components/gallery-search.scss

@@ -1,4 +1,6 @@
 .gallery-search {
+  margin-bottom: var(--spacing-16);
+
   form {
     display: flex;
     justify-content: center;

services/web/frontend/stylesheets/bootstrap-5/pages/templates-v2.scss

@@ -127,9 +127,14 @@
     overflow: hidden;
   }
 
+  .popular-tags-list,
   .gallery-container {
-    --bs-gutter-y: var(--spacing-09);
+    --bs-gutter-x: var(--spacing-09);
 
+    row-gap: var(--spacing-11);
+  }
+
+  .gallery-container {
     align-items: baseline;
   }
 
@@ -224,20 +229,20 @@
   }
 
   .popular-tags {
-    margin-top: var(--spacing-16);
+    margin-top: 0;
     margin-bottom: var(--spacing-16);
 
     a {
       width: 100%;
     }
+  }
 
+  .popular-tags,
+  .recent-docs,
+  .featured-docs {
     h2 {
       margin-bottom: var(--spacing-09);
     }
-
-    .popular-tags-list {
-      row-gap: var(--spacing-11);
-    }
   }
 
   .recent-docs + .featured-docs {