Improve edit tray button colour contrast

This commit is contained in:
Nick O'Leary 2016-06-14 14:28:25 +01:00
parent 2d6aac7d6f
commit cc02b07ff0
3 changed files with 53 additions and 15 deletions

View File

@ -55,7 +55,10 @@ $typedInput-button-background: #efefef;
$typedInput-button-background-hover: #ddd;
$typedInput-button-background-active: #e3e3e3;
$editor-button-color-primary: #666;
$editor-button-color-secondary: #999;
$editor-button-color-primary: #eee;
$editor-button-background-primary: #AD1625;
$editor-button-background-primary-hover: #6E0A1E;
$editor-button-color: #999;
$editor-button-background: #fff;
$shade-color: rgba(220,220,220,0.5);

View File

@ -76,7 +76,33 @@
font-size: 14px;
padding: 6px 14px;
margin-right: 8px;
color: $editor-button-color-primary;
color: $editor-button-color;
background: $editor-button-background;
&.primary {
border-color: $editor-button-background-primary;
color: $editor-button-color-primary;
background: $editor-button-background-primary;
&:hover {
border-color: $editor-button-background-primary-hover;
background: $editor-button-background-primary-hover;
color: $editor-button-color-primary !important;
}
}
&:not(.disabled):hover {
//color: $editor-button-color;
}
&.disabled {
background: none;
}
&.disabled:focus {
outline: none;
}
&.leftButton {
float: left;
margin-top: 1px;
@ -84,12 +110,6 @@
&:not(.leftButton):not(:last-child) {
margin-right: 16px;
}
&:not(.primary) {
background: none;
&:not(.disabled):hover {
color: $editor-button-color-primary;
}
}
}
}
@ -108,7 +128,7 @@
margin:0;
&:not(:last-child) {
color: $editor-button-color-secondary;
color: $editor-button-color;
font-weight: normal;
&:after {

View File

@ -79,7 +79,9 @@
font-size: 14px;
padding: 6px 14px;
margin-right: 8px;
color: $editor-button-color-primary;
color: $editor-button-color;
background: $editor-button-background;
&.leftButton {
float: left;
margin-top: 7px;
@ -87,13 +89,26 @@
&:not(.leftButton):not(:last-child) {
margin-right: 16px;
}
&:not(.primary) {
background: none;
&:hover {
color: $editor-button-color-primary;
&.primary {
border-color: $editor-button-background-primary;
color: $editor-button-color-primary;
background: $editor-button-background-primary;
&:not(.disabled):hover {
border-color: $editor-button-background-primary-hover;
background: $editor-button-background-primary-hover;
color: $editor-button-color-primary !important;
}
}
&.disabled {
background: none;
}
&.disabled {
background: none;
}
&.disabled:focus {
outline: none;
}
.ui-button-text {
padding: 0;
}