Added confirmation page for monitoring + a few tweaks.
This commit is contained in:
parent
1b173b79d4
commit
0bdce5debb
24 changed files with 431 additions and 72 deletions
app/styles
|
@ -179,9 +179,9 @@ $state-warning-border: darken(adjust-hue($state-warning-bg, -10), 5%);
|
|||
$state-danger-text: darken($brand-danger, 10%);
|
||||
$state-danger-bg: lighten($brand-danger, 30%);
|
||||
$state-danger-border: darken(adjust-hue($state-danger-bg, -10), 3%);
|
||||
$state-success-text: darken($brand-success, 10%);
|
||||
$state-success-bg: lighten($brand-success, 30%);
|
||||
$state-success-border: darken(adjust-hue($state-success-bg, -10), 5%);
|
||||
$state-success-text: darken($brand-success, 20%);
|
||||
$state-success-bg: lighten($brand-success, 35%);
|
||||
$state-success-border: darken(adjust-hue($state-success-bg, -10), 7%);
|
||||
$state-info-text: darken($brand-info, 20%);
|
||||
$state-info-bg: lighten($brand-info, 30%);
|
||||
$state-info-border: darken(adjust-hue($state-info-bg, -10), 10%);
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
@import "views/_newNodeForm";
|
||||
@import "views/_updateNodeForm";
|
||||
@import "views/_deleteNodeForm";
|
||||
@import "views/_confirmMonitoring";
|
||||
@import "views/directives/_help";
|
||||
@import "views/directives/_nodeForm";
|
||||
@import "views/directives/_nodeSaved";
|
||||
|
|
55
app/styles/views/_confirmMonitoring.scss
Normal file
55
app/styles/views/_confirmMonitoring.scss
Normal file
|
@ -0,0 +1,55 @@
|
|||
.confirm-monitoring {
|
||||
@extend .jumbotron, .container;
|
||||
|
||||
.actions {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.back-button {
|
||||
@extend .btn, .btn-lg, .btn-info;
|
||||
}
|
||||
|
||||
.summary {
|
||||
@extend .well;
|
||||
|
||||
display: table;
|
||||
margin: {
|
||||
left: auto;
|
||||
right: auto;
|
||||
top: 30px;
|
||||
bottom: 30px;
|
||||
};
|
||||
|
||||
border: 3px dashed $gray;
|
||||
|
||||
.icon {
|
||||
@extend .fa, .fa-heartbeat;
|
||||
|
||||
display: table-cell;
|
||||
|
||||
color: $brand-primary;
|
||||
font-size: 64px;
|
||||
}
|
||||
|
||||
.node {
|
||||
@extend .dl-horizontal;
|
||||
|
||||
display: table-cell;
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
font-family: monospace;
|
||||
font-size: 24px;
|
||||
|
||||
dt {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
dd {
|
||||
text-overflow: ellipsis;
|
||||
margin-left: 120px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -10,7 +10,7 @@
|
|||
}
|
||||
|
||||
.actions {
|
||||
margin-bottom: 10px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.token-hint {
|
||||
|
@ -24,18 +24,32 @@
|
|||
}
|
||||
|
||||
.summary {
|
||||
.node {
|
||||
@extend .well;
|
||||
@extend .well;
|
||||
|
||||
border: 3px dashed $gray;
|
||||
font-family: monospace;
|
||||
font-size: 32px;
|
||||
}
|
||||
display: table;
|
||||
|
||||
margin: {
|
||||
left: auto;
|
||||
right: auto;
|
||||
top: 30px;
|
||||
bottom: 30px;
|
||||
}
|
||||
|
||||
border: 3px dashed $gray;
|
||||
font-family: monospace;
|
||||
font-size: 32px;
|
||||
|
||||
.icon {
|
||||
@extend .fa, .fa-trash;
|
||||
|
||||
display: table-cell;
|
||||
|
||||
padding-right: 18px;
|
||||
}
|
||||
|
||||
.node {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
|
||||
.back-button {
|
||||
|
|
|
@ -55,26 +55,47 @@ f-node-form {
|
|||
color: $brand-primary;
|
||||
}
|
||||
|
||||
.monitoring-active-info {
|
||||
@extend .alert-success;
|
||||
}
|
||||
|
||||
.monitoring-confirmation-info {
|
||||
@extend .alert, .alert-info;
|
||||
@extend .alert-info;
|
||||
}
|
||||
|
||||
.monitoring-confirmation-pending-info {
|
||||
@extend .alert, .alert-warning;
|
||||
@extend .alert-warning;
|
||||
}
|
||||
|
||||
.monitoring-confirmation-info, .monitoring-confirmation-pending-info {
|
||||
.monitoring-active-info,
|
||||
.monitoring-confirmation-info,
|
||||
.monitoring-confirmation-pending-info {
|
||||
@extend .alert;
|
||||
|
||||
display: table;
|
||||
|
||||
.icon, .message {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.icon {
|
||||
@extend .fa, .fa-exclamation-triangle;
|
||||
@extend .fa;
|
||||
|
||||
font-size: 24px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon, .message {
|
||||
display: table-cell;
|
||||
.monitoring-active-info {
|
||||
.icon {
|
||||
@extend .fa-heartbeat;
|
||||
}
|
||||
}
|
||||
|
||||
.monitoring-confirmation-info,
|
||||
.monitoring-confirmation-pending-info {
|
||||
.icon {
|
||||
@extend .fa-exclamation-triangle;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue