diff options
author | Sam Bigelow <sbigelow@gitlab.com> | 2019-01-22 11:29:41 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2019-01-22 11:29:41 +0300 |
commit | a0146dceb633ca459889fef80f72c5e2dd4db476 (patch) | |
tree | 71c58f033db652fbe1251b1ed4cf1ec1fcf0c20b /app/assets/stylesheets | |
parent | ce171674b60f5888aa3802e9f6b843762faabd3a (diff) |
Resolve "Merge request file browser should always be possible show/hide"
Diffstat (limited to 'app/assets/stylesheets')
-rw-r--r-- | app/assets/stylesheets/framework/variables.scss | 5 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/diff.scss | 15 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/merge_requests.scss | 29 |
3 files changed, 41 insertions, 8 deletions
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index c1666c728f3..e886a54dc99 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -664,3 +664,8 @@ $priority-label-empty-state-width: 114px; Issues Analytics */ $issues-analytics-popover-boarder-color: rgba(0, 0, 0, 0.15); +/* +Merge Requests +*/ +$mr-tabs-height: 51px; +$mr-version-controls-height: 56px; diff --git a/app/assets/stylesheets/pages/diff.scss b/app/assets/stylesheets/pages/diff.scss index b78f11aadf1..4f804866886 100644 --- a/app/assets/stylesheets/pages/diff.scss +++ b/app/assets/stylesheets/pages/diff.scss @@ -9,7 +9,7 @@ @media (min-width: map-get($grid-breakpoints, md)) { position: -webkit-sticky; position: sticky; - top: $header-height + 51px; + top: $mr-version-controls-height + $header-height + $mr-tabs-height; margin-left: -1px; border-left: 1px solid $border-color; z-index: 102; @@ -19,6 +19,7 @@ .with-performance-bar & { top: $header-height + 36px + $performance-bar-height; + } } @@ -34,7 +35,7 @@ } .with-performance-bar & { - top: 127px; + top: $header-height + $performance-bar-height + $mr-version-controls-height + $mr-tabs-height; } } @@ -1026,8 +1027,9 @@ .tree-list-holder { position: -webkit-sticky; position: sticky; - top: 100px; - max-height: calc(100vh - 100px); + $top-pos: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px; + top: $header-height + $mr-tabs-height + $mr-version-controls-height + 10px; + max-height: calc(100vh - $top-pos); padding-right: $gl-padding; .file-row { @@ -1036,8 +1038,9 @@ } .with-performance-bar & { - top: 135px; - max-height: calc(100vh - 135px); + $performance-bar-top-pos: $performance-bar-height + $top-pos; + top: $performance-bar-top-pos; + max-height: calc(100vh - $performance-bar-top-pos); } } diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss index 1e4b8d8b7e4..53afb182b54 100644 --- a/app/assets/stylesheets/pages/merge_requests.scss +++ b/app/assets/stylesheets/pages/merge_requests.scss @@ -708,6 +708,7 @@ .mr-version-controls { position: relative; + z-index: 103; background: $gray-light; color: $gl-text-color; @@ -755,13 +756,37 @@ color: $orange-500; padding-right: 5px; } + + @include media-breakpoint-up(md) { + position: -webkit-sticky; + position: sticky; + top: $header-height + $mr-tabs-height; + width: 100%; + border-top: 1px solid $border-color; + + &.is-fileTreeOpen { + margin-left: -16px; + width: calc(100% + 32px); + } + + .mr-version-menus-container { + flex-wrap: nowrap; + } + + .with-performance-bar & { + top: $header-height + $performance-bar-height + $mr-tabs-height; + } + } } .merge-request-tabs-holder { top: $header-height; z-index: 200; background-color: $white-light; - border-bottom: 1px solid $border-color; + + @include media-breakpoint-down(md) { + border-bottom: 1px solid $border-color; + } @include media-breakpoint-up(sm) { position: sticky; @@ -816,7 +841,7 @@ display: flex; justify-content: space-between; - @include media-breakpoint-down(md) { + @include media-breakpoint-down(sm) { flex-direction: column-reverse; } |