diff options
author | Mike Greiling <mike@pixelcog.com> | 2018-06-25 21:24:48 +0300 |
---|---|---|
committer | Mike Greiling <mike@pixelcog.com> | 2018-06-25 21:24:48 +0300 |
commit | d38eb9bb2668afe8ddd2976490c669b8de4c507e (patch) | |
tree | f3a1f3bc50aa526dd4a303e5ca7cce03c0df02be /app/assets | |
parent | 8b13f2366aa87b801a696e07b3e490dcf1e7de8c (diff) | |
parent | fe1203b59dde10999f6b82bcd5b88f0edaf7d80e (diff) |
Merge branch '46202-webide-file-states' into 'master'
Resolve "Introduce hover, active, focus states for files in sidebar of Web IDE"
Closes #46202
See merge request gitlab-org/gitlab-ce!19969
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/ide/components/commit_sidebar/list_item.vue | 6 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/gitlab_theme.scss | 4 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/repo.scss | 29 |
3 files changed, 19 insertions, 20 deletions
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue index 5cda7967130..ee21eeda3cd 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue @@ -89,14 +89,14 @@ export default { <template> <div class="multi-file-commit-list-item position-relative"> - <button + <div v-tooltip :title="tooltipTitle" :class="{ 'is-active': isActive }" - type="button" class="multi-file-commit-list-path w-100 border-0 ml-0 mr-0" + role="button" @dblclick="fileAction" @click="openFileInEditor" > @@ -107,7 +107,7 @@ export default { :css-classes="iconClass" />{{ file.name }} </span> - </button> + </div> <component :is="actionComponent" :path="file.path" diff --git a/app/assets/stylesheets/framework/gitlab_theme.scss b/app/assets/stylesheets/framework/gitlab_theme.scss index b40d02f381a..aaa8bed3df0 100644 --- a/app/assets/stylesheets/framework/gitlab_theme.scss +++ b/app/assets/stylesheets/framework/gitlab_theme.scss @@ -180,10 +180,6 @@ color: $border-and-box-shadow; } - .ide-file-list .file.file-active { - color: $border-and-box-shadow; - } - .ide-sidebar-link { &.active { color: $border-and-box-shadow; diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss index bd3320c8ae5..3c24aaa65e8 100644 --- a/app/assets/stylesheets/pages/repo.scss +++ b/app/assets/stylesheets/pages/repo.scss @@ -23,6 +23,7 @@ margin-top: 0; border-top: 1px solid $white-dark; padding-bottom: $ide-statusbar-height; + color: $gl-text-color; &.is-collapsed { .ide-file-list { @@ -45,12 +46,8 @@ .file { cursor: pointer; - &.file-open { - background: $white-normal; - } - &.file-active { - font-weight: $gl-font-weight-bold; + background: $theme-gray-100; } .ide-file-name { @@ -58,7 +55,9 @@ white-space: nowrap; text-overflow: ellipsis; max-width: inherit; - line-height: 22px; + line-height: 16px; + display: inline-block; + height: 18px; svg { vertical-align: middle; @@ -86,12 +85,14 @@ .ide-new-btn { display: none; + + .btn { + padding: 2px 5px; + } } &:hover, &:focus { - background: $white-normal; - .ide-new-btn { display: block; } @@ -596,11 +597,17 @@ &:hover, &:focus { - background: $white-normal; + background: $theme-gray-100; + } + + &:active { + background: $theme-gray-200; } } .multi-file-commit-list-path { + cursor: pointer; + &.is-active { background-color: $white-normal; } @@ -620,10 +627,6 @@ .multi-file-commit-list-file-path { @include str-truncated(calc(100% - 30px)); - &:hover { - text-decoration: underline; - } - &:active { text-decoration: none; } |