IGNITE-4467 Fixed ui for modal, select, grid. Added components: switcher, timepicker.
Project: http://git-wip-us.apache.org/repos/asf/ignite/repo Commit: http://git-wip-us.apache.org/repos/asf/ignite/commit/9e06773b Tree: http://git-wip-us.apache.org/repos/asf/ignite/tree/9e06773b Diff: http://git-wip-us.apache.org/repos/asf/ignite/diff/9e06773b Branch: refs/heads/ignite-2.1.2-exchange Commit: 9e06773bed20e15772aa51ec2c2bbb4c984e8912 Parents: bebe80e Author: Dmitriy Shabalin <[email protected]> Authored: Fri Jun 23 17:37:10 2017 +0700 Committer: Andrey Novikov <[email protected]> Committed: Fri Jun 23 17:37:10 2017 +0700 ---------------------------------------------------------------------- .../input-dialog/input-dialog.tpl.pug | 32 ++-- .../list-of-registered-users.tpl.pug | 2 +- .../helpers/jade/form/form-field-checkbox.pug | 15 +- .../frontend/app/helpers/jade/mixins.pug | 4 +- .../app/modules/agent/AgentManager.service.js | 5 +- .../app/primitives/datepicker/index.pug | 11 +- .../app/primitives/datepicker/index.scss | 34 +++- .../frontend/app/primitives/dropdown/index.scss | 98 ++++++++++- .../frontend/app/primitives/file/index.pug | 37 +++++ .../frontend/app/primitives/file/index.scss | 60 +++++++ .../app/primitives/form-field/index.scss | 76 +++++++++ .../frontend/app/primitives/grid/index.scss | 42 +++++ .../frontend/app/primitives/index.js | 7 +- .../frontend/app/primitives/modal/index.scss | 42 ++++- .../frontend/app/primitives/panel/index.scss | 1 + .../frontend/app/primitives/switcher/index.pug | 20 +++ .../frontend/app/primitives/switcher/index.scss | 80 +++++++++ .../app/primitives/timepicker/index.pug | 59 +++++++ .../app/primitives/timepicker/index.scss | 137 ++++++++++++++++ .../app/primitives/typography/index.scss | 36 ++++ .../app/primitives/ui-grid-header/index.scss | 2 +- .../app/primitives/ui-grid-settings/index.scss | 163 +++++++++++++------ .../frontend/app/primitives/ui-grid/index.scss | 159 +++++++++++++++--- .../frontend/public/images/icons/filter.svg | 1 + .../frontend/public/images/icons/index.js | 2 + .../frontend/public/images/icons/search.svg | 1 + .../frontend/public/stylesheets/style.scss | 24 --- .../views/templates/agent-download.tpl.pug | 23 +-- .../frontend/views/templates/confirm.tpl.pug | 17 +- 29 files changed, 1019 insertions(+), 171 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug b/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug index 95549d7..416d79b 100644 --- a/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug +++ b/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug @@ -16,24 +16,24 @@ include /app/helpers/jade/mixins -.modal(tabindex='-1' role='dialog') +.modal.modal--ignite(tabindex='-1' role='dialog') .modal-dialog - .modal-content + form.modal-content(name='ctrl.form' novalidate) .modal-header - button.close(ng-click='$hide()') × h4.modal-title i.fa.fa-clone - | {{ ctrl.title }} - form.form-horizontal.modal-body.row(name='ui.inputForm' novalidate) - div - .col-sm-2 - label.required.labelFormField {{ ctrl.label }}: - .col-sm-10 - .input-tip - +ignite-form-field-input('"input-field"', 'ctrl.value', false, 'true', 'Enter value')( - data-ignite-form-field-input-autofocus='true' - ignite-on-enter='form.$valid && ctrl.confirm()' - ) + span {{ ctrl.title }} + button.close(type='button' aria-label='Close' ng-click='$hide()') + svg(ignite-icon="cross") + + .modal-body + .row + .col-100 + +ignite-form-field-text('{{ ctrl.label }}', 'ctrl.value', '"input-field"', false, true, 'Enter value')( + data-ignite-form-field-input-autofocus='true' + ignite-on-enter='form.$valid && ctrl.confirm()' + ) + .modal-footer - button.btn.btn-default(id='copy-btn-cancel' ng-click='$hide()') Cancel - button.btn.btn-primary(id='copy-btn-confirm' ng-disabled='ui.inputForm.$invalid' ng-click='ctrl.confirm()') Confirm + button#copy-btn-cancel.btn-ignite.btn-ignite--link-success(ng-click='$hide()') Cancel + button#copy-btn-confirm.btn-ignite.btn-ignite--success(ng-disabled='ctrl.form.$invalid' ng-click='ctrl.confirm()') Confirm http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/components/list-of-registered-users/list-of-registered-users.tpl.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/list-of-registered-users/list-of-registered-users.tpl.pug b/modules/web-console/frontend/app/components/list-of-registered-users/list-of-registered-users.tpl.pug index d9e55af..85a2070 100644 --- a/modules/web-console/frontend/app/components/list-of-registered-users/list-of-registered-users.tpl.pug +++ b/modules/web-console/frontend/app/components/list-of-registered-users/list-of-registered-users.tpl.pug @@ -72,4 +72,4 @@ mixin grid-settings() | {{ $ctrl.selected.length }} item{{ $ctrl.selected.length > 1 ? 's' : '' }} selected .panel-collapse - .grid.ui-grid--ignite(ui-grid='$ctrl.gridOptions' ui-grid-resize-columns ui-grid-selection ui-grid-exporter ui-grid-pinning ui-grid-grouping) + .grid.ui-grid--ignite.ui-grid-disabled-group-selection(ui-grid='$ctrl.gridOptions' ui-grid-resize-columns ui-grid-selection ui-grid-exporter ui-grid-pinning ui-grid-grouping) http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/helpers/jade/form/form-field-checkbox.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/helpers/jade/form/form-field-checkbox.pug b/modules/web-console/frontend/app/helpers/jade/form/form-field-checkbox.pug index fe7f912..21be8b2 100644 --- a/modules/web-console/frontend/app/helpers/jade/form/form-field-checkbox.pug +++ b/modules/web-console/frontend/app/helpers/jade/form/form-field-checkbox.pug @@ -15,18 +15,7 @@ limitations under the License. mixin form-field-checkbox(label, model, name, disabled, required, tip) - //- TODO: Need to use common tooltip. - mixin tooltip-checkbox(title, options) - if title - i.tipLabel.icon-help( - bs-tooltip='' - - data-title=title - data-container=options && options.container || false - data-placement=options && options.placement || false - ) - - div.checkbox.col-xs-12.col-sm-12.col-md-12 + .checkbox label(id=`{{ ${name} }}Label`) .input-tip if block @@ -47,4 +36,4 @@ mixin form-field-checkbox(label, model, name, disabled, required, tip) ) span #{label} - +tooltip-checkbox(tip, tipOpts) + +tooltip(tip, tipOpts) http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/helpers/jade/mixins.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/helpers/jade/mixins.pug b/modules/web-console/frontend/app/helpers/jade/mixins.pug index e9278bd..50a0208 100644 --- a/modules/web-console/frontend/app/helpers/jade/mixins.pug +++ b/modules/web-console/frontend/app/helpers/jade/mixins.pug @@ -17,10 +17,12 @@ include ./form include ../../primitives/btn-group/index include ../../primitives/datepicker/index +include ../../primitives/timepicker/index include ../../primitives/dropdown/index include ../../primitives/tooltip/index include ../../primitives/ui-grid-settings/index -include ../../primitives/switch/index +include ../../primitives/radio/index +include ../../primitives/switcher/index //- Mixin for advanced options toggle. mixin advanced-options-toggle(click, cond, showMessage, hideMessage) http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/modules/agent/AgentManager.service.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/modules/agent/AgentManager.service.js b/modules/web-console/frontend/app/modules/agent/AgentManager.service.js index 281d532..eb4ebfc 100644 --- a/modules/web-console/frontend/app/modules/agent/AgentManager.service.js +++ b/modules/web-console/frontend/app/modules/agent/AgentManager.service.js @@ -15,11 +15,10 @@ * limitations under the License. */ -import io from 'socket.io-client'; // eslint-disable-line no-unused-vars -import maskNull from 'app/core/utils/maskNull'; - import { BehaviorSubject } from 'rxjs/BehaviorSubject'; +import maskNull from 'app/core/utils/maskNull'; + const State = { INIT: 'INIT', AGENT_DISCONNECTED: 'AGENT_DISCONNECTED', http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/datepicker/index.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/datepicker/index.pug b/modules/web-console/frontend/app/primitives/datepicker/index.pug index e5da970..e789a1f 100644 --- a/modules/web-console/frontend/app/primitives/datepicker/index.pug +++ b/modules/web-console/frontend/app/primitives/datepicker/index.pug @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. -mixin ignite-form-field-datepicker(label, model, name, mindate, maxdate, disabled, required, placeholder, tip) +mixin ignite-form-field-datepicker(label, model, name, mindate, maxdate, minview = 1, format = 'MMM yyyy', disabled, required, placeholder, tip) mixin form-field-input() input.form-control( id=`{{ ${name} }}Input` @@ -28,15 +28,16 @@ mixin ignite-form-field-datepicker(label, model, name, mindate, maxdate, disable data-ng-disabled=disabled && `${disabled}` bs-datepicker - data-date-format='MMM yyyy' - data-start-view='1' - data-min-view='1' data-min-date=mindate ? `{{ ${mindate} }}` : false data-max-date=maxdate ? `{{ ${maxdate} }}` : `today` + data-min-view=minview + data-date-format=format + data-start-view=minview + data-placement='bottom' - data-container='.docs-content' + data-container='.ignite-form-field' tabindex='0' http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/datepicker/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/datepicker/index.scss b/modules/web-console/frontend/app/primitives/datepicker/index.scss index 786a2c1..1670704 100644 --- a/modules/web-console/frontend/app/primitives/datepicker/index.scss +++ b/modules/web-console/frontend/app/primitives/datepicker/index.scss @@ -15,8 +15,29 @@ * limitations under the License. */ -.datepicker.dropdown-menu tbody button { - height: 100%; +.datepicker.dropdown-menu { + width: 250px; + height: 270px; + + button { + outline: none; + border: 0; + } + + tbody { + height: 180px; + } + + tbody button { + padding: 6px; + height: 100%; + } + + &.datepicker-mode-1, &.datepicker-mode-2 { + tbody button { + height: 65px; + } + } } .datepicker--ignite { @@ -61,4 +82,13 @@ } } } +} + +.theme--ignite { + .datepicker--ignite { + display: block; + width: 100%; + + font-size: 14px; + } } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/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 a3252cc..d39306d 100644 --- a/modules/web-console/frontend/app/primitives/dropdown/index.scss +++ b/modules/web-console/frontend/app/primitives/dropdown/index.scss @@ -22,6 +22,7 @@ ul.dropdown-menu { z-index: 1; + min-width: calc(100% + 2px); margin-top: 2px; padding: 0; @@ -29,15 +30,22 @@ border-color: #c5c5c5; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3); - a { - padding-left: 15px; - padding-right: 15px; + li { + a { + padding-left: 15px; + padding-right: 15px; + + color: $text-color; + line-height: 26px; - color: $text-color; - line-height: 26px; + &:hover { + color: #a8110f; + } - &:hover { - color: #a8110f; + &.active { + background-color: #fff; + font-weight: normal; + } } } @@ -45,19 +53,91 @@ border-bottom: 1px solid $table-border-color; } } + + ul.select.dropdown-menu { + li { + 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 { - button, .btn-ignite { + .btn-ignite { position: relative; &::after { content: ''; + position: absolute; bottom: -4px; + display: block; height: 4px; width: 100%; } + + &[disabled='disabled'] { + ul.dropdown-menu { + display: none !important; + } + } } -} \ No newline at end of file +} http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/file/index.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/file/index.pug b/modules/web-console/frontend/app/primitives/file/index.pug new file mode 100644 index 0000000..4ce9ef4 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/file/index.pug @@ -0,0 +1,37 @@ +//- + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + +mixin ignite-form-field-file(label, model, name, disabled, required, options, tip) + .file--ignite.ignite-form-field(ng-class='{ "choosen": `${model}` }') + label.ignite-form-field__label(for=`{{ ${name} }}Input`) + span Folder name: + .ignite-form-field__control + label.btn-ignite.btn-ignite--primary(for=`{{ ${name} }}Input`) + | Choose Destination Folder + label.tipField.link-primary(for=`{{ ${name} }}Input`) Change folder + + +tooltip(tip, tipOpts) + + if block + block + + .input-tip + input( + id=`{{ ${name} }}Input` + type='file' + data-ng-model=model + )&attributes(attributes) + | {{ `${model}` }} http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/file/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/file/index.scss b/modules/web-console/frontend/app/primitives/file/index.scss new file mode 100644 index 0000000..dbd32a4 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/file/index.scss @@ -0,0 +1,60 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.file--ignite { + label { + cursor: pointer; + } + + &.choosen { + .ignite-form-field__control { + .btn-ignite { + display: none; + } + + .tipField { + display: block; + } + } + } + + &:not(.choosen) { + .ignite-form-field__label { + font-size: 0; + line-height: 0; + margin-bottom: 0px; + } + } + + .ignite-form-field__control { + display: flex; + + input[type='file'] { + position: absolute; + opacity: 0; + z-index: -1; + } + + .tipField { + display: none; + } + + .input-tip { + order: -1; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/form-field/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/form-field/index.scss b/modules/web-console/frontend/app/primitives/form-field/index.scss new file mode 100644 index 0000000..42370b3 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/form-field/index.scss @@ -0,0 +1,76 @@ + +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +@import '../../../public/stylesheets/variables'; + +.theme--ignite { + .ignite-form-field { + width: 100%; + + &.radio--ignite { + width: auto; + } + + .ignite-form-field__label { + float: left; + width: 100%; + margin: 4px 10px; + + color: $gray-light; + font-size: 12px; + line-height: 12px; + } + + .ignite-form-field__control { + width: 100%; + + .input-tip { + display: flex; + overflow: visible; + } + + .tipField { + line-height: 36px; + } + + input, + button { + overflow: visible; + + box-sizing: border-box; + width: 100%; + max-width: initial; + height: 36px; + padding: 0px 10px; + margin-right: 0; + + border: solid 1px #c5c5c5; + border-radius: 4px; + background-color: #ffffff; + box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.2); + + color: $text-color; + line-height: 36px; + } + + input[type='number'] { + text-align: right; + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/grid/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/grid/index.scss b/modules/web-console/frontend/app/primitives/grid/index.scss new file mode 100644 index 0000000..a77240f --- /dev/null +++ b/modules/web-console/frontend/app/primitives/grid/index.scss @@ -0,0 +1,42 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.theme--ignite { + .row { + display: flex; + margin: 16px -10px; + + line-height: 36px; + + & > [class*="col-"] { + & > * { + align-self: flex-end; + } + } + } + + [class*="col-"] { + display: inline-flex; + padding: 0 10px; + } + + @for $i from 1 through 20 { + .col-#{$i*5} { + width: $i*5%; + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/index.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/index.js b/modules/web-console/frontend/app/primitives/index.js index 35a7cde..30f7d7e 100644 --- a/modules/web-console/frontend/app/primitives/index.js +++ b/modules/web-console/frontend/app/primitives/index.js @@ -18,6 +18,7 @@ import './badge/index.scss'; import './btn/index.scss'; import './datepicker/index.scss'; +import './timepicker/index.scss'; import './tabs/index.scss'; import './table/index.scss'; import './panel/index.scss'; @@ -27,4 +28,8 @@ import './ui-grid/index.scss'; import './ui-grid-header/index.scss'; import './ui-grid-settings/index.scss'; import './page/index.scss'; -import './switch/index.scss'; +import './radio/index.scss'; +import './switcher/index.scss'; +import './form-field/index.scss'; +import './typography/index.scss'; +import './grid/index.scss'; http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/modal/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/modal/index.scss b/modules/web-console/frontend/app/primitives/modal/index.scss index 58b7370..87d8dc3 100644 --- a/modules/web-console/frontend/app/primitives/modal/index.scss +++ b/modules/web-console/frontend/app/primitives/modal/index.scss @@ -150,15 +150,18 @@ border-bottom: 1px solid $table-border-color; h4 { + display: inline-flex; + align-items: center; + margin-top: 1px; + margin-bottom: -1px; + color: $text-color; font-size: 16px; font-family: Roboto; font-weight: 400; line-height: 36px; - margin-top: 1px; - margin-bottom: -1px; - svg, i { + i, .icon-left, svg { margin-right: 8px; color: #424242; @@ -169,17 +172,44 @@ } .modal-body { - padding: 20px; + margin: 0; + padding: 5px 20px; + + .input-tip { + padding-top: 0; + } } .modal-footer { padding: 10px 20px; border-top: 1px solid $table-border-color; - - button + button { + + button + button, + button + a { margin-left: 20px; } } + + ul.tabs { + margin-top: 20px; + } + + .panel--ignite { + margin-top: 20px; + margin-bottom: 20px; + } + + ul.tabs + .panel--ignite { + margin-top: 0; + } + + fieldset { + margin: 16px 0; + + & > .row:first-child { + margin-top: 0; + } + } } } http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/panel/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/panel/index.scss b/modules/web-console/frontend/app/primitives/panel/index.scss index 75662ef..38d18dd 100644 --- a/modules/web-console/frontend/app/primitives/panel/index.scss +++ b/modules/web-console/frontend/app/primitives/panel/index.scss @@ -45,6 +45,7 @@ font-size: 14px; font-style: italic; line-height: 36px; + cursor: default; } } } http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/switcher/index.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/switcher/index.pug b/modules/web-console/frontend/app/primitives/switcher/index.pug new file mode 100644 index 0000000..5689094 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/switcher/index.pug @@ -0,0 +1,20 @@ +//- + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + +mixin switcher() + label.switcher--ignite + input(type='checkbox')&attributes(attributes) + div(bs-tooltip=attributes.tip && '' data-title=attributes.tip data-trigger='hover') http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/switcher/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/switcher/index.scss b/modules/web-console/frontend/app/primitives/switcher/index.scss new file mode 100644 index 0000000..cf8ed64 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/switcher/index.scss @@ -0,0 +1,80 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +@import '../../../public/stylesheets/variables'; + +label.switcher--ignite { + width: 34px; + max-width: 34px !important; + height: 20px; + + line-height: 20px; + vertical-align: middle; + + cursor: pointer; + + input[type="checkbox"] { + position: absolute; + opacity: 0.0; + + & + div { + position: relative; + + width: 34px; + height: 14px; + margin: 3px 0; + + border-radius: 8px; + background-color: #C5C5C5; + transition: background 0.2s ease; + + &:before { + content: ''; + + position: absolute; + top: -3px; + left: 0; + + width: 20px; + height: 20px; + + border: solid 1px #C5C5C5; + border-radius: 50%; + background-color: #FFF; + + transition: all 0.12s ease; + } + + &:active:before { + transform: scale(1.15, 0.85); + } + } + + &:checked + div { + background-color: #FF8485; + + &:before { + content: ''; + + left: 14px; + + border: 0; + background-color: #EE2B27; + } + } + } +} http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/timepicker/index.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/timepicker/index.pug b/modules/web-console/frontend/app/primitives/timepicker/index.pug new file mode 100644 index 0000000..9f1f6ec --- /dev/null +++ b/modules/web-console/frontend/app/primitives/timepicker/index.pug @@ -0,0 +1,59 @@ +//- + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + +mixin ignite-form-field-timepicker(label, model, name, mindate, maxdate, disabled, required, placeholder, tip) + + mixin form-field-input() + input.form-control( + id=`{{ ${name} }}Input` + name=`{{ ${name} }}` + + placeholder=placeholder + + data-ng-model=model + + data-ng-required=required && `${required}` + data-ng-disabled=disabled && `${disabled}` + + bs-timepicker + data-time-format='HH:mm' + data-length='1' + data-minute-step='1' + data-arrow-behavior='picker' + + data-placement='bottom' + data-container=`.timepicker--ignite` + + tabindex='0' + + onkeydown="return false" + + data-ignite-form-panel-field='' + )&attributes(attributes.attributes) + + .timepicker--ignite.ignite-form-field + if name + +ignite-form-field__label(label, name, required) + + .ignite-form-field__control + if tip + i.tipField.icon-help(bs-tooltip='' data-title=tip) + + if block + block + + .input-tip + +form-field-input(attributes=attributes) http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/timepicker/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/timepicker/index.scss b/modules/web-console/frontend/app/primitives/timepicker/index.scss new file mode 100644 index 0000000..361e949 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/timepicker/index.scss @@ -0,0 +1,137 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.timepicker.dropdown-menu { + padding: 0 4px; + + button { + outline: none; + border: 0; + } + + tbody button { + height: 100%; + padding: 6px; + } +} + +.timepicker--ignite { + $height: 36px; + + display: inline-block; + width: auto; + + font-size: 14px; + + label.ignite-form-field__label { + width: auto; + max-width: initial; + + font-size: inherit; + line-height: $height; + } + + .ignite-form-field__control { + width: auto; + + input { + width: auto; + height: $height; + min-width: 40px; + max-width: 70px; + padding: 0; + padding-left: 5px; + + cursor: pointer; + color: transparent; + font-size: inherit; + line-height: $height; + text-align: left; + text-shadow: 0 0 0 #ee2b27; + + border: none; + box-shadow: none; + background: none; + + &:hover, &:focus { + text-shadow: 0 0 0 #a8110f; + } + } + } + + .dropdown-menu { + line-height: 30px; + + thead, tfoot { + th { + text-align: center; + line-height: 0; + } + + .btn.btn-default { + float: none !important; + display: inline-block; + margin-right: 0; + + &:active { + box-shadow: none; + background: none; + } + + &:before { + content: ''; + + display: block; + width: 10px; + height: 10px; + + border: 2px solid #757575; + transform: rotate(45deg); + } + + &:hover { + background: none; + } + } + } + + thead { + th { + padding-top: 10px; + } + + .btn.btn-default { + &:before { + border-width: 2px 0 0 2px; + } + } + } + + tfoot { + th { + padding-top: 2px; + padding-bottom: 10px; + } + + .btn.btn-default { + &:before { + border-width: 0 2px 2px 0; + } + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/typography/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/typography/index.scss b/modules/web-console/frontend/app/primitives/typography/index.scss new file mode 100644 index 0000000..7fee674 --- /dev/null +++ b/modules/web-console/frontend/app/primitives/typography/index.scss @@ -0,0 +1,36 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +@import '../../../public/stylesheets/variables'; + +.theme--ignite { + p { + margin: 20px 0; + + color: $text-color; + font-size: 14px; + line-height: 17px; + } + + h4 { + margin-top: 20px; + + color: $text-color; + font-size: 16px; + font-weight: normal; + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/ui-grid-header/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/ui-grid-header/index.scss b/modules/web-console/frontend/app/primitives/ui-grid-header/index.scss index 7b3ce7b..ac58707 100644 --- a/modules/web-console/frontend/app/primitives/ui-grid-header/index.scss +++ b/modules/web-console/frontend/app/primitives/ui-grid-header/index.scss @@ -78,7 +78,7 @@ top: -100px; } .ng-hide + .ui-grid-header-cell-row .ui-grid-column-resizer.right { - bottom: -100px; + bottom: 0; } &.ui-grid-header-cell .ui-grid-header-cell .ui-grid-column-resizer.right { http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/ui-grid-settings/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/ui-grid-settings/index.scss b/modules/web-console/frontend/app/primitives/ui-grid-settings/index.scss index e192ad8..e5d30e6 100644 --- a/modules/web-console/frontend/app/primitives/ui-grid-settings/index.scss +++ b/modules/web-console/frontend/app/primitives/ui-grid-settings/index.scss @@ -20,73 +20,80 @@ .ui-grid-settings { color: #393939; - ul.select.dropdown-menu { - padding: 0; - - & > li { - & > a { - padding: 3px 12px; - - & > span { - line-height: 26px; - padding-left: 10px; - padding-right: 8px; - cursor: pointer; - } + .grid-settings { + ul.dropdown-menu { + padding: 0; + min-width: auto; + + & > li { + & > a { + padding: 3px 12px; + + & > span { + line-height: 26px; + padding-left: 10px; + padding-right: 8px; + cursor: pointer; + } - & > i { - position: relative; - - width: 12px; - height: 12px; - margin-top: 7px; - margin-left: 0; + & > i { + position: relative; + + width: 12px; + height: 12px; + margin-top: 7px; + margin-left: 0; - color: inherit; - line-height: 26px; + color: inherit; + line-height: 26px; - border: 1px solid #afafaf; - border-radius: 2px; - background-color: #FFF; + border: 1px solid #afafaf; + border-radius: 2px; + background-color: #FFF; - box-shadow: inset 0 1px 1px #ccc; + box-shadow: inset 0 1px 1px #ccc; - &.fa-square-o:before, - &.fa-check-square-o:before { - content: ''; - } + &.fa-square-o:before, + &.fa-check-square-o:before { + content: ''; + } - &.fa-check-square-o { - border-color: #0067b9; - background-color: #0067b9; + &.fa-check-square-o { + border-color: #0067b9; + background-color: #0067b9; - box-shadow: none; - } + box-shadow: none; + } - &.fa-check-square-o:before { - content: ''; + &.fa-check-square-o:before { + content: ''; - position: absolute; - top: 0; - left: 3px; + position: absolute; + top: 0; + left: 3px; - width: 4px; - height: 8px; + width: 4px; + height: 8px; - border: solid #FFF; - border-width: 0 2px 2px 0; + border: solid #FFF; + border-width: 0 2px 2px 0; - transform: rotate(35deg); + transform: rotate(35deg); + } } } - } - &:not(:last-child) { - border-bottom: 1px solid #dddddd; + &:not(:last-child) { + border-bottom: 1px solid #dddddd; + } } } } + &--heading { + cursor: default; + } + &--heading > span { position: relative; top: -1px; @@ -157,6 +164,62 @@ &-dateperiod { display: block; margin-right: 35px; + + .ignite-form-field { + $height: 36px; + + display: inline-block; + width: auto; + + font-size: 14px; + + label.ignite-form-field__label { + width: auto; + max-width: initial; + + font-size: inherit; + line-height: $height; + } + + .ignite-form-field__control { + width: auto; + + .input-tip { + overflow: visible; + } + + button { + overflow: visible; + + width: auto; + height: $height; + min-width: 70px; + max-width: 70px; + padding: 0; + padding-left: 5px; + + cursor: pointer; + color: transparent; + font-size: inherit; + line-height: $height; + text-align: left; + text-shadow: 0 0 0 #ee2b27; + + border: none; + box-shadow: none; + + &:hover, &:focus { + text-shadow: 0 0 0 #a8110f; + } + } + + ul.dropdown-menu { + span { + text-shadow: none; + } + } + } + } } .btn-ignite, @@ -167,6 +230,10 @@ margin-left: 20px; margin-right: 0; + + .timepicker--ignite { + width: 45px; + } } &-dateperiod { http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/app/primitives/ui-grid/index.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/ui-grid/index.scss b/modules/web-console/frontend/app/primitives/ui-grid/index.scss index 7908d06..b26036b 100644 --- a/modules/web-console/frontend/app/primitives/ui-grid/index.scss +++ b/modules/web-console/frontend/app/primitives/ui-grid/index.scss @@ -17,15 +17,20 @@ @import '../../../public/stylesheets/variables'; -.ui-grid--ignite { +.ui-grid.ui-grid--ignite { $height: 46px; + position: relative; border-top: none; [role="button"] { outline: none; } + sup { + color: $ignite-brand-success; + } + .ui-grid-top-panel { background: initial; } @@ -40,6 +45,14 @@ border-color: transparent; } + .ui-grid-top-panel { + overflow: visible; + + .ui-grid-header-viewport { + overflow: visible; + } + } + .ui-grid-cell, .ui-grid-header-cell { .ui-grid-cell-contents { @@ -47,10 +60,14 @@ text-align: left; font-family: Roboto; + white-space: nowrap; } } .ui-grid-contents-wrapper { + position: absolute; + top: 0; + border-bottom-right-radius: 6px; overflow: hidden; } @@ -69,24 +86,78 @@ } } - .ui-grid-header--subcategories { - .ui-grid-header-span { - background: initial; + .ui-grid-header-viewport { + .ui-grid-header-canvas { + .ui-grid-header-cell { + .ui-grid-cell-contents { + color: $gray-light; + font-size: 14px; + font-weight: normal; + font-style: normal; + line-height: 18px; + text-align: left; - .ui-grid-cell-contents { - color: $gray-light; - font-size: 14px; - font-weight: normal; - font-style: normal; - line-height: 18px; - text-align: left; + padding: 15px 20px; - padding: 8px 20px; + & > i { + line-height: 18px; + } - & > i { - line-height: 18px; + .ui-grid-header-cell-label { + // position: relative; + } + + .ui-grid-header-cell-label + span { + position: relative; + right: 3px; + } + + .ui-grid-header-cell-filter { + background-image: + linear-gradient(to right, $ignite-brand-success, transparent), + linear-gradient(to right, $ignite-brand-success 70%, transparent 0%); + background-position: left bottom; + background-repeat: repeat-x; + background-size: 0, 8px 1px, 0, 0; + + &:hover { + background-image: none; + // linear-gradient(to right, change-color($ignite-brand-success, $lightness: 26%), transparent), + // linear-gradient(to right, change-color($ignite-brand-success, $lightness: 26%) 70%, transparent 0%); + } + + div { + z-index: 1; + position: fixed; + + width: calc(100% - 40px); + width: 100px; + height: 20px; + margin-top: -20px; + + font-size: 0; + } + + &.active { + color: $ignite-brand-primary; + + background-image: + linear-gradient(to right, $ignite-brand-primary, transparent), + linear-gradient(to right, $ignite-brand-primary 70%, transparent 0%); + } + } } } + } + } + + .ui-grid-header--subcategories { + .ui-grid-header-span.ui-grid-header-cell { + .ui-grid-cell-contents { + padding: 8px 20px; + } + + background: initial; [ng-show] .ui-grid-cell-contents { text-align: center; @@ -111,10 +182,6 @@ padding-right: 20px; } } - - .ui-grid-header-cell-label + span { - position: relative; - } } } @@ -132,6 +199,24 @@ } } + .ui-grid-header--subcategories { + .ui-grid-tree-base-row-header-buttons { + margin-top: 10px; + } + + .ui-grid-selection-row-header-buttons { + margin-top: 12px; + + &:after { + top: 3px; + } + } + } + + .ui-grid-cell.ui-grid-disable-selection.ui-grid-row-header-cell { + pointer-events: auto; + } + &:before { content: ''; @@ -339,11 +424,6 @@ } .ui-grid-tree-header-row { - .ui-grid-selection-row-header-buttons { - opacity: .2; - cursor: default; - } - & ~ .ui-grid-row:not(.ui-grid-tree-header-row) { position: relative; @@ -413,4 +493,37 @@ background-position: center; } } + + .ui-grid-icon-filter { + position: absolute; + right: 20px; + + color: $text-color; + + &:before { + content: ''; + } + } } + +.ui-grid--ignite.ui-grid-disabled-group-selection { + .ui-grid-pinned-container { + .ui-grid-tree-header-row { + .ui-grid-selection-row-header-buttons { + opacity: .2; + cursor: default; + } + } + } +} + +.ui-grid--ignite.no-data { + position: relative; + + padding: 16px 51px; + + border-radius: 0 0 4px 4px; + + font-style: italic; + line-height: 16px; +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/public/images/icons/filter.svg ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/public/images/icons/filter.svg b/modules/web-console/frontend/public/images/icons/filter.svg new file mode 100644 index 0000000..b924daf --- /dev/null +++ b/modules/web-console/frontend/public/images/icons/filter.svg @@ -0,0 +1 @@ +<svg id="filter-icon" xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 16 16"><g fill="currentColor" transform="translate(-635 -112)"><g transform="translate(475 33)"><path d="M175.9 79.4c.1.3.1.6-.2.8l-5.6 5.6v8.4c0 .3-.1.5-.4.7-.1 0-.2.1-.3.1-.2 0-.4-.1-.5-.2l-2.9-2.9c-.1-.1-.2-.3-.2-.5v-5.5l-5.6-5.6c-.2-.2-.3-.5-.2-.8.1-.3.4-.4.7-.4h14.5c.4-.1.6 0 .7.3z"/></g></g></svg> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/public/images/icons/index.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/public/images/icons/index.js b/modules/web-console/frontend/public/images/icons/index.js index d6e7c6f..2609550 100644 --- a/modules/web-console/frontend/public/images/icons/index.js +++ b/modules/web-console/frontend/public/images/icons/index.js @@ -21,3 +21,5 @@ export gear from './gear.svg'; export clock from './clock.svg'; export manual from './manual.svg'; export download from './download.svg'; +export filter from './filter.svg'; +export search from './search.svg'; http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/public/images/icons/search.svg ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/public/images/icons/search.svg b/modules/web-console/frontend/public/images/icons/search.svg new file mode 100644 index 0000000..32e594c --- /dev/null +++ b/modules/web-console/frontend/public/images/icons/search.svg @@ -0,0 +1 @@ +<svg id="search-icon" xmlns="http://www.w3.org/2000/svg"; viewBox="0 0 18 18"><g stroke="currentColor" stroke-width="2" transform="translate(-156 -179)"><g transform="translate(0 33)"><g transform="translate(0 120)"><g transform="translate(157 27)"><circle fill="transparent" cx="5.7" cy="5.7" r="5.7"/><path d="M9.1 9.1L16 16"/></g></g></g></g></svg> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/public/stylesheets/style.scss ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/public/stylesheets/style.scss b/modules/web-console/frontend/public/stylesheets/style.scss index dd2fc05..857cdce 100644 --- a/modules/web-console/frontend/public/stylesheets/style.scss +++ b/modules/web-console/frontend/public/stylesheets/style.scss @@ -2172,27 +2172,3 @@ html,body,.splash-screen { line-height: $line-height-base; } } - -.datepicker.dropdown-menu { - width: 250px; - height: 270px; - - button { - outline: none; - border: 0; - } - - tbody { - height: 180px; - } - - tbody button { - padding: 6px; - } - - &.datepicker-mode-1, &.datepicker-mode-2 { - tbody button { - height: 65px; - } - } -} http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/views/templates/agent-download.tpl.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/views/templates/agent-download.tpl.pug b/modules/web-console/frontend/views/templates/agent-download.tpl.pug index 5abc587..baf2c6c 100644 --- a/modules/web-console/frontend/views/templates/agent-download.tpl.pug +++ b/modules/web-console/frontend/views/templates/agent-download.tpl.pug @@ -14,13 +14,15 @@ See the License for the specific language governing permissions and limitations under the License. -.modal.center(tabindex='-1' role='dialog') +.modal.modal--ignite.theme--ignite.center(tabindex='-1' role='dialog') .modal-dialog(ng-switch='ctrl.status') .modal-content(ng-switch-when='agentMissing') .modal-header.header h4.modal-title i.fa.fa-download span Connection to Ignite Web Agent is not established + button.close(type='button' aria-label='Close' ng-click='$hide()') + svg(ignite-icon="cross") .modal-body.agent-download p Please download and run #[a(href='/api/v1/downloads/agent' target='_self') ignite-web-agent] to use this functionality p To start: @@ -31,14 +33,14 @@ .modal-advanced-options i.fa(ng-class='showToken ? "fa-chevron-circle-down" : "fa-chevron-circle-right"' ng-click='showToken = !showToken') a(ng-click='showToken = !showToken') {{showToken ? 'Hide security token...' : 'Show security token...'}} - .details-row(ng-show='showToken') + p(ng-show='showToken') label.labelField Security token: {{user.becameToken || user.token}} i.tipLabel.fa.fa-clipboard(ignite-copy-to-clipboard='{{user.becameToken || user.token}}' bs-tooltip='' data-title='Copy security token to clipboard') i.tipLabel.icon-help(ng-if=lines bs-tooltip='' data-title='The security token is used for authorization of web agent') .modal-footer - button.btn.btn-default(ng-click='ctrl.back()') {{::ctrl.backText}} - a.btn.btn-primary(href='/api/v1/downloads/agent' target='_self') Download agent + button.btn-ignite.btn-ignite--link-success(ng-click='ctrl.back()') {{::ctrl.backText}} + a.btn-ignite.btn-ignite--success(href='/api/v1/downloads/agent' target='_self') Download agent .modal-content(ng-switch-when='nodeMissing') .modal-header.header @@ -49,11 +51,12 @@ .modal-body.agent-download p Connection to Ignite Web Agent is established, but agent failed to connect to Ignite Node p Please check the following: - ul - li Ignite Grid is up and Ignite REST server started (copy "ignite-rest-http" folder from libs/optional/ to libs/) - li In agent settings check URI for connect to Ignite REST server - li Check agent logs for errors - li Refer to #[b README.txt] in the ignite-web-agent folder for more information. + p + ul + li Ignite Grid is up and Ignite REST server started (copy "ignite-rest-http" folder from libs/optional/ to libs/) + li In agent settings check URI for connect to Ignite REST server + li Check agent logs for errors + li Refer to #[b README.txt] in the ignite-web-agent folder for more information. .modal-footer - button.btn.btn-default(ng-click='ctrl.back()') {{::ctrl.backText}} + button.btn-ignite.btn-ignite--link-success(ng-click='ctrl.back()') {{::ctrl.backText}} http://git-wip-us.apache.org/repos/asf/ignite/blob/9e06773b/modules/web-console/frontend/views/templates/confirm.tpl.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/views/templates/confirm.tpl.pug b/modules/web-console/frontend/views/templates/confirm.tpl.pug index 0031498..ccbcfae 100644 --- a/modules/web-console/frontend/views/templates/confirm.tpl.pug +++ b/modules/web-console/frontend/views/templates/confirm.tpl.pug @@ -14,20 +14,21 @@ See the License for the specific language governing permissions and limitations under the License. -.modal(tabindex='-1' role='dialog') +.modal.modal--ignite.theme--ignite(tabindex='-1' role='dialog') .modal-dialog .modal-content .modal-header - button.close(ng-click='confirmCancel()' aria-hidden='true') × h4.modal-title i.icon-confirm - | Confirmation + span Confirmation + button.close(type='button' aria-label='Close' ng-click='confirmCancel()') + svg(ignite-icon="cross") .modal-body(ng-show='content') - p(ng-bind-html='content' style='text-align: center;') + p(ng-bind-html='content') .modal-footer - button#confirm-btn-cancel.btn.btn-default(ng-click='confirmCancel()') Cancel + button#confirm-btn-cancel.btn-ignite.btn-ignite--link-success(ng-click='confirmCancel()') Cancel - button#confirm-btn-no.btn.btn-default(ng-if='yesNo' ng-click='confirmNo()') No - button#confirm-btn-yes.btn.btn-primary(ng-if='yesNo' ng-click='confirmYes()') Yes + button#confirm-btn-no.btn-ignite.btn-ignite--link-success(ng-if='yesNo' ng-click='confirmNo()') No + button#confirm-btn-yes.btn-ignite.btn-ignite--success(ng-if='yesNo' ng-click='confirmYes()') Yes - button#confirm-btn-ok.btn.btn-primary(ng-if='!yesNo' ng-click='confirmYes()') Confirm + button#confirm-btn-ok.btn-ignite.btn-ignite--success(ng-if='!yesNo' ng-click='confirmYes()') Confirm
