1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

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-hover: #ddd;
$typedInput-button-background-active: #e3e3e3; $typedInput-button-background-active: #e3e3e3;
$editor-button-color-primary: #666; $editor-button-color-primary: #eee;
$editor-button-color-secondary: #999; $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); $shade-color: rgba(220,220,220,0.5);

View File

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

View File

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