AMBARI-20657. Usability: screen jumps when you scroll down (pallavkul)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/b4fc47f5 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/b4fc47f5 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/b4fc47f5 Branch: refs/heads/branch-feature-AMBARI-12556 Commit: b4fc47f5ea849a5e8fafea0842397fbb1d73272c Parents: b491509 Author: pallavkul <[email protected]> Authored: Wed Apr 5 11:17:27 2017 +0530 Committer: pallavkul <[email protected]> Committed: Wed Apr 5 11:17:27 2017 +0530 ---------------------------------------------------------------------- .../src/main/resources/ui/app/styles/app.scss | 23 ++++++++++-------- .../ui/app/styles/bootstrap-overrides.scss | 25 ++++++++++---------- .../resources/ui/app/templates/application.hbs | 2 +- 3 files changed, 27 insertions(+), 23 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/b4fc47f5/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss b/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss index 650c1d6..c06e65e 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss +++ b/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss @@ -38,7 +38,10 @@ .main-wrapper { padding: 5px 0; background-color: #fff; - min-height: 100vh; +} + +.top-application-header{ + background-color: #e1e1e0; } .fa-1-5{ @@ -49,7 +52,7 @@ font-size: 2em; } -$database-search-background: lighten($body-bg, 10%); +$database-search-background: lighten($base-bg, 10%); $database-search-text-color: $gray; .database-search, .multiple-database-search { color: $database-search-text-color; @@ -128,7 +131,7 @@ $database-search-text-color: $gray; } } -$list-filter-header-background: lighten($body-bg, 10%); +$list-filter-header-background: lighten($base-bg, 10%); $list-filter-text-color: $gray; .list-filter { @@ -152,7 +155,7 @@ $list-filter-text-color: $gray; .table-list { .list-group-item { - background-color: lighten($body-bg, 10%); + background-color: lighten($base-bg, 10%); } } @@ -174,10 +177,10 @@ $list-filter-text-color: $gray; } } -$table-info-background: lighten($body-bg, 10%); +$table-info-background: lighten($base-bg, 10%); .table-info { - background-color: $body-bg; + background-color: $base-bg; .table-header { border: 1px solid darken($table-info-background, 15%); p { @@ -218,7 +221,7 @@ pre { } .scroll-fix { - background-color: lighten($body-bg, 5%); + background-color: lighten($base-bg, 5%); height: calc(100vh - 180px); overflow-y: scroll; } @@ -718,8 +721,8 @@ pre { } .jobs-status { - border-top: 1px solid darken($body-bg, 10%); - border-bottom: 1px solid darken($body-bg, 10%); + border-top: 1px solid darken($base-bg, 10%); + border-bottom: 1px solid darken($base-bg, 10%); .strip { margin-top: 20px; } @@ -969,4 +972,4 @@ rect.operator__box { position:relative; bottom:10px; right:-15px; -} \ No newline at end of file +} http://git-wip-us.apache.org/repos/asf/ambari/blob/b4fc47f5/contrib/views/hive20/src/main/resources/ui/app/styles/bootstrap-overrides.scss ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/styles/bootstrap-overrides.scss b/contrib/views/hive20/src/main/resources/ui/app/styles/bootstrap-overrides.scss index 4b7bec4..d3cf36e 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/styles/bootstrap-overrides.scss +++ b/contrib/views/hive20/src/main/resources/ui/app/styles/bootstrap-overrides.scss @@ -18,7 +18,8 @@ $font-family-sans-serif: 'Roboto', "Helvetica Neue", Helvetica, Arial, sans-serif; -$body-bg: #e1e1e0; +$body-bg: #FFF; +$base-bg: #e1e1e0; $border-radius-base: 3px; $border-radius-large: 4px; $border-radius-small: 2px; @@ -26,10 +27,10 @@ $border-radius-small: 2px; // nav-tabs $nav-link-padding: 10px 20px !default; -$nav-tabs-border-color: darken($body-bg, 15%); -$nav-tabs-link-hover-border-color: darken($body-bg, 15%); +$nav-tabs-border-color: darken($base-bg, 15%); +$nav-tabs-link-hover-border-color: darken($base-bg, 15%); $nav-tabs-active-link-hover-bg: #fff; -$nav-tabs-active-link-hover-border-color: darken($body-bg, 15%); +$nav-tabs-active-link-hover-border-color: darken($base-bg, 15%); @import 'bootstrap'; @@ -40,18 +41,18 @@ $nav-tabs-active-link-hover-border-color: darken($body-bg, 15%); &.active { background-color: $gray-dark; color: #fff; - border: 1px solid darken($body-bg, 15%); + border: 1px solid darken($base-bg, 15%); border-bottom: none; &.ember-transitioning-out { - background-color: $body-bg; - color: darken($body-bg, 50%); + background-color: $base-bg; + color: darken($base-bg, 50%); border: none; } } &.ember-transitioning-in { background-color: $gray-dark; color: #fff; - border: 1px solid darken($body-bg, 15%); + border: 1px solid darken($base-bg, 15%); border-bottom: none; } } @@ -60,19 +61,19 @@ $nav-tabs-active-link-hover-border-color: darken($body-bg, 15%); li { a { font-weight: bold; - color: darken($body-bg, 50%); + color: darken($base-bg, 50%); &.active { background-color: #fff; - border: 1px solid darken($body-bg, 15%); + border: 1px solid darken($base-bg, 15%); border-bottom: none; &.ember-transitioning-out { - background-color: $body-bg; + background-color: $base-bg; border: none; } } &.ember-transitioning-in { background-color: #fff; - border: 1px solid darken($body-bg, 15%); + border: 1px solid darken($base-bg, 15%); border-bottom: none; } } http://git-wip-us.apache.org/repos/asf/ambari/blob/b4fc47f5/contrib/views/hive20/src/main/resources/ui/app/templates/application.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/application.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/application.hbs index 53b2192..86c23a4 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/templates/application.hbs +++ b/contrib/views/hive20/src/main/resources/ui/app/templates/application.hbs @@ -22,7 +22,7 @@ {{alert-message flash=flash}} {{/each}} </div> - <div class="row"> + <div class="row top-application-header"> <div class="col-md-12"> {{#if serviceCheckCompleted}} {{top-application-bar}}
