diff options
| -rw-r--r-- | app/assets/javascripts/repo/components/repo.vue | 20 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/repo.scss | 28 |
2 files changed, 30 insertions, 18 deletions
diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue index 3d5e01c8ec0..f35d698e756 100644 --- a/app/assets/javascripts/repo/components/repo.vue +++ b/app/assets/javascripts/repo/components/repo.vue @@ -43,15 +43,17 @@ export default { </script> <template> - <div class="repository-view tree-content-holder"> - <repo-sidebar/><div v-if="isMini" - class="panel-right" - :class="{'edit-mode': editMode}"> - <repo-tabs/> - <component - :is="currentBlobView" - class="blob-viewer-container"/> - <repo-file-buttons/> + <div class="repository-view"> + <div class="tree-content-holder" :class="{'tree-content-holder-mini' : isMini}"> + <repo-sidebar/><div v-if="isMini" + class="panel-right" + :class="{'edit-mode': editMode}"> + <repo-tabs/> + <component + :is="currentBlobView" + class="blob-viewer-container"/> + <repo-file-buttons/> + </div> </div> <repo-commit-section/> <popup-dialog diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss index 7ef05f56d80..9d376621c5b 100644 --- a/app/assets/stylesheets/pages/repo.scss +++ b/app/assets/stylesheets/pages/repo.scss @@ -52,14 +52,25 @@ margin: 20px; } -.repository-view.tree-content-holder { +.repository-view { border: 1px solid $border-color; border-radius: $border-radius-default; color: $almost-black; + .tree-content-holder { + display: flex; + max-height: 100vh; + } + + .tree-content-holder-mini { + height: 100vh; + } + .panel-right { - display: inline-block; + display: flex; + flex-direction: column; width: 80%; + height: 100%; .monaco-editor.vs { .line-numbers { @@ -90,16 +101,17 @@ } .blob-viewer-container { - height: calc(100vh - 62px); + flex: 1; overflow: auto; } #tabs { + flex-shrink: 0; + display: flex; + width: 100%; padding-left: 0; margin-bottom: 0; - display: flex; white-space: nowrap; - width: 100%; overflow-y: hidden; overflow-x: auto; @@ -228,14 +240,12 @@ } #sidebar { + flex: 1; + height: 100%; &.sidebar-mini { - display: inline-block; - vertical-align: top; width: 20%; border-right: 1px solid $white-normal; - min-height: 475px; - height: calc(100vh + 20px); overflow: auto; } |