CSS: try to hover state rows with state color

This should help your eye to recognize faster whether you hovered the
desired row and helps to distinct hovered from active / selected rows
This commit is contained in:
Thomas Gelf 2014-06-05 03:47:09 +00:00
parent 1b3bb6cade
commit 83faa66167
1 changed files with 58 additions and 2 deletions

View File

@ -127,8 +127,7 @@ tr.state.handled td.state, tr.state.ok td.state, tr.state.up td.state, tr.state.
color: black;
background-color: transparent;
}
tr[href]:hover, tr[href].active {
tr[href].active {
background-color: #ddd;
color: black;
}
@ -194,6 +193,63 @@ tr.state.handled td.state {
background-color: transparent !important;
}
/* HOVER colors */
tr.state[href]:hover, tr.state[href]:hover td.state {
color: white;
}
tr.state.ok:hover {
background-color: @colorOk;
}
tr.state.handled[href]:hover, tr.state.handled[href]:hover td.state {
color: #121212 !important;
}
tr.state.warning[href]:hover {
background-color: @colorWarning;
}
tr.state.warning.handled[href]:hover {
background-color: @colorWarningHandled;
}
tr.state.critical[href]:hover, tr.state.down[href]:hover {
background-color: @colorCritical;
}
tr.state.critical.handled[href]:hover, tr.state.down.handled[href]:hover {
background-color: @colorCriticalHandled;
color: #333;
}
tr.state.unknown[href]:hover {
background-color: @colorUnknown;
}
tr.state.unknown.handled[href]:hover {
background-color: @colorUnknownHandled;
}
tr.state.pending[href]:hover {
background-color: @colorPending;
}
tr.state.invalid[href]:hover {
background-color: @colorInvalid;
}
tr.state.unreachable[href]:hover {
background-color: @colorUnreachable;
}
tr.state.unreachable.handled[href]:hover {
background-color: @colorUnreachableHandled;
}
/* END of HOVER colors */
/* END of special tables and states */