diff options
Diffstat (limited to '')
-rw-r--r-- | public/css/module.less | 285 |
1 files changed, 285 insertions, 0 deletions
diff --git a/public/css/module.less b/public/css/module.less new file mode 100644 index 0000000..9c86a8f --- /dev/null +++ b/public/css/module.less @@ -0,0 +1,285 @@ +@color-priority-emergency: #ff2200; +@color-priority-emergency-fg: white; +@color-priority-alert: #ff4400; +@color-priority-alert-fg: white; +@color-priority-critical: #ff6600; +@color-priority-critical-fg: white; +@color-priority-error: #ff8800; +@color-priority-error-fg: white; +@color-priority-warning: #ffaa44; // same as @color-warning +@color-priority-warning-fg: #6d572b; +@color-priority-notice: #44bb77; // same as @color-ok; +@color-priority-notice-fg: white; +@color-priority-information: #aaaaff; +@color-priority-information-fg: #32486d; +@color-priority-debug: #ccc; +@color-priority-debug-fg: #333; + +h2 { + margin-top: 1em; +} + +.events-table, .event-summary-table { + border-collapse: separate; + border-spacing: 0 1px; + padding: 0; +} + +.ack-col { + color: @icinga-blue; +} + +.priority-col { + width: 8em; + border-left: 5px solid; + white-space: nowrap; + text-align: center; + margin-right: 1em; + padding: 0.33em 1em; + + &.emergency { + border-left-color: @color-priority-emergency; + background-color: @color-priority-emergency; + color: @color-priority-emergency-fg; + + &.ack { + color: inherit; + background-color: inherit; + } + } + + &.critical { + border-left-color: @color-priority-critical; + background-color: @color-priority-critical; + color: @color-priority-critical-fg; + + &.ack { + color: inherit; + background-color: inherit; + } + } + + &.alert { + border-left-color: @color-priority-alert; + background-color: @color-priority-alert; + color: @color-priority-alert-fg; + + &.ack { + color: inherit; + background-color: inherit; + } + } + + &.error { + border-left-color: @color-priority-error; + background-color: @color-priority-error; + color: @color-priority-error-fg; + + &.ack { + color: inherit; + background-color: inherit; + } + } + + &.warning { + border-left-color: @color-priority-warning; + background-color: @color-priority-warning; + color: @color-priority-warning-fg; + + &.ack { + color: inherit; + background-color: inherit; + } + } + + &.notice { + border-left-color: @color-priority-notice; + } + + &.information, &.info { + border-left-color: @color-priority-information; + } + + &.debug { + border-left-color: @color-priority-debug; + } +} + +.comment-link { + .button-link(); + + margin-top: 0.5em; +} + +.quick-filter-controls { + margin-top: 0.5em; + text-align: center; +} + +.ack-filter-form { + margin-left: 0.5em; +} + +.severity-filter-form { + .control-label-group { + display: none; + } + + .control-group { + display: inline-block; + padding: 0; + } + + .active { + font-weight: bold; + } + + .emergency.active { + background-color: @color-priority-emergency; + border-color: @color-priority-emergency; + color: @color-priority-emergency-fg; + } + + .alert.active { + background-color: @color-priority-alert; + border-color: @color-priority-alert; + color: @color-priority-alert-fg; + } + + .critical.active { + background-color: @color-priority-critical; + border-color: @color-priority-critical; + color: @color-priority-critical-fg; + } + + .error.active { + background-color: @color-priority-error; + border-color: @color-priority-error; + color: @color-priority-error-fg; + } + + .warning.active { + background-color: @color-priority-warning; + border-color: @color-priority-warning; + color: @color-priority-warning-fg; + } + + .notice.active { + background-color: @color-priority-notice; + border-color: @color-priority-notice; + color: @color-priority-notice-fg; + } + + .information.active, .info.active { + background-color: @color-priority-information; + border-color: @color-priority-information; + color: @color-priority-information-fg; + } + + .debug.active { + background-color: @color-priority-debug; + border-color: @color-priority-debug; + color: @color-priority-debug-fg; + } +} + +.events-table, .event-summary-table { + .event-message { + max-width: 60em; + font-family: @font-family-fixed; + } +} + +.event-message { + &.detail { + font-size: 1.2em; + border-left: 5px solid #eee; + padding: 0.66em 0.33em; + } + + a { + font-weight: bold; + } +} + +.event-summary-table { + .event-host_address { + font-family: @font-family-fixed; + font-size: 0.9em; + color: @gray; + } +} + +a.action-link { + color: @icinga-blue !important; + margin-right: 1em; +} + +.name-value-table { + th { + width: 8em; + } +} + +.comments-table { + width: auto; + + tr { + border-bottom: none; + } + + td { + padding: 0.5em 0.5em; + } + + .comment-created { + white-space: nowrap; + } + .comment-type { + max-width: 2em; + } + .comment-message { + min-width: 30em; + font-family: @font-family-fixed; + } +} + +.comment-form { + select { + width: auto; + } + + input[name=comment] { + width: 25em; + } + + input[type=submit] { + padding: 0.2em 0.5em; + } +} + +div.warning { + display: inline-block; + font-size: 1.2em; + font-weight: bold; + border: 1px solid @color-priority-warning; + border-left: 5px solid @color-priority-warning; + margin: 0.5em 0; + padding: 0.3em 0.5em; +} + +.copyable-actions { + margin-bottom: 0.5em; +} + +input[type=submit].disabled, +button.disabled { + border-color: @gray-light !important; + background-color: white !important; + color: @gray-light !important; + + &:hover { + background: @gray-light !important; + color: white; + } +} |