From 35e68b868e2e212158d453dba0844cdc206e8e81 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Fri, 5 Apr 2019 11:34:24 +0200
Subject: [PATCH] Fix: align panel padding between sass & js theme (#16404)

---
 .../__snapshots__/ThresholdsEditor.test.tsx.snap          | 8 ++++----
 packages/grafana-ui/src/themes/_variables.scss.tmpl.ts    | 4 +++-
 packages/grafana-ui/src/themes/default.ts                 | 4 ++--
 public/sass/_variables.generated.scss                     | 2 +-
 4 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap b/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap
index bcdf81ed134..c2feb5f35e7 100644
--- a/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap
+++ b/packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap
@@ -178,8 +178,8 @@ exports[`Render should render with base threshold 1`] = `
                             },
                             "name": "Grafana Dark",
                             "panelPadding": Object {
-                              "horizontal": 10,
-                              "vertical": 5,
+                              "horizontal": 16,
+                              "vertical": 8,
                             },
                             "spacing": Object {
                               "d": "14px",
@@ -336,8 +336,8 @@ exports[`Render should render with base threshold 1`] = `
                                   },
                                   "name": "Grafana Dark",
                                   "panelPadding": Object {
-                                    "horizontal": 10,
-                                    "vertical": 5,
+                                    "horizontal": 16,
+                                    "vertical": 8,
                                   },
                                   "spacing": Object {
                                     "d": "14px",
diff --git a/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts b/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts
index 2d6903956a2..97486cf3f4c 100644
--- a/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts
+++ b/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts
@@ -190,7 +190,9 @@ $side-menu-width: 60px;
 
 // dashboard
 $dashboard-padding: $space-md;
-$panel-padding: 0 $space-md $space-sm $space-md;
+$panel-padding: 0 ${theme.panelPadding.horizontal}px ${theme.panelPadding.vertical}px ${
+    theme.panelPadding.horizontal
+  }px;
 
 // tabs
 $tabs-padding: 10px 15px 9px;
diff --git a/packages/grafana-ui/src/themes/default.ts b/packages/grafana-ui/src/themes/default.ts
index c3294d33285..3cdb5f45c85 100644
--- a/packages/grafana-ui/src/themes/default.ts
+++ b/packages/grafana-ui/src/themes/default.ts
@@ -68,8 +68,8 @@ const theme: GrafanaThemeCommons = {
     },
   },
   panelPadding: {
-    horizontal: 10,
-    vertical: 5,
+    horizontal: 16,
+    vertical: 8,
   },
   zIndex: {
     dropdown: '1000',
diff --git a/public/sass/_variables.generated.scss b/public/sass/_variables.generated.scss
index 2c624b60a20..952d2599bfc 100644
--- a/public/sass/_variables.generated.scss
+++ b/public/sass/_variables.generated.scss
@@ -193,7 +193,7 @@ $side-menu-width: 60px;
 
 // dashboard
 $dashboard-padding: $space-md;
-$panel-padding: 0 $space-md $space-sm $space-md;
+$panel-padding: 0 16px 8px 16px;
 
 // tabs
 $tabs-padding: 10px 15px 9px;