diff --git a/app/static/app/js/components/LayersControlAnnotations.jsx b/app/static/app/js/components/LayersControlAnnotations.jsx
index f49f275e7..f380fc0ac 100644
--- a/app/static/app/js/components/LayersControlAnnotations.jsx
+++ b/app/static/app/js/components/LayersControlAnnotations.jsx
@@ -69,7 +69,8 @@ class AnnotationLayer extends React.Component{
return (
{this.state.expanded ?
diff --git a/app/static/app/js/components/Toggle.jsx b/app/static/app/js/components/Toggle.jsx
index 0dc493ee4..a4ce5baa6 100644
--- a/app/static/app/js/components/Toggle.jsx
+++ b/app/static/app/js/components/Toggle.jsx
@@ -4,6 +4,7 @@ import '../css/Toggle.scss';
class Toggle extends React.Component {
static defaultProps = {
+ className: ""
};
static propTypes = {
bind: PropTypes.array.isRequired, // two element array,
@@ -11,7 +12,8 @@ class Toggle extends React.Component {
// and the second the boolean property to determine visibility
// ex. [this, 'visible']
trueIcon: PropTypes.string,
- falseIcon: PropTypes.string
+ falseIcon: PropTypes.string,
+ className: PropTypes.string,
}
constructor(props){
@@ -26,7 +28,7 @@ class Toggle extends React.Component {
render(){
const [parent, prop] = this.props.bind;
const icon = parent.state[prop] ? this.props.trueIcon: this.props.falseIcon;
- return (
);
+ return (
);
}
}
diff --git a/app/static/app/js/css/LayersControlAnnotations.scss b/app/static/app/js/css/LayersControlAnnotations.scss
index 4269216ab..eec3724f8 100644
--- a/app/static/app/js/css/LayersControlAnnotations.scss
+++ b/app/static/app/js/css/LayersControlAnnotations.scss
@@ -1,3 +1,7 @@
+.annotation-toggle{
+ margin-left: 3px;
+}
+
.layers-control-annotations{
.layer-control-title{
align-items: baseline;
@@ -5,10 +9,10 @@
}
.layer-label{
- margin-right: 12px;
padding-left: 6px;
}
+
.annotation-name{
display: inline;
position: relative;
diff --git a/app/static/app/js/css/LayersControlLayer.scss b/app/static/app/js/css/LayersControlLayer.scss
index d5409e29e..f9f59f432 100644
--- a/app/static/app/js/css/LayersControlLayer.scss
+++ b/app/static/app/js/css/LayersControlLayer.scss
@@ -12,6 +12,13 @@
overflow: hidden;
text-align: left;
height: 28px;
+ margin-left: 1px;
+ }
+
+ .layer-action{
+ flex-basis: min-content;
+ padding-left: 6px;
+ padding-right: 6px;
}
select, input{