diff --git a/ui/src/dashboards/components/OverlayControls.js b/ui/src/dashboards/components/OverlayControls.js
index e30ff1fbf2..4915f1893f 100644
--- a/ui/src/dashboards/components/OverlayControls.js
+++ b/ui/src/dashboards/components/OverlayControls.js
@@ -12,11 +12,11 @@ const OverlayControls = props => {
Cell Editor
Visualization Type:
-
+
{graphTypes.map(graphType => (
- onSelectGraphType(graphType.type)}
diff --git a/ui/src/style/pages/overlay-technology.scss b/ui/src/style/pages/overlay-technology.scss
index 0211c9a7eb..d403ac49e5 100644
--- a/ui/src/style/pages/overlay-technology.scss
+++ b/ui/src/style/pages/overlay-technology.scss
@@ -54,13 +54,16 @@ $overlay-z: 100;
margin: 0 0 0 5px;
}
p {
+ width: auto;
font-weight: 600;
color: $g13-mist;
- margin: 0;
+ margin: 0 6px 0 0;
@include no-user-select;
+ white-space: nowrap;
}
}
.overlay--graph-name {
+ width: auto;
margin: 0;
font-size: 17px;
font-weight: 400;
@@ -78,28 +81,6 @@ $overlay-z: 100;
.overlay-controls .confirm-buttons {
margin-left: 32px;
}
-.overlay-controls .confirm-buttons .btn {
- height: 30px;
- line-height: 30px;
- padding: 0 9px;
-
- & > span.icon {
- font-size: 16px;
- }
-}
-.overlay-controls .toggle {
-
- .toggle-btn {
- background-color: $overlay-controls-bg;
-
- &:hover {
- background-color: $g4-onyx;
- }
- &.active {
- background-color: $g5-pepper;
- }
- }
-}
/* Graph editing in Dashboards is a little smaller so the dash can be seen in the background */
.overlay-technology .graph {