diff --git a/doc/Icinga-Design/documentation.html b/doc/Icinga-Design/documentation.html index 3e2ff269a..c91ff303f 100644 --- a/doc/Icinga-Design/documentation.html +++ b/doc/Icinga-Design/documentation.html @@ -298,10 +298,6 @@ - - - - @@ -314,54 +310,6 @@ code... - -

Form Elements

- -

Select

-
- Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. -
- -
-
-
- - -
-
- - -
-
-
-
-
-
- - -
-
- -
- -
-
- - -

Pagination

@@ -422,7 +370,184 @@ code... +

Details

+

Basic Example

+
+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. +
+ +
+
+
+ + +
+
+ Host Status host_000 ölaierjoe paeurüuaeraeüure - Unreachable since 15:59
+
+
+ +
+ +
+

host_000 (checked by localhost.localdomain) OK: random hostcheck ok sometimes with multiline and html tags\n

+
+ +
+ Recheck +
+ + +
+
+ Last Check +
+
+ 1381308168 +
+
+ +
+
+ Next Check +
+
+ 1381309978 +
+
+ +
+
+ + +
+
+ Host Address +
+
+ 127.0.0.1 +
+
+ +
+
+ Alias +
+
+ random_000 +
+
+ + +
+ View Services For This Host + Recheck All Services +
+
+ + + + + +
+
+ Lorem Ipsum
+
+
+ +
+ +
+
+ Lorem ipsum +
+
+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr +
+
+ +
+
+ +
+
+ Lorem ipsum +
+
+ Lorem ipsum dolor sit amet bla blubb. +
+
+ + +
+
+ + + +
+ + + + + + +
+
+ +
+ +
+
+ + + + +

Form Elements

+ +

Select

+
+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. +
+ +
+
+
+ + +
+
+ + +
+
+
+
+
+
+ + +
+
+ +
+ +
+

Buttons

