From aef9f39aca1be4d381dbf55e59c904a2c6a902d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B8rn=20Forsberg?= <bjorn@forsbergplustwo.com>
Date: Mon, 18 Dec 2023 16:02:42 +0100
Subject: [PATCH] Adjust spacing on NavigationList component (#347)

---
 app/assets/stylesheets/polaris_view_components.pcss |  1 +
 .../navigation_list_component.pcss                  | 13 +++++++++++++
 .../polaris/navigation_list_component.html.erb      | 10 ++++++----
 3 files changed, 20 insertions(+), 4 deletions(-)
 create mode 100644 app/assets/stylesheets/polaris_view_components/navigation_list_component.pcss

diff --git a/app/assets/stylesheets/polaris_view_components.pcss b/app/assets/stylesheets/polaris_view_components.pcss
index 9731da14..9260ffc6 100644
--- a/app/assets/stylesheets/polaris_view_components.pcss
+++ b/app/assets/stylesheets/polaris_view_components.pcss
@@ -2,4 +2,5 @@
 @import "./polaris_view_components/shopify_navigation.pcss";
 @import "./polaris_view_components/spacer_component.pcss";
 @import "./polaris_view_components/tooltip_component.pcss";
+@import "./polaris_view_components/navigation_list_component.pcss";
 @import "./polaris_view_components/custom.pcss";
diff --git a/app/assets/stylesheets/polaris_view_components/navigation_list_component.pcss b/app/assets/stylesheets/polaris_view_components/navigation_list_component.pcss
new file mode 100644
index 00000000..1234b6b6
--- /dev/null
+++ b/app/assets/stylesheets/polaris_view_components/navigation_list_component.pcss
@@ -0,0 +1,13 @@
+.NavigationList {
+  padding-top: var(--p-space-3);
+  padding-bottom: var(--p-space-3);
+
+  ul {
+    margin: 0;
+  }
+
+  .Polaris-Navigation__Item {
+    padding-bottom: var(--p-space-1);
+    padding-top: var(--p-space-1);
+  }
+}
diff --git a/app/components/polaris/navigation_list_component.html.erb b/app/components/polaris/navigation_list_component.html.erb
index 295a9c93..320aabae 100644
--- a/app/components/polaris/navigation_list_component.html.erb
+++ b/app/components/polaris/navigation_list_component.html.erb
@@ -1,5 +1,7 @@
-<%= polaris_card(sectioned: false, style: "padding-top: 1em; padding-bottom: 1em;") do |card| %>
-  <% items.each do |item| %>
-    <%= item %>
-  <% end %>
+<%= polaris_card(sectioned: false, classes: "NavigationList") do |card| %>
+  <ul>
+    <% items.each do |item| %>
+      <%= item %>
+    <% end %>
+  </ul>
 <% end %>