diff options
| author | Clement Ho <ClemMakesApps@gmail.com> | 2017-08-04 17:05:21 +0200 |
|---|---|---|
| committer | Clement Ho <ClemMakesApps@gmail.com> | 2017-08-04 19:47:20 +0200 |
| commit | 601f6442f2cd9cbeef3553ad65a80c42fd9d8391 (patch) | |
| tree | 3a92953cb826f0d05a1e269bb094ea6206aacf03 | |
| parent | 055b1ec1f1529251168a74f7f656285872d3a5ff (diff) | |
| download | gitlab-ce-601f6442f2cd9cbeef3553ad65a80c42fd9d8391.tar.gz | |
Style repo tabs
| -rw-r--r-- | app/assets/javascripts/repo/components/repo_tabs.vue | 1 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/repo.scss | 15 |
2 files changed, 12 insertions, 4 deletions
diff --git a/app/assets/javascripts/repo/components/repo_tabs.vue b/app/assets/javascripts/repo/components/repo_tabs.vue index 89ae1d3a7a8..673f19acba2 100644 --- a/app/assets/javascripts/repo/components/repo_tabs.vue +++ b/app/assets/javascripts/repo/components/repo_tabs.vue @@ -38,5 +38,6 @@ export default RepoTabs; <template> <ul id="tabs" v-if="isMini" v-cloak :class="{'overflown': tabsOverflow}"> <repo-tab v-for="tab in openedFiles" :key="tab.id" :tab="tab" :class="{'active' : tab.active}" @xclicked="xclicked"/> + <li class="tabs-divider" /> </ul> </template> diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss index a56f3419bbc..7277ad65f7a 100644 --- a/app/assets/stylesheets/pages/repo.scss +++ b/app/assets/stylesheets/pages/repo.scss @@ -99,10 +99,9 @@ } #tabs { - border-bottom: 1px solid $white-normal; padding-left: 0; margin-bottom: 0; - display: block; + display: flex; white-space: nowrap; width: 100%; overflow-y: hidden; @@ -116,9 +115,9 @@ background: $gray-normal; display: inline-block; padding: 10px 18px; - border-right: 1px solid $border-color; + border-right: 1px solid $white-normal; + border-bottom: 1px solid $white-normal; white-space: nowrap; - border-radius: 3px 3px 0 0; &.remove { animation: swipeRightDissapear ease-in 0.1s; @@ -132,6 +131,7 @@ &.active { background: $white-light; + border-bottom: none; } a { @@ -161,6 +161,13 @@ i.fa.fa-circle { color: $brand-success; } + + &.tabs-divider { + width: 100%; + background-color: $white-light; + border-right: none; + border-top-right-radius: 2px; + } } } |