diff --git a/doc/Icinga-Design/icinga-design.css b/doc/Icinga-Design/icinga-design.css index 3fdd388b2..dc641dfd8 100644 --- a/doc/Icinga-Design/icinga-design.css +++ b/doc/Icinga-Design/icinga-design.css @@ -20,6 +20,10 @@ p { line-height: 18px; } +.gap { + margin-bottom: 15px; +} + /* ========================================================================== Links @@ -299,6 +303,43 @@ select.input-sm { } +/* Borders for Detail Headers */ + +.border-status-critical { + border-left: 8px solid #FF3300; +} + +.border-status-ok { + border-left: 10px solid #00CC33; +} + +.border-status-warning { + border-left: 10px solid #FFA500; +} + +.border-status-unknown { + border-left: 10px solid #E066FF; +} + +/** Host status **/ + +.border-status-unreachable { + border-left: 10px solid #E066FF; +} + +.border-status-down { + border-left: 10px solid #FF3300; +} + +.border-status-up { + background-color: #00CC33; +} + + + + + + /* ========================================================================== Icons @@ -308,21 +349,220 @@ select.input-sm { width: 16px; height: 20px; display: block; + background-position: 50% 0; } +.icon-header { + background-position: 0 50%; + padding-left: 25px; + height: 20px; +} + +.icon-btn-small { + background-position: 0 0; + width: 16px; + height: 16px; + display: block; +} + + .icon-flapping { background-image: url('images/flapping.png'); background-repeat: no-repeat; - background-position: 50% 0; - } .icon-comment { background-image: url('images/comment.png'); background-repeat: no-repeat; - background-position: 0 0; } .icon-unhandled { background-image: url('images/unhandled.png'); background-repeat: no-repeat; - background-position: 0 0; -} \ No newline at end of file +} +.icon-host { + background-image: url('images/host.png'); + background-repeat: no-repeat; +} +.icon-acknowledgement { + background-image: url('images/acknowledgement.png'); + background-repeat: no-repeat; +} +.icon-remove { + background-image: url('images/remove.png'); + background-repeat: no-repeat; +} +.icon-submit { + background-image: url('images/submit.png'); + background-repeat: no-repeat; +} +.icon-create { + background-image: url('images/create.png'); + background-repeat: no-repeat; +} +.icon-dashboard { + background-image: url('images/dashboard.png'); + background-repeat: no-repeat; +} +.icon-disable { + background-image: url('images/disable.png'); + background-repeat: no-repeat; +} +.icon-edit { + background-image: url('images/edit.png'); + background-repeat: no-repeat; +} +.icon-error { + background-image: url('images/error.png'); + background-repeat: no-repeat; +} +.icon-downtime { + background-image: url('images/in_downtime.png'); + background-repeat: no-repeat; +} +.icon-save { + background-image: url('images/save.png'); + background-repeat: no-repeat; +} +.icon-service { + background-image: url('images/service.png'); + background-repeat: no-repeat; +} +.icon-user { + background-image: url('images/user.png'); + background-repeat: no-repeat; +} +.icon-reschedule { + background-image: url('images/reschedule.png'); + background-repeat: no-repeat; +} + + +/* ========================================================================== + Details Panel + ========================================================================== */ + + +.panel-heading { + border-bottom: 0; + margin-bottom: 0px !important; + padding-left: 5px; + padding-bottom: 3px; + padding-top: 5px; + overflow: hidden; + border-radius: 0; +} + +.panel-hostname { + font-weight: bold; +} + +.separator { + border-top: 2px solid #ddd; + border-bottom: 0; + margin: 0; + height: 2px; +} + +.panel-header-status { + font-weight: normal; +} + +.panel-row { + display: block; + margin-bottom: 10px; + overflow: hidden; + border-bottom: 1px dotted #ddd; + padding-bottom: 10px; +} + + +.panel-label { + float: left; + padding-right: 10px; + width: 30%; + clear: left; + +} +.panel-content { + float: left; + padding-right: 10px; + display: inline-block; + max-width: 40%; +} + +.panel-button { + float: right; + display: inline-block; + overflow: hidden; +} + +.panel-body { + margin-bottom: 45px; +} + + + +/* ========================================================================== + Buttons + ========================================================================== */ + +.button { + text-align: center; + padding: 3px; + border-width: 1px; + border-style: solid; + border-radius: 3px; +} + +.btn-common { + border-color: #ddd; + color: #262625; + background: rgb(255,255,255); /* Old browsers */ + background: -moz-linear-gradient(top, rgb(255,255,255) 1%, rgb(245,245,245) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(255,255,255)), color-stop(100%,rgb(245,245,245))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* IE10+ */ + background: linear-gradient(to bottom, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* W3C */ +} + +.panel-row > a:hover, +.btn-common:hover { + border-color: #262625 !important; + color: #262625 !important; + text-decoration: none; +} + + +.btn-cta { + border-color: #049BAF; + color: #049BAF; + background: rgb(255,255,255); /* Old browsers */ + background: -moz-linear-gradient(top, rgb(255,255,255) 1%, rgb(245,245,245) 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgb(255,255,255)), color-stop(100%,rgb(245,245,245))); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* IE10+ */ + background: linear-gradient(to bottom, rgb(255,255,255) 1%,rgb(245,245,245) 100%); /* W3C */ +} + + + +.btn-small { + width: 25px; + height: 25px; + display: inline-block; +} + +.btn-wide { + width: 100%; + display: block; +} + +.btn-half-left { + float: left; + width: 48%; +} +.btn-half-right { + float: right; + width: 48%; +} \ No newline at end of file diff --git a/doc/Icinga-Design/images/host.png b/doc/Icinga-Design/images/host.png new file mode 100644 index 000000000..12eb9a6b9 Binary files /dev/null and b/doc/Icinga-Design/images/host.png differ diff --git a/doc/Icinga-Design/images/reschedule.png b/doc/Icinga-Design/images/reschedule.png new file mode 100644 index 000000000..5efc20dbc Binary files /dev/null and b/doc/Icinga-Design/images/reschedule.png differ