IGNITE-5835 Web Console: Highlight active element in select input.
Project: http://git-wip-us.apache.org/repos/asf/ignite/repo Commit: http://git-wip-us.apache.org/repos/asf/ignite/commit/b49469f4 Tree: http://git-wip-us.apache.org/repos/asf/ignite/tree/b49469f4 Diff: http://git-wip-us.apache.org/repos/asf/ignite/diff/b49469f4 Branch: refs/heads/ignite-5757 Commit: b49469f469e3ad9f64d009a474b6e09686ec9203 Parents: 586a96e Author: Dmitriy Shabalin <[email protected]> Authored: Thu Jul 27 10:39:54 2017 +0700 Committer: Andrey Novikov <[email protected]> Committed: Thu Jul 27 10:39:54 2017 +0700 ---------------------------------------------------------------------- modules/web-console/frontend/app/app.config.js | 3 +- .../app/components/bs-select-menu/style.scss | 16 +++++ .../app/components/bs-select-menu/template.pug | 2 + .../frontend/app/primitives/dropdown/index.scss | 68 -------------------- 4 files changed, 20 insertions(+), 69 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ignite/blob/b49469f4/modules/web-console/frontend/app/app.config.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/app.config.js b/modules/web-console/frontend/app/app.config.js index b9741d1..6ba1d98 100644 --- a/modules/web-console/frontend/app/app.config.js +++ b/modules/web-console/frontend/app/app.config.js @@ -78,7 +78,8 @@ igniteConsoleCfg.config(['$selectProvider', ($selectProvider) => { noneText: 'Clear All', template: '<bs-select-menu></bs-select-menu>', iconCheckmark: 'fa fa-check', - caretHtml: '' + caretHtml: '', + animation: '' }); }]); http://git-wip-us.apache.org/repos/asf/ignite/blob/b49469f4/modules/web-console/frontend/app/components/bs-select-menu/style.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/bs-select-menu/style.scss b/modules/web-console/frontend/app/components/bs-select-menu/style.scss index faddd3c..870b1bf 100644 --- a/modules/web-console/frontend/app/components/bs-select-menu/style.scss +++ b/modules/web-console/frontend/app/components/bs-select-menu/style.scss @@ -75,4 +75,20 @@ padding-bottom: 10px; } } + + &.bssm-multiple { + .bssm-active-indicator { + display: initial; + } + } + + &:not(.bssm-multiple) { + .bssm-active-indicator { + display: none; + } + + & > li > .bssm-item-button__active { + background-color: #eeeeee; + } + } } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/b49469f4/modules/web-console/frontend/app/components/bs-select-menu/template.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/bs-select-menu/template.pug b/modules/web-console/frontend/app/components/bs-select-menu/template.pug index 91f3d8e..a9c1c28 100644 --- a/modules/web-console/frontend/app/components/bs-select-menu/template.pug +++ b/modules/web-console/frontend/app/components/bs-select-menu/template.pug @@ -17,6 +17,7 @@ ul.bs-select-menu( tabindex='-1' ng-show='$isVisible()' + ng-class=`{ 'bssm-multiple': $isMultiple }` role='select' ) li(ng-if='$showAllNoneButtons || ($isMultiple && $matches.length > 2)') @@ -37,6 +38,7 @@ ul.bs-select-menu( role='menuitem' tabindex='-1' ng-click='$select($index, $event)' + ng-class=`{ 'bssm-item-button__active': $isActive($index) }` data-placement='right auto' title='{{ ::match.label }}' ) http://git-wip-us.apache.org/repos/asf/ignite/blob/b49469f4/modules/web-console/frontend/app/primitives/dropdown/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/dropdown/index.scss b/modules/web-console/frontend/app/primitives/dropdown/index.scss index 47a7e90..4695d21 100644 --- a/modules/web-console/frontend/app/primitives/dropdown/index.scss +++ b/modules/web-console/frontend/app/primitives/dropdown/index.scss @@ -53,74 +53,6 @@ border-bottom: 1px solid $table-border-color; } } - - ul.select.dropdown-menu { - li { - hr { - display: none; - } - - a { - &:before { - content: ''; - - position: relative; - top: 1px; - left: -3px; - - display: inline-block; - width: 12px; - height: 12px; - - margin-left: 0; - margin-right: 7px; - - border: 1px solid #afafaf; - border-radius: 2px; - background-color: #FFF; - - box-shadow: inset 0 1px 1px $input-border; - } - - &.active { - color: $text-color; - } - - &.active:before { - border-color: $brand-info; - background-color: $brand-info; - - box-shadow: none; - } - - & > i { - position: relative; - top: -2px; - left: -18px; - - float: none; - - width: 0; - margin: 0; - - background: none; - - &.fa-check:before { - content: ''; - - display: block; - width: 4px; - height: 8px; - - border: solid #FFF; - border-width: 0 2px 2px 0; - - transform: rotate(35deg); - } - } - } - } - } } .dropdown--ignite {
