Update styling of all disabled buttons

This commit is contained in:
Annabel Dunstone Gray 2018-01-16 12:31:17 -07:00
parent f17d7a4bee
commit 5139a19e1e
No known key found for this signature in database
GPG key ID: 7C8C78A372AD7A2D
5 changed files with 32 additions and 12 deletions

View file

@ -173,13 +173,14 @@
}
&.user-authored {
cursor: default;
opacity: 0.65;
cursor: not-allowed;
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%);
}
}

View file

@ -450,3 +450,20 @@
.btn-svg svg {
@include btn-svg;
}
// All disabled buttons, regardless of color
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn,
.dropdown-toggle[disabled],
[disabled].dropdown-menu-toggle {
background-color: $gray-light;
border-color: $theme-gray-200;
color: $gl-text-color-disabled;
opacity: 1;
cursor: not-allowed;
i {
color: $gl-text-color-disabled;
}
}

View file

@ -63,11 +63,6 @@
border-radius: $border-radius-base;
white-space: nowrap;
&[disabled] {
opacity: .65;
cursor: not-allowed;
}
&.no-outline {
outline: 0;
}

View file

@ -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;

View file

@ -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 {