diff options
author | Phil Hughes <me@iamphill.com> | 2018-01-19 12:55:31 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-01-19 12:55:31 +0300 |
commit | 6aed49bfcaa1ff11c335c2bfb52a1a93c730a07c (patch) | |
tree | b7617ff561f77cbaa53cf6703a93925cae97393c /app | |
parent | 218136ac40547e82bc49562805b1af983d956e72 (diff) | |
parent | 7f6c4f426e80e2c18dbde79b5f8e33e3e2604769 (diff) |
Merge branch '26296-update-styling-disabled-buttons' into 'master'
Resolve "Review styling of disabled buttons"
Closes #26296
See merge request gitlab-org/gitlab-ce!16501
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/stylesheets/framework/awards.scss | 11 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/buttons.scss | 33 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/dropdowns.scss | 5 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/variables.scss | 1 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/note_form.scss | 8 |
5 files changed, 39 insertions, 19 deletions
diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss index e0d2ed80de5..a538b5a2946 100644 --- a/app/assets/stylesheets/framework/awards.scss +++ b/app/assets/stylesheets/framework/awards.scss @@ -174,12 +174,13 @@ &.user-authored { cursor: default; - opacity: 0.65; + background-color: $gray-light; + border-color: $theme-gray-200; + color: $gl-text-color-disabled; - &:hover, - &:active { - background-color: $white-light; - border-color: $border-color; + gl-emoji { + opacity: 0.4; + filter: grayscale(100%); } } diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss index fcc420923f9..d0b0c69b18f 100644 --- a/app/assets/stylesheets/framework/buttons.scss +++ b/app/assets/stylesheets/framework/buttons.scss @@ -220,14 +220,6 @@ @include btn-with-margin; } - &.disabled { - pointer-events: auto !important; - } - - &[disabled] { - pointer-events: none !important; - } - .fa-caret-down, .fa-chevron-down { margin-left: 5px; @@ -450,3 +442,28 @@ .btn-svg svg { @include btn-svg; } + +// All disabled buttons, regardless of color, type, etc +%disabled { + background-color: $gray-light !important; + border-color: $theme-gray-200 !important; + color: $gl-text-color-disabled !important; + opacity: 1 !important; + cursor: default !important; + + i { + color: $gl-text-color-disabled !important; + } +} + +.btn.disabled, +.btn[disabled], +fieldset[disabled] .btn, +.dropdown-toggle[disabled], +[disabled].dropdown-menu-toggle { + @extend %disabled; + + &:hover { + @extend %disabled; + } +} diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 4c6b32630e1..691df098c70 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -63,11 +63,6 @@ border-radius: $border-radius-base; white-space: nowrap; - &[disabled] { - opacity: .65; - cursor: not-allowed; - } - &.no-outline { outline: 0; } diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index 76c0fbdc145..f76c6866463 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -164,6 +164,7 @@ $gl-text-color-tertiary: #949494; $gl-text-color-quaternary: #d6d6d6; $gl-text-color-inverted: rgba(255, 255, 255, 1); $gl-text-color-secondary-inverted: rgba(255, 255, 255, .85); +$gl-text-color-disabled: #919191; $gl-text-green: $green-600; $gl-text-green-hover: $green-700; $gl-text-red: $red-500; diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss index 6d4ccd53e12..bf8eb4c1f06 100644 --- a/app/assets/stylesheets/pages/note_form.scss +++ b/app/assets/stylesheets/pages/note_form.scss @@ -391,11 +391,17 @@ .dropdown-toggle { float: right; - .toggle-icon { + i { color: $white-light; padding-right: 2px; margin-top: 2px; } + + &[disabled] { + i { + color: $gl-text-color-disabled; + } + } } .dropdown-menu { |