From 78ebac0116c0aebd99d261c3f138819dc957bece Mon Sep 17 00:00:00 2001
From: kay delaney <45561153+kaydelaney@users.noreply.github.com>
Date: Mon, 11 Oct 2021 10:46:21 +0100
Subject: [PATCH] Chore/Nit: Fix minor alignment issue in panel editor (#40232)
---
.../components/PanelEditor/OptionsPaneOptions.tsx | 1 +
.../dashboard/components/PanelEditor/PanelEditor.tsx | 1 -
.../dashboard/components/PanelEditor/PanelEditorTabs.tsx | 7 +++++--
3 files changed, 6 insertions(+), 3 deletions(-)
diff --git a/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx b/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
index 6efd8451e70..5d56dbbaa7e 100644
--- a/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
@@ -173,6 +173,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
padding: ${theme.spacing(1)};
background: ${theme.colors.background.primary};
border: 1px solid ${theme.components.panel.borderColor};
+ border-top-left-radius: ${theme.shape.borderRadius(1.5)};
border-bottom: none;
`,
closeButton: css`
diff --git a/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx b/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
index 85d3d2dcba5..34f545a0eb5 100644
--- a/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx
@@ -507,7 +507,6 @@ export const getStyles = stylesFactory((theme: GrafanaTheme, props: Props) => {
min-height: 0;
width: 100%;
padding-left: ${paneSpacing};
- padding-right: 2px;
`,
tabsWrapper: css`
height: 100%;
diff --git a/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx b/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx
index 76fd4ccdd6c..bc6a30ac454 100644
--- a/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/PanelEditorTabs.tsx
@@ -38,7 +38,7 @@ export const PanelEditorTabs: FC<PanelEditorTabsProps> = React.memo(({ panel, da
return (
<div className={styles.wrapper}>
- <TabsBar className={styles.tabBar}>
+ <TabsBar className={styles.tabBar} hideBorder>
{tabs.map((tab) => {
if (config.unifiedAlertingEnabled && tab.id === PanelEditorTabId.Alert) {
return (
@@ -107,7 +107,10 @@ const getStyles = (theme: GrafanaTheme2) => {
flex-grow: 1;
min-height: 0;
background: ${theme.colors.background.primary};
- border-right: 1px solid ${theme.components.panel.borderColor};
+ border: 1px solid ${theme.components.panel.borderColor};
+ border-left: none;
+ border-bottom: none;
+ border-top-right-radius: ${theme.shape.borderRadius(1.5)};
`,
};
};