diff --git a/src/plugins/kibana/public/discover/styles/main.less b/src/plugins/kibana/public/discover/styles/main.less index 5e504044550702..25dba9ba3beee6 100644 --- a/src/plugins/kibana/public/discover/styles/main.less +++ b/src/plugins/kibana/public/discover/styles/main.less @@ -8,6 +8,7 @@ &-wrapper { padding-right: 0px !important; + padding-left: @collapser-width; } &-content { diff --git a/src/plugins/kibana/public/visualize/editor/styles/_editor.less b/src/plugins/kibana/public/visualize/editor/styles/_editor.less index fa44896cbada2d..d7a988196a33a5 100644 --- a/src/plugins/kibana/public/visualize/editor/styles/_editor.less +++ b/src/plugins/kibana/public/visualize/editor/styles/_editor.less @@ -89,7 +89,6 @@ .sidebar-container { .flex-parent(1, 1, auto); background-color: @vis-editor-sidebar-bg; - border-right-color: @vis-editor-sidebar-border; form { .flex-parent(1, 1, auto); @@ -332,6 +331,7 @@ display: flex; flex-direction: column; overflow: auto; + padding-left: @collapser-width; &.embedded { flex-shrink: 1; diff --git a/src/ui/public/collapsible_sidebar/collapsible_sidebar.less b/src/ui/public/collapsible_sidebar/collapsible_sidebar.less index 537b906b89d3d6..9c3a46f92e5287 100644 --- a/src/ui/public/collapsible_sidebar/collapsible_sidebar.less +++ b/src/ui/public/collapsible_sidebar/collapsible_sidebar.less @@ -6,37 +6,28 @@ .sidebar-collapser { background-color: @collapser-bg; - height: 28px; + height: 100%; position: absolute; top: 0; - right: -20px; - width: 20px; - border: 1px solid; - border-color: @collapser-border; - border-width: 0 1px 1px 0; + right: -(@collapser-width); + width: @collapser-width; cursor: pointer; z-index: -1; - border-bottom-right-radius: 4px; &:hover { background-color: @collapser-hover-bg; - - .chevron-cont{ - - &:before { - color: @collapser-hover-color; - } - } + border-color: @collapser-hover-bg; + color: @collapser-hover-color; } .chevron-cont{ position: absolute; - left: 4px; - top: 5px; + left: 2px; + top: 8px; + font-size: 10px; &:before { font-family: FontAwesome; - color: @collapser-color; content: "\F053"; } } diff --git a/src/ui/public/styles/sidebar.less b/src/ui/public/styles/sidebar.less index 40f81c86917235..fc938f0eb2f21e 100644 --- a/src/ui/public/styles/sidebar.less +++ b/src/ui/public/styles/sidebar.less @@ -5,9 +5,7 @@ padding-left: 0px !important; padding-right: 0px !important; background-color: @sidebar-bg; - border-right: 1px solid; border-right-color: @sidebar-border; - border-bottom: 1px solid; border-bottom-color: @sidebar-border; .sidebar-well { diff --git a/src/ui/public/styles/variables/for-theme.less b/src/ui/public/styles/variables/for-theme.less index e8b58f76097eaf..3e80305fd3daec 100644 --- a/src/ui/public/styles/variables/for-theme.less +++ b/src/ui/public/styles/variables/for-theme.less @@ -65,12 +65,15 @@ // Collapser =================================================================== -@collapser-bg: @white; -@collapser-border: @gray-lighter; +@collapser-bg: @gray-lighter; +@collapser-border: @collapser-bg; @collapser-color: @gray3; -@collapser-hover-bg: @gray-lighter; -@collapser-hover-color: @gray3; +@collapser-hover-bg: @gray-light; +@collapser-hover-border: @collapser-hover-bg; +@collapser-hover-color: @white; + +@collapser-width: 12px; // Dashboard ===================================================================