From 0bd1ae99dfde41b5c9f1e953ad77952e637a9e25 Mon Sep 17 00:00:00 2001
From: Laura Benz <48948963+L-M-K-B@users.noreply.github.com>
Date: Thu, 9 Mar 2023 09:24:45 +0100
Subject: [PATCH] Laura/standardise border radius in explore (#64338)

* refactor: remove border radius in ExploreGraph

* refactor: remove border radius in NoData

* refactor: remove border radius in TracePageSearchBar

* refactor: replace border radius in TracePageSearchBar and TraceViewContainer
---
 public/app/features/explore/Graph/ExploreGraph.tsx          | 6 ++----
 public/app/features/explore/NoData.tsx                      | 2 +-
 .../app/features/explore/TraceView/TraceViewContainer.tsx   | 2 +-
 .../components/TracePageHeader/TracePageSearchBar.tsx       | 2 +-
 4 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/public/app/features/explore/Graph/ExploreGraph.tsx b/public/app/features/explore/Graph/ExploreGraph.tsx
index 86af63d3d4e..20fff365c49 100644
--- a/public/app/features/explore/Graph/ExploreGraph.tsx
+++ b/public/app/features/explore/Graph/ExploreGraph.tsx
@@ -1,4 +1,4 @@
-import { css, cx } from '@emotion/css';
+import { css } from '@emotion/css';
 import { identity } from 'lodash';
 import React, { useEffect, useMemo, useState } from 'react';
 
@@ -159,7 +159,7 @@ export function ExploreGraph({
   return (
     <PanelContextProvider value={panelContext}>
       {data.length > MAX_NUMBER_OF_TIME_SERIES && !showAllTimeSeries && (
-        <div className={cx([style.timeSeriesDisclaimer])}>
+        <div className={style.timeSeriesDisclaimer}>
           <Icon className={style.disclaimerIcon} name="exclamation-triangle" />
           Showing only {MAX_NUMBER_OF_TIME_SERIES} time series.
           <Button
@@ -191,9 +191,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
     label: time-series-disclaimer;
     margin: ${theme.spacing(1)} auto;
     padding: 10px 0;
-    border-radius: ${theme.spacing(2)};
     text-align: center;
-    background-color: ${theme.colors.background.primary};
   `,
   disclaimerIcon: css`
     label: disclaimer-icon;
diff --git a/public/app/features/explore/NoData.tsx b/public/app/features/explore/NoData.tsx
index a8c73dd2c2c..67d56ecfd6f 100644
--- a/public/app/features/explore/NoData.tsx
+++ b/public/app/features/explore/NoData.tsx
@@ -20,7 +20,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
     label: no-data-card;
     padding: ${theme.spacing(3)};
     background: ${theme.colors.background.primary};
-    border-radius: ${theme.shape.borderRadius(2)};
+    border-radius: ${theme.shape.borderRadius()};
     display: flex;
     flex-direction: column;
     align-items: center;
diff --git a/public/app/features/explore/TraceView/TraceViewContainer.tsx b/public/app/features/explore/TraceView/TraceViewContainer.tsx
index 78e01cd2021..e98db69fcb7 100644
--- a/public/app/features/explore/TraceView/TraceViewContainer.tsx
+++ b/public/app/features/explore/TraceView/TraceViewContainer.tsx
@@ -28,7 +28,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
     background-color: ${theme.colors.background.primary};
     border: 1px solid ${theme.colors.border.medium};
     position: relative;
-    border-radius: 3px;
+    border-radius: ${theme.shape.borderRadius()};
     width: 100%;
     display: flex;
     flex-direction: column;
diff --git a/public/app/features/explore/TraceView/components/TracePageHeader/TracePageSearchBar.tsx b/public/app/features/explore/TraceView/components/TracePageHeader/TracePageSearchBar.tsx
index 7f6c96ec4fa..93951b96bfd 100644
--- a/public/app/features/explore/TraceView/components/TracePageHeader/TracePageSearchBar.tsx
+++ b/public/app/features/explore/TraceView/components/TracePageHeader/TracePageSearchBar.tsx
@@ -38,7 +38,7 @@ export const getStyles = (theme: GrafanaTheme2) => {
       margin-bottom: -48px;
       padding: 8px;
       margin-right: 2px;
-      border-radius: 4px;
+      border-radius: ${theme.shape.borderRadius()};
       box-shadow: ${theme.shadows.z2};
     `,
     TracePageSearchBarBar: css`