Query Browser: Align controls with left & right edges of graph & table

Aligns the metrics dropdown on the left and aligns the "Run Queries" button on the right.
christianaranda · Jul 21, 2019 · f24df11 · f24df11
1 parent f7d7d45
commit f24df11
Show file tree

Hide file tree

Showing 2 changed files with 1 addition and 6 deletions.
diff --git a/frontend/public/components/monitoring/_monitoring.scss b/frontend/public/components/monitoring/_monitoring.scss
@@ -30,12 +30,7 @@
  flex-wrap: wrap-reverse;
  justify-content: space-between;
  margin-bottom: 15px;
- padding: 0 20px;
  width: 100%;
-
- &--graph {
- padding: 0;
- }
 }
 
 .query-browser__controls--left {

diff --git a/frontend/public/components/monitoring/query-browser.tsx b/frontend/public/components/monitoring/query-browser.tsx
@@ -224,7 +224,7 @@ const QueryBrowser_: React.FC<QueryBrowserProps> = ({
  }
 
  return <div className={classNames('query-browser__wrapper', {'graph-empty-state': _.isEmpty(graphData)})}>
- <div className="query-browser__controls query-browser__controls--graph">
+ <div className="query-browser__controls">
  <div className="query-browser__controls--left">
  <SpanControls defaultSpanText={defaultSpanText} onChange={onSpanChange} span={span} />
  {updating && <div className="query-browser__loading">