diff --git a/.stylelintrc.yml b/.stylelintrc.yml
index c5ba33f96..071155eba 100644
--- a/.stylelintrc.yml
+++ b/.stylelintrc.yml
@@ -83,6 +83,7 @@ rules:
   "@stylistic/indentation":
     - 2
     - ignore:
+      - param
       - value
   "@stylistic/media-feature-parentheses-space-inside": never
   "@stylistic/no-eol-whitespace": true
diff --git a/app/assets/stylesheets/dashboard/polls.scss b/app/assets/stylesheets/dashboard/polls.scss
index 2256e7d84..399bd3a73 100644
--- a/app/assets/stylesheets/dashboard/polls.scss
+++ b/app/assets/stylesheets/dashboard/polls.scss
@@ -1,7 +1,4 @@
 .dashboard-polls {
-  display: grid;
-  gap: $line-height;
-  grid-auto-rows: 1fr;
-  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+  @include dynamic-grid;
   margin-top: $line-height;
 }
diff --git a/app/assets/stylesheets/dashboard/resources.scss b/app/assets/stylesheets/dashboard/resources.scss
index 2e037e2db..48d3da8ab 100644
--- a/app/assets/stylesheets/dashboard/resources.scss
+++ b/app/assets/stylesheets/dashboard/resources.scss
@@ -1,9 +1,6 @@
 .dashboard-resources {
   .resources {
-    display: grid;
-    gap: $line-height;
-    grid-auto-rows: 1fr;
-    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+    @include dynamic-grid;
 
     .resource-card {
       background: #d1f5eb;
diff --git a/app/assets/stylesheets/mixins/layouts.scss b/app/assets/stylesheets/mixins/layouts.scss
index 27fa294f1..a54c36fcc 100644
--- a/app/assets/stylesheets/mixins/layouts.scss
+++ b/app/assets/stylesheets/mixins/layouts.scss
@@ -32,6 +32,15 @@
   }
 }
 
+@mixin dynamic-grid($min-column-width: 15rem,
+                    $row-gap: $line-height,
+                    $column-gap: rem-calc(map-get($grid-column-gutter, medium))) {
+  display: grid;
+  gap: $row-gap $column-gap;
+  grid-auto-rows: 1fr;
+  grid-template-columns: repeat(auto-fit, minmax($min-column-width, 1fr));
+}
+
 @mixin full-width-cover($adjust-margin: true, $adjust-padding: false) {
   $global-padding: rem-calc(map-get($grid-column-gutter, medium)) * 0.5;
   bottom: 0;
diff --git a/app/assets/stylesheets/shared/recommended_index.scss b/app/assets/stylesheets/shared/recommended_index.scss
index 2c45d19b4..c8b4b7385 100644
--- a/app/assets/stylesheets/shared/recommended_index.scss
+++ b/app/assets/stylesheets/shared/recommended_index.scss
@@ -17,10 +17,10 @@
   }
 
   ul {
-    display: grid;
+    $row-gap: calc($line-height / 4);
+    @include dynamic-grid($row-gap: $row-gap);
+    @include grid-column-gutter;
     font-weight: bold;
-    grid-auto-rows: 1fr;
-    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
     list-style: none;
     margin: 0;
 
@@ -30,13 +30,9 @@
       }
     }
 
-    > li,
     + * {
       @include grid-column-gutter;
-    }
-
-    > li {
-      margin-bottom: calc($line-height / 4);
+      margin-top: $row-gap;
     }
   }