Misthios/grafana-zabbix
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

problems: styles tweaks

Browse Source
This commit is contained in:
Alexander Zobnin
2018-12-25 12:47:51 +03:00
parent 66178c0f8a
commit b448c4117d
3 changed files with 50 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/sass/_panel-problems.scss
View File

@@ -27,6 +27,12 @@
&:hover {
border-left: solid 2px rgba($blue, 0.5);
.rt-tr {
background: $problems-table-row-hovered;
box-shadow: 0px 0px 5px rgba($blue, 0.5);
z-index: 1;
}
.rt-tr.-even {
margin-left: 0;
background: $problems-table-row-hovered;
@@ -38,6 +44,7 @@
.problem-details-container {
border-left-color: rgba($blue, 0.5);
box-shadow: 0px 0px 5px rgba($blue, 0.5);
}
}
@@ -46,11 +53,11 @@
border: 0;
}
&:hover {
background: $problems-table-row-hovered;
box-shadow: 0px 0px 5px rgba($blue, 0.5);
z-index: 1;
}
// &:hover {
// background: $problems-table-row-hovered;
// box-shadow: 0px 0px 5px rgba($blue, 0.5);
// z-index: 1;
// }
&.-even {
background: $problems-table-stripe;
@@ -228,6 +235,12 @@
margin-top: auto;
}
.problem-item {
// border-bottom: solid 2px transparent;
// &:hover {
// border-bottom: solid 2px $blue;
// }
.problem-item-name {
color: $text-muted;
}
@@ -235,6 +248,8 @@
.problem-item-value {
font-weight: 500;
}
}
.problem-statusbar {
// margin-top: auto;
@@ -267,7 +282,7 @@
}
}
&.fired {
box-shadow: 0px 0px 10px rgba($problem-statusbar-fired, 0.1);
box-shadow: $problem-statusbar-glow;
.fa-icon-container {
color: $problem-statusbar-fired;
text-shadow: 0px 0px 10px rgba($problem-statusbar-fired, 0.5);
@@ -304,17 +319,17 @@
.problem-details-middle {
flex: 1 0 auto;
padding: 0.6rem 1rem;
// border: 1px solid $dark-4;
border-width: 0 1px;
border-style: solid;
border-color: $dark-4;
overflow: auto;
box-shadow: 1px 0 10px $problem-container-shadow;
}
.problem-ack-container {
padding: 1.2rem 0;
margin-top: 0.6rem;
margin-left: -0.6rem;
padding: 1.2rem 0.6rem;
// border-top: 2px solid $dark-4;
overflow: auto;
box-shadow: -2px 2px 10px $problem-container-shadow
}
.problem-ack-list {
@@ -349,6 +364,17 @@
.problem-details-right-item {
margin-bottom: 0.2rem;
// border-bottom: solid 2px transparent;
&:hover {
// box-shadow: 1px 0 10px $problem-container-shadow;
// border-bottom: solid 2px $blue;
color: $text-color-emphasis;
.fa-icon-container {
color: $text-color-emphasis;
}
}
}
}

4
src/sass/_variables.dark.scss
View File

@@ -8,8 +8,12 @@ $problems-border-color: $dark-1;
$problems-table-stripe: $dark-3;
$problems-table-row-hovered: darken($problems-table-stripe, 2%);
$problem-details-background: $dark-3;
$problem-statusbar-background: $dark-2;
$problem-statusbar-muted: $dark-3;
$problem-statusbar-fired: $orange;
$problem-statusbar-glow: 0px 0px 10px rgba($problem-statusbar-fired, 0.1);
$problem-event-highlighted: $white;
$problem-expander-highlighted: lighten($problems-table-stripe, 8%);
$problem-container-shadow: rgba($gray-2, 0.2)

4
src/sass/_variables.light.scss
View File

@@ -8,8 +8,12 @@ $problems-border-color: $dark-1;
$problems-table-stripe: $gray-6;
$problems-table-row-hovered: $gray-4;
$problem-details-background: $gray-6;
$problem-statusbar-background: $gray-4;
$problem-statusbar-muted: $gray-5;
$problem-statusbar-fired: #ca4c17;
$problem-statusbar-glow: inset 0px 0px 10px rgba($problem-statusbar-fired, 0.5);
$problem-event-highlighted: $white;
$problem-expander-highlighted: darken($problems-table-stripe, 20%);
$problem-container-shadow: rgba($gray-2, 0.5)