From 2de7c4a598705adbd5a6f767561a062b4ae66ac5 Mon Sep 17 00:00:00 2001 From: CJ Cenizal Date: Fri, 24 Jun 2016 15:53:33 -0700 Subject: [PATCH 1/4] [7364]: Deconcatenate selectors and reduce specificity in src/ui/public/vislib/styles/_alerts.less. Former-commit-id: dc1539fcfbf2a79973ff0f79e1db318809e03eb5 --- src/ui/public/vislib/styles/_alerts.less | 53 +++++++++++++----------- 1 file changed, 28 insertions(+), 25 deletions(-) diff --git a/src/ui/public/vislib/styles/_alerts.less b/src/ui/public/vislib/styles/_alerts.less index d8d143aceb308..079f8193daa21 100644 --- a/src/ui/public/vislib/styles/_alerts.less +++ b/src/ui/public/vislib/styles/_alerts.less @@ -2,8 +2,9 @@ .vis-alerts { position: relative; +} - &-tray { + .vis-alerts-tray { position: absolute; bottom: 5px; left: 0px; @@ -16,6 +17,19 @@ transition-duration: 50ms; } + .vis-alerts-icon { + margin: 0; + padding: 0 10px; + flex: 0 0 auto; + align-self: center; + } + + .vis-alerts-text { + flex: 1 1 auto; + margin: 0; + padding: 0; + } + .vis-alert { margin: 0 10px 10px; padding: 5px 10px 5px 5px; @@ -24,31 +38,20 @@ border: 1px solid; border-color: @alert-vis-alert-border; display: flex; + } - &-success { - .alert-variant(fade(@alert-success-bg, 75%); @alert-success-border; @alert-success-text); - } - &-info { - .alert-variant(fade(@alert-info-bg, 75%); @alert-info-border; @alert-info-text); - } - &-warning { - .alert-variant(fade(@alert-warning-bg, 75%); @alert-warning-border; @alert-warning-text); - } - &-danger { - .alert-variant(fade(@alert-danger-bg, 75%); @alert-danger-border; @alert-danger-text); - } - } - - &-icon { - margin: 0; - padding: 0 10px; - flex: 0 0 auto; - align-self: center; + .vis-alert-success { + .alert-variant(fade(@alert-success-bg, 75%); @alert-success-border; @alert-success-text); } - &-text { - flex: 1 1 auto; - margin: 0; - padding: 0; + .vis-alert-info { + .alert-variant(fade(@alert-info-bg, 75%); @alert-info-border; @alert-info-text); + } + + .vis-alert-warning { + .alert-variant(fade(@alert-warning-bg, 75%); @alert-warning-border; @alert-warning-text); + } + + .vis-alert-danger { + .alert-variant(fade(@alert-danger-bg, 75%); @alert-danger-border; @alert-danger-text); } -} From 779ad814b478f64f3c0f7fbea46dc2d1f8ccf5dd Mon Sep 17 00:00:00 2001 From: CJ Cenizal Date: Fri, 24 Jun 2016 16:00:00 -0700 Subject: [PATCH 2/4] [7364]: Deconcatenate selectors in src/ui/public/vislib/styles/_legend.less. Former-commit-id: de802124c4067d0244a5db34e991a5fcb81faf0d --- src/ui/public/styles/dark-theme.less | 30 +++++++++++------------- src/ui/public/vislib/styles/_legend.less | 20 ++++++++-------- 2 files changed, 24 insertions(+), 26 deletions(-) diff --git a/src/ui/public/styles/dark-theme.less b/src/ui/public/styles/dark-theme.less index 93bfded83a4c8..8c7058d5af877 100644 --- a/src/ui/public/styles/dark-theme.less +++ b/src/ui/public/styles/dark-theme.less @@ -330,28 +330,26 @@ } - .legend-value { - &-title { - padding: 3px; + .legend-value-title { + padding: 3px; - &:hover { - background-color: @sidebar-hover-bg; - } + &:hover { + background-color: @sidebar-hover-bg; } + } - &-full { - background-color: @gray3; - } + .legend-value-full { + background-color: @gray3; + } - &-details { - border-bottom: 1px solid @sidebar-bg; + .legend-value-details { + border-bottom: 1px solid @sidebar-bg; - .filter-button { - background-color: @sidebar-bg; + .filter-button { + background-color: @sidebar-bg; - &:hover { - background-color: @sidebar-hover-bg; - } + &:hover { + background-color: @sidebar-hover-bg; } } } diff --git a/src/ui/public/vislib/styles/_legend.less b/src/ui/public/vislib/styles/_legend.less index ddd2ae39d7785..ef7ffca15bbf6 100644 --- a/src/ui/public/vislib/styles/_legend.less +++ b/src/ui/public/vislib/styles/_legend.less @@ -62,7 +62,12 @@ visualize-legend { } .legend-value { - &-title { + &:hover { + cursor: pointer; + } +} + + .legend-value-title { padding: 3px; &:hover { @@ -70,19 +75,19 @@ visualize-legend { } } - &-truncate { + .legend-value-truncate { overflow-x: hidden; white-space: nowrap; text-overflow: ellipsis; } - &-full { + .legend-value-full { white-space: normal; word-break: break-all; background-color: @sidebar-hover-bg; } - &-details { + .legend-value-details { border-bottom: 1px solid @sidebar-bg; .filter-button { @@ -98,7 +103,7 @@ visualize-legend { } } - &-color-picker { + .legend-value-color-picker { width: 130px; margin: auto; @@ -113,8 +118,3 @@ visualize-legend { font-size: 18px } } -} - -.legend-value:hover { - cursor: pointer; -} From 640ee7e41cc3296355996fab26a6f06496a3fae6 Mon Sep 17 00:00:00 2001 From: CJ Cenizal Date: Fri, 24 Jun 2016 16:03:57 -0700 Subject: [PATCH 3/4] [7364]: Deconcatenate selectors in src/ui/public/vislib/styles/_tooltip.less. Former-commit-id: 32849f5cfb9ec250606c39bda8c7e6a752ab49cd --- src/ui/public/vislib/styles/_tooltip.less | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/ui/public/vislib/styles/_tooltip.less b/src/ui/public/vislib/styles/_tooltip.less index bf6dd074d90ea..e3a6045cd38a2 100644 --- a/src/ui/public/vislib/styles/_tooltip.less +++ b/src/ui/public/vislib/styles/_tooltip.less @@ -57,20 +57,20 @@ margin-bottom: 0; } - &-icon { + + * { + margin-top: @tooltip-space; + } +} + + .vis-tooltip-header-icon { flex: 0 0 auto; padding-right: @tooltip-space; } - &-text { + .vis-tooltip-header-text { flex: 1 1 200px; } - + * { - margin-top: @tooltip-space; - } -} - .vis-tooltip-sizing-clone { visibility: hidden; position: fixed; From 3bb03953f5b0c6aad35fb60906882e9507677e23 Mon Sep 17 00:00:00 2001 From: CJ Cenizal Date: Fri, 24 Jun 2016 16:09:42 -0700 Subject: [PATCH 4/4] [7364]: Deconcatenate selectors and reduce specificity in src/ui/public/visualize/visualize.less. Former-commit-id: 6c7ed370107cac54d1dab1fb01cafa5aabb5315d --- src/ui/public/styles/dark-theme.less | 20 ++-- src/ui/public/visualize/visualize.less | 123 +++++++++++++------------ 2 files changed, 72 insertions(+), 71 deletions(-) diff --git a/src/ui/public/styles/dark-theme.less b/src/ui/public/styles/dark-theme.less index 8c7058d5af877..b70f3286f4830 100644 --- a/src/ui/public/styles/dark-theme.less +++ b/src/ui/public/styles/dark-theme.less @@ -283,18 +283,16 @@ // /src/ui/public/visualize/visualize.less - visualize-spy { - .visualize-show-spy { - border-top-color: @visualize-show-spy-border; + .visualize-show-spy { + border-top-color: @visualize-show-spy-border; + } - } - .visualize-spy-container { - pre { - border-color: @visualize-show-spy-border; - color: @visualize-spy-container-pre-color; - opacity: 1; - background-color: @visualize-spy-container-pre-bg; - } + .visualize-spy-container { + pre { + border-color: @visualize-show-spy-border; + color: @visualize-spy-container-pre-color; + opacity: 1; + background-color: @visualize-spy-container-pre-bg; } } diff --git a/src/ui/public/visualize/visualize.less b/src/ui/public/visualize/visualize.less index e1e7805e3d08c..bdfc319ffe5ab 100644 --- a/src/ui/public/visualize/visualize.less +++ b/src/ui/public/visualize/visualize.less @@ -75,87 +75,90 @@ visualize-spy { padding-top: 0px; } - .visualize-show-spy { - flex: 0 0 auto; - &-tab { - color: @kibanaGray4; - position: absolute; - z-index: 100; - left: 5px; - bottom: 0px; - } - } - .visualize-spy-fill { margin-right: 5px; } - .visualize-spy-container { - flex: 1 1 auto; - - display: flex; - flex-direction: column; + &.only { + .visualize-spy-container { + height: auto; + } + } - height: 482px; - overflow-y: auto; + pre { + word-break: break-all; + word-wrap: break-word; + white-space: pre-wrap; + } +} - header { - padding: 0 0 15px; - } +.visualize-spy-container { + flex: 1 1 auto; - header + * { - flex: 1 1 auto; - } + display: flex; + flex-direction: column; - > .alert { - flex: 0 0 auto; - } + height: 482px; + overflow-y: auto; - tr > td { - font-size: 0.85em; - } + header { + padding: 0 0 15px; } - &.only .visualize-spy-container { - height: auto; + header + * { + flex: 1 1 auto; } - .visualize-spy-nav { + > .alert { flex: 0 0 auto; + } - a.btn { - margin: @padding-small-vertical @padding-small-vertical; - } + tr > td { + font-size: 0.85em; } +} - .visualize-spy-content { - position: relative; +.visualize-spy-nav { + flex: 0 0 auto; - .visualize-spy-loading { - position: absolute; - top: 0px; - left: 0px; - right: 0px; - text-align: center; + a.btn { + margin: @padding-small-vertical @padding-small-vertical; + } +} - &-text { - display: inline-block; - margin: 0; - background: @alert-info-bg; - color: @alert-info-text; - padding: 5px 10px; - border-radius: @border-radius-base; +.visualize-spy-content { + position: relative; +} + + .visualize-spy-loading { + position: absolute; + top: 0px; + left: 0px; + right: 0px; + text-align: center; + } - .spinner > * { - background-color: @alert-info-text; - } + .visualize-spy-loading-text { + display: inline-block; + margin: 0; + background: @alert-info-bg; + color: @alert-info-text; + padding: 5px 10px; + border-radius: @border-radius-base; + + .spinner > * { + background-color: @alert-info-text; } } - } - pre { - word-break: break-all; - word-wrap: break-word; - white-space: pre-wrap; - } +.visualize-show-spy { + flex: 0 0 auto; } + + .visualize-show-spy-tab { + color: @kibanaGray4; + position: absolute; + z-index: 100; + left: 5px; + bottom: 0px; + }