diff options
| author | Jacopo <beschi.jacopo@gmail.com> | 2017-04-16 11:42:08 +0200 |
|---|---|---|
| committer | Jacopo <beschi.jacopo@gmail.com> | 2017-04-16 11:51:21 +0200 |
| commit | de62d3b48c45030b91113e61bae0f3a2f24797e9 (patch) | |
| tree | 510ec9981dedab53f234b4eec3141d3bdb9c0c95 | |
| parent | ae52d1a4b82cd86130c92795390fc3d9664d180b (diff) | |
| download | gitlab-ce-de62d3b48c45030b91113e61bae0f3a2f24797e9.tar.gz | |
Expand/collapse button -> Change to make it look like a toggle
Changed the expand/collapse button to look different when is
opened/closed
| -rw-r--r-- | app/assets/javascripts/behaviors/toggler_behavior.js | 1 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/commits.scss | 7 | ||||
| -rw-r--r-- | changelogs/unreleased/28575-expand-collapse-look.yml | 4 |
3 files changed, 11 insertions, 1 deletions
diff --git a/app/assets/javascripts/behaviors/toggler_behavior.js b/app/assets/javascripts/behaviors/toggler_behavior.js index 4c9ad128e6c..77e92ff8caf 100644 --- a/app/assets/javascripts/behaviors/toggler_behavior.js +++ b/app/assets/javascripts/behaviors/toggler_behavior.js @@ -22,6 +22,7 @@ $(() => { } $('body').on('click', '.js-toggle-button', function toggleButton(e) { + e.target.classList.toggle('open'); toggleContainer($(this).closest('.js-toggle-container')); const targetTag = e.currentTarget.tagName.toLowerCase(); diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 0dad91ba128..9e3142c8aa3 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -135,7 +135,7 @@ .text-expander { display: inline-block; - background: $gray-light; + background: $white-light; color: $gl-text-color-secondary; padding: 0 5px; cursor: pointer; @@ -146,6 +146,11 @@ line-height: $gl-font-size; outline: none; + &.open { + background: $gray-light; + box-shadow: inset 0 0 2px rgba($black, 0.2); + } + &:hover { background-color: darken($gray-light, 10%); text-decoration: none; diff --git a/changelogs/unreleased/28575-expand-collapse-look.yml b/changelogs/unreleased/28575-expand-collapse-look.yml new file mode 100644 index 00000000000..d8943316300 --- /dev/null +++ b/changelogs/unreleased/28575-expand-collapse-look.yml @@ -0,0 +1,4 @@ +--- +title: Expand/collapse button -> Change to make it look like a toggle +merge_request: 10720 +author: Jacopo Beschi @jacopo-beschi |