summaryrefslogtreecommitdiffstats
path: root/public/css/module.less
diff options
context:
space:
mode:
Diffstat (limited to 'public/css/module.less')
-rw-r--r--public/css/module.less1835
1 files changed, 1835 insertions, 0 deletions
diff --git a/public/css/module.less b/public/css/module.less
new file mode 100644
index 0000000..1f11251
--- /dev/null
+++ b/public/css/module.less
@@ -0,0 +1,1835 @@
+div.action-bar a:focus, .tabs a:focus {
+ outline: none;
+ text-decoration: underline;
+
+ &:before {
+ text-decoration: none;
+ }
+}
+
+table.common-table td {
+ padding-top: 0.2em;
+ padding-bottom: 0.2em;
+ vertical-align: middle;
+
+ p {
+ word-break: break-word;
+ }
+}
+
+#layout.minimal-layout table.common-table td {
+ padding-top: 0.5em;
+ padding-bottom: 0.5em;
+}
+
+table.common-table thead th {
+ border-bottom: 1px solid @text-color;
+}
+table.common-table tbody td {
+ border-bottom: 1px solid @gray-lighter;
+}
+
+a:before {
+ text-decoration: none;
+}
+
+form.director-form {
+ max-width: 68em;
+}
+
+form.director-form:focus {
+ outline: none;
+}
+
+div.action-bar a, div.action-bar form i {
+ color: @icinga-blue;
+}
+
+div.action-bar > a {
+ margin-right: 1em;
+}
+
+.controls > .pagination-control li > a {
+ padding: 0.5em 0 0.5em 0;
+}
+
+.controls > .pagination-control > ul {
+ float: right;
+}
+
+div.action-bar {
+ .pagination-control {
+ float: none;
+ clear: none;
+ display: inline-block;
+ line-height: inherit;
+ margin: 0;
+ vertical-align: middle;
+ }
+
+ form.director-form input {
+ margin: 0;
+ }
+ input {
+ max-width: unset;
+ }
+ select {
+ line-height: 1.25em;
+ }
+}
+
+div.action-bar ul {
+ padding: 0;
+ margin: 0;
+
+ li {
+ list-style-type: none;
+ a { display: block; }
+ }
+}
+
+div.action-bar > ul {
+ display: inline-block;
+}
+
+div.action-bar > ul ul {
+ padding: 0.5em 0em 1em 0em;
+ min-width: 10em;
+ position: absolute;
+ display: none;
+ color: @text-color-inverted;
+ background-color: @icinga-blue;
+
+ a {
+ display: block;
+ padding: 0.3em 2em 0.3em 2em;
+ margin: 0;
+ outline: none;
+ color: @text-color-inverted;
+
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+
+ li.active a {
+ font-weight: bold;
+ }
+}
+
+div.action-bar > ul > li:hover ul {
+ display: block;
+}
+div.action-bar > ul > li > a {
+ padding: 0.2em 0.5em;
+}
+div.action-bar > ul > li:hover {
+ background-color: @icinga-blue;
+ & > a {
+ color: @text-color-inverted;
+ text-decoration: none;
+ }
+}
+
+#layout.twocols div.action-bar .pagination-control {
+ li {
+ display: none;
+ }
+
+ li:nth-child(1), li.active, li:last-child {
+ display: list-item;
+ }
+
+ li.active a {
+ border-bottom: none;
+ }
+}
+
+.content a {
+ color: @icinga-blue;
+ &:hover {
+ text-decoration: underline;
+ }
+}
+
+p {
+ max-width: 56em;
+}
+
+table.common-table {
+ max-width: 68em;
+
+ a {
+ color: inherit;
+ text-decoration: none;
+ }
+
+ th {
+ padding-top: 0.5em;
+ }
+ td {
+ vertical-align: top;
+ }
+
+ pre {
+ margin: 0;
+ padding: 0.2em;
+ max-height: 10em;
+ background: none;
+ overflow: auto;
+ word-break: keep-all;
+ white-space: pre;
+ display: inline-block;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ &::-webkit-scrollbar {
+ display: none;
+ }
+ }
+}
+
+table.history {
+ td:last-of-type {
+ text-align: right;
+ }
+}
+
+span.disabled {
+ cursor: no-drop;
+ color: @gray-light;
+}
+
+.controls span.action-links {
+ display: block;
+ margin-bottom: 0.5em;
+ a {
+ color: @icinga-blue;
+ margin-right: 1em;
+ }
+ form.director-form {
+ display: inline;
+ margin-right: 1em;
+ }
+}
+
+.action-bar {
+ form.director-form {
+ display: inline;
+ margin-right: 1em;
+ }
+}
+
+pre.disabled {
+ color: @disabled-gray;
+}
+
+form.director-form i.link-color::before {
+ color: @icinga-blue;
+}
+
+/* TODO: remove this, but autosubmit looks ugly otherwise */
+form.director-form input[disabled] {
+ background: inherit;
+}
+/* END OF TODO */
+
+pre {
+ background: none;
+}
+
+pre.logfile {
+ font-size: 0.875em;
+ padding: 1em;
+ background: @gray-lighter;
+ color: @gray;
+ overflow: auto;
+ white-space: pre;
+
+ a {
+ color: @link-color;
+ }
+
+ .loglevel, .application {
+ font-weight: bold;
+ }
+
+ .critical {
+ color: @color-critical;
+ }
+
+ .warning {
+ color: @color-warning;
+ }
+
+ .information {
+ color: @color-ok;
+ }
+
+ .notice {
+ // color: @color-ok;
+ }
+
+ .debug {
+ color: @color-pending;
+ }
+
+ .error-hint {
+ color: @text-color;
+ font-weight: 900;
+ }
+}
+
+pre.generated-config {
+
+ a {
+ color: @link-color;
+ font-weight: bold;
+ }
+
+ .highlight {
+ border-bottom: 1px dashed @gray-light;
+ &::before {
+ // icon: right-big
+ font-family: 'ifont';
+ content: '\e826';
+ margin-left: -1em;
+ padding-top: 0em;
+ float: left;
+ }
+
+ &.critical::before {
+ color: @color-critical;
+ }
+ &.warning::before {
+ color: @color-warning;
+ }
+ &.ok::before {
+ color: @color-ok;
+ }
+ }
+}
+
+pre.agent-deployment-instructions {
+ color: @text-color;
+ height: 14em;
+ overflow: scroll;
+}
+
+table.avp th {
+ font-size: inherit;
+}
+
+.content form.director-form {
+ margin-top: 0.5em;
+ margin-bottom: 2em;
+}
+
+.content form.director-form.inline {
+ margin: 0;
+
+ i.icon::before {
+ color: @icinga-blue;
+ }
+}
+
+.invisible {
+ position: absolute;
+ left: -100%;
+}
+
+form.director-form input[type=file] {
+ padding-right: 1em;
+}
+
+
+form.director-form input[type=submit] {
+ .button();
+ border-width: 1px;
+ margin-top: 0.5em;
+
+ &:disabled {
+ border-color: @gray-light;
+ background-color: @gray-light;
+ color: @disabled-gray;
+ }
+}
+
+form.director-form input[type=submit]:first-of-type {
+ border-width: 2px;
+}
+
+form.director-form input[type=submit].link-button {
+ color: @icinga-blue;
+ background: none;
+ border: none;
+ font-weight: normal;
+ padding: 0;
+ margin: 0;
+
+ text-align: left;
+
+ &:hover {
+ text-decoration: underline;
+ }
+}
+
+form.director-form p.description {
+ padding: 1em 1em;
+ margin: 0;
+ font-style: italic;
+ width: 100%;
+}
+
+form.director-form {
+ input[type=text], input[type=button], select, select option, textarea {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ }
+}
+
+form.director-form ul.form-errors {
+ list-style-type: none;
+ margin-bottom: 0.5em;
+ padding: 0;
+
+ ul.errors {
+ list-style-type: none;
+ padding: 0;
+ }
+
+ ul.errors li {
+ background: @color-critical;
+ font-weight: bold;
+ padding: 0.5em 1em;
+ color: @text-color-inverted;
+ }
+}
+
+form.director-form {
+ select::-ms-expand, input::-ms-expand, textarea::-ms-expand { /* for IE 11 */
+ display: none;
+ }
+
+ select {
+ border: 1px solid @gray-light;
+ cursor: pointer;
+ background: none;
+ }
+
+ input[type=text], input[type=password], textarea, select {
+ max-width: 36em;
+ min-width: 20em;
+ width: 100%;
+ line-height: 2em;
+ height: 2.4em;
+ padding-left: 0.5em;
+ border-style: solid;
+ border-color: transparent;
+ border-bottom-color: @gray-lighter;
+ border-width: 1px 1px 1px 3px;
+ background-color: @low-sat-blue;
+
+ &.search {
+ background: transparent url("../img/icons/search.png") no-repeat scroll 0.5em center / 1em 1em;
+ padding-left: 2em;
+ }
+ }
+
+ textarea {
+ max-width: 100%;
+ }
+
+ select[multiple] {
+ height: auto;
+ }
+
+ select option {
+ height: 2em;
+ padding-top: 0.3em;
+ }
+
+ select[multiple=multiple] {
+ height: auto;
+ }
+
+ label {
+ line-height: 2em;
+ }
+}
+
+form.director-form dl {
+ margin: 0;
+ padding: 0;
+}
+
+.strike-links a, table.common-table .strike-links a {
+ text-decoration: line-through;
+ &:hover {
+ text-decoration: line-through;
+ }
+}
+.strike-links span.ro-service {
+ text-decoration: line-through;
+}
+
+// TODO: figure out whether form.editor and filter-related CSS is still required
+div.filter > form.search, div.filter > a {
+ // Duplicated by quicksearch
+ display: none;
+}
+
+div.filter form.editor > ul.tree ul li.active {
+ background-color: @tr-hover-color;
+}
+
+div.filter form.editor {
+ padding-top: 1em;
+ select, input[type=text] {
+ line-height: unset;
+ height: auto;
+ }
+}
+
+form.director-form.editor {
+ select, input[type=text] {
+ background: @low-sat-blue;
+ max-width: unset;
+ min-width: unset;
+ width: auto;
+ }
+ .tree li a {
+ padding: 0;
+ }
+}
+
+ul.extensible-set {
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ display: inline-block;
+ width: 100%;
+ max-width: 36em;
+ min-width: 20em;
+ border-bottom: 1px solid @gray-lighter;
+
+ input[type=text], input[type=password], textarea, select {
+ border-color: transparent;
+ }
+
+ li {
+ display: inline;
+ }
+
+ select {
+ width: 100%;
+ }
+
+ input[type=text] {
+ background-color: @low-sat-blue;
+ .rounded-corners(0.5em);
+ border: 1px solid transparent;
+ padding: 0.1em 0.3em;
+ margin: 0.2em 0.2em;
+ width: 30%;
+ min-width: 4em;
+ text-overflow: ellipsis;
+ }
+
+ span.inline-buttons {
+ position: absolute;
+ z-index: 10;
+ right: 0.225em;
+ top: -0.275em;
+ input[type=submit] {
+ font-family: 'ifont';
+ width: 2em;
+ height: 2em;
+ font-size: 1em;
+ margin-left: 0.2em;
+ padding: 1px 0 1px 0;
+ }
+ }
+
+ select.extend-set, input.extend-set {
+ display: none;
+ }
+}
+
+form.director-form {
+ #_FAKE_SUBMIT {
+ position: absolute;
+ left: -100%;
+ }
+}
+
+form.director-form dd.active ul.extensible-set, ul.extensible-set.sortable {
+
+ li {
+ display: list-item;
+ position: relative;
+ clear: both;
+ }
+
+ input[type=text], select {
+ width: 100%;
+ }
+
+ input[type=text] {
+ background-color: @low-sat-blue;
+ .rounded-corners(0);
+ border: 1px solid @gray-light;
+ padding: 0.25em 0.5em;
+ margin: 0;
+ }
+}
+
+form.director-form dd.active ul.extensible-set {
+ border: 1px solid @icinga-blue;
+
+ input[type=submit]:first-of-type {
+ border-width: 1px;
+ }
+
+ select.extend-set, input.extend-set {
+ display: inline;
+ }
+}
+
+form.director-form {
+ select::-moz-focus-inner {
+ border: 0;
+ }
+
+ select:-moz-focusring {
+ color: transparent;
+ text-shadow: 0 0 0 #000;
+ }
+
+ select, input[type=text], textarea {
+ &:hover {
+ border-style: dotted solid dotted solid;
+ border-color: @gray-light;
+ }
+
+ &:focus, &:focus:hover {
+ border-style: solid;
+ border-color: @icinga-blue;
+ outline: none;
+ }
+ }
+
+ select option {
+ padding-left: 0.5em;
+ }
+
+ select option[value=""] {
+ color: @disabled-gray;
+ background-color: @low-sat-blue;
+ }
+}
+
+a {
+ &.state-critical {
+ color: @color-critical;
+ }
+
+ &.state-warning {
+ color: @color-warning;
+ }
+
+ &.state-ok {
+ color: @color-ok;
+ }
+
+ &.state-unknown {
+ color: @color-unknown;
+ }
+
+ &.state-pending {
+ color: @color-pending;
+ }
+}
+ul.tabs a.state-critical {
+ background-color: @color-critical;
+ font-weight: bold;
+ color: @text-color-inverted;
+}
+ul.tabs a.state-warning {
+ background-color: @color-warning;
+ font-weight: bold;
+ color: @text-color-inverted;
+}
+ul.tabs a.state-ok {
+ background-color: @color-ok;
+ font-weight: bold;
+ color: @text-color-inverted;
+}
+ul.tabs a.state-unknown {
+ background-color: @color-unknown;
+ font-weight: bold;
+ color: @text-color-inverted;
+}
+
+a:hover::before {
+ text-decoration: none;
+}
+
+ul.main-actions {
+ margin: 0;
+ padding: 0;
+ min-width: 38em;
+ max-width: 64em;
+
+ li {
+ list-style-type: none;
+
+ text-align: left;
+ display: inline-block;
+ padding: 0;
+ clear: both;
+ width: 18em;
+ min-width: 16em;
+ vertical-align: top;
+
+ a {
+ i {
+ font-size: 3em;
+ display: block;
+ float: left;
+ line-height: 1em;
+ margin-right: 0.3em;
+ color: @text-color-light;
+ }
+
+ &.state-critical i {
+ color: @color-critical;
+ }
+
+ &.state-warning i {
+ color: @color-warning;
+ }
+
+ &.state-ok i {
+ color: @color-ok;
+ }
+
+ &.state-unknown i {
+ color: @color-unknown;
+ }
+
+ &.state-pending i {
+ color: @color-pending;
+ }
+
+ border-left: 0.5em solid transparent;
+ padding: 1em;
+ color: @text-color;
+ font-weight: bold;
+ display: block;
+ text-decoration: none;
+ min-height: 12em;
+
+ overflow: hidden;
+
+ &.active {
+ border-color: @icinga-blue;
+ background-color: @tr-active-color;
+ }
+
+ &:hover {
+ background-color: @tr-hover-color;
+ text-decoration: none;
+ }
+
+ &:active, &:focus {
+ background-color: @tr-hover-color;
+ outline: none;
+ }
+ }
+
+ p {
+ font-weight: normal;
+ margin-bottom: 0.5em;
+ padding-left: 4.5em;
+ color: @text-color-light;
+ }
+ }
+}
+
+#layout.compact-layout.twocols ul.main-actions,
+#layout.minimal-layout ul.main-actions {
+ max-width: unset;
+ min-width: unset;
+ li {
+ width: 100%;
+ a {
+ height: auto;
+ min-height: unset;
+ }
+ > a > i {
+ font-size: 3em;
+ }
+
+ > a > p {
+ padding-left: 4.5em;
+ }
+ margin-bottom: 0.5em;
+ }
+}
+
+#layout.minimal-layout div.content form.director-form {
+ dt, dd {
+ display: block;
+ width: auto;
+ }
+ fieldset.collapsed {
+ dd, dt, ul, div {
+ display: none;
+ }
+ }
+ dt label {
+ color: @text-color;
+ }
+ fieldset {
+ min-width: unset;
+ }
+
+ input[type=text], input[type=password], textarea, select {
+ max-width: unset;
+ min-width: unset;
+ border-color: @gray-light;
+ }
+ dd.active {
+ input[type=text], input[type=password], textarea, select {
+ border-color: @icinga-blue;
+ }
+ }
+ ul.extensible-set {
+ max-width: unset;
+ }
+ dd ul.extensible-set {
+ border: 1px solid @gray-light;
+ }
+ dd.active ul.extensible-set {
+ border: 1px solid @icinga-blue;
+
+ input[type=submit]:first-of-type {
+ border-width: 1px;
+ }
+ }
+
+ dd.active ul.extensible-set, ul.extensible-set.sortable {
+ input[type=text], select {
+ width: 100%;
+ }
+
+ input[type=text] {
+ background-color: @low-sat-blue;
+ border: 1px solid @gray-light;
+ }
+ }
+
+}
+
+form.director-form fieldset {
+ margin: 0;
+ padding: 0 0 1.5em 0;
+ border: none;
+
+ legend {
+ margin: 0em 0 0.5em 0;
+ font-size: 1em;
+ border-bottom: 1px solid @gray-light;
+ font-weight: bold;
+ display: block;
+ width: 100%;
+ padding-left: 1em;
+ line-height: 2em;
+ cursor: pointer;
+ user-select: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+
+ &:hover {
+ border-color: @text-color;
+ }
+
+ &::before {
+ // icon: down-dir
+ font-family: 'ifont';
+ content: '\e81d';
+ margin-left: -1em;
+ padding-top: 0em;
+ float: left;
+ color: inherit;
+ }
+ }
+
+ &.collapsed {
+ legend {
+ margin: 0;
+ }
+
+ dd, dt, ul, div {
+ display: none;
+ }
+
+ legend::before {
+ // icon: right-dir
+ content: '\e820';
+ }
+
+ margin-bottom: 0.2em;
+ padding-bottom: 0;
+ }
+}
+
+
+/* BEGIN Forms */
+form.director-form dt label {
+ width: auto;
+ font-weight: normal;
+ font-size: inherit;
+
+ &.required {
+ &::after {
+ content: '*'
+ }
+ }
+
+ &:hover {
+ text-decoration: underline;
+ cursor: pointer;
+ }
+}
+
+form.director-form fieldset {
+ min-width: 36em;
+}
+
+form.director-form dd input.related-action[type='submit'] {
+ display: none;
+}
+
+form.director-form dd.active li.active input.related-action[type='submit'] {
+ display: inline-block;
+}
+
+form.director-form {
+ p.description {
+ color: @gray;
+ font-style: italic;
+ padding: 0.25em 0.5em;
+ display: none;
+ }
+
+ dd.active {
+ p.description {
+ font-style: normal;
+ display: block;
+ height: auto;
+ color: @text-color;
+ }
+ }
+}
+
+form.director-form.db-selector {
+ padding: 0;
+ margin: 0;
+ select {
+ float: right;
+ text-align: center;
+ max-width: 20em;
+ margin-top: 0.5em;
+ min-width: 14em;
+ width: auto;
+ }
+}
+
+// Adjustments for the legacy layout to keep backwards compatibility
+#layout.twocols > #main &#col1 {
+ width: 50%;
+}
+#layout.twocols > #main &#col2 {
+ width: 50%;
+}
+#layout.twocols > #main &#col1 + #col2 {
+ width: 50%;
+}
+
+// Adjustments for the flexbox layout
+#layout.twocols > #content-wrapper &#col2,
+#layout.twocols > #content-wrapper &#col1 + #col2 {
+ flex-grow: 1;
+}
+
+form.director-form dd {
+ padding: 0.3em 0.5em;
+ margin: 0;
+}
+
+form.director-form dt {
+ padding: 0.5em 0.5em;
+ margin: 0;
+}
+
+form.director-form dt.active, form.director-form dd.active {
+ background-color: @tr-active-color;
+}
+
+form.director-form dt {
+ display: inline-block;
+ vertical-align: top;
+ min-width: 12em;
+ min-height: 2.5em;
+ width: 30%;
+ &.errors label {
+ color: @color-critical;
+ }
+}
+
+form.director-form .errors label {
+ color: @color-critical;
+}
+
+form.director-form dd {
+ display: inline-block;
+ width: 63%;
+ min-height: 2.5em;
+ vertical-align: top;
+ margin: 0;
+ &.errors {
+ input[type=text], select {
+ border-color: @color-critical;
+ }
+ }
+
+ &.full-width {
+ padding: 0.5em;
+ width: 100%;
+ }
+}
+
+form.director-form dd:after {
+ display: block;
+ content: '';
+}
+
+form.director-form textarea {
+ height: auto;
+}
+
+form.director-form dd ul.errors {
+ list-style-type: none;
+ padding-left: 0.3em;
+
+ li {
+ color: @color-critical;
+ padding: 0.3em;
+ }
+}
+
+form.director-form div.hint {
+ padding: 1em;
+ background-color: @tr-hover-color;
+ margin: 1em 0;
+ max-width: 65em;
+ font-size: 1em;
+
+ pre {
+ font-style: normal;
+ background-color: @body-bg-color;
+ margin: 0;
+ padding: 1em;
+ }
+}
+
+/* END of Forms */
+
+ul.health-check-result {
+ list-style-type: none;
+ padding: 0;
+ margin-bottom: 2em;
+ li {
+ line-height: 2em;
+ }
+ .badge {
+ font-weight: bold;
+ }
+}
+
+.title-badges {
+ .badge {
+ font-size: 0.6em;
+ margin-left: 0.5em;
+ }
+}
+
+li.state {
+ border-left: 0.5em solid transparent;
+ margin-bottom: 0.5em;
+ padding-left: 1em;
+ &.state-ok {
+ border-color: @color-ok;
+ }
+ &.state-warning {
+ border-color: @color-warning;
+ }
+ &.state-critical {
+ border-color: @color-critical;
+ }
+ &.state-unknown {
+ border-color: @color-unknown;
+ }
+ &.state-pending {
+ border-color: @color-pending;
+ }
+}
+
+span.error {
+ color: @color-critical;
+
+ a {
+ color: @color-critical;
+ }
+}
+
+p.legacy-error {
+ color: @text-color-inverted;
+ padding: 1em 2em;
+ background-color: @color-critical;
+
+}
+
+table th.actions, table td.actions {
+ text-align: right;
+}
+
+table tr.disabled td {
+ color: @gray-light;
+ font-style: italic;
+}
+
+/* Simple table, test */
+table.syncstate {
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-help:
+ content: '\e85b';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.in-sync td:first-child::before {
+ content: '\e803';
+ color: @color-ok;
+ }
+
+ tr.pending-changes td:first-child::before {
+ content: '\e864';
+ color: @color-warning;
+ }
+
+ tr.failing td:first-child::before {
+ content: '\e804';
+ color: @color-critical;
+ }
+}
+
+table.jobs {
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-help:
+ content: '\e85b';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.ok td:first-child::before {
+ content: '\e803';
+ color: @color-ok;
+ }
+
+ tr.warning td:first-child::before {
+ content: '\e864';
+ color: @color-warning;
+ }
+
+ tr.pending td:first-child::before {
+ content: '\e864';
+ color: @color-pending;
+ }
+
+ tr.critical td:first-child::before {
+ content: '\e804';
+ color: @color-critical;
+ }
+}
+
+table.icinga-objects {
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-wrench:
+ content: '\e83d';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.icinga-object-external td:first-child::before {
+ color: @gray;
+ // icon-pin
+ content: '\e879';
+ }
+
+ tr.icinga-object td:first-child::before {
+ color: @text-color;
+ // icon-thumbs-up
+ // content: '\e867';
+ // icon-ok
+ content: '\e803';
+ }
+
+ tr.icinga-template td:first-child::before {
+ color: @gray-light;
+ // icon-paste
+ content: '\e817';
+ }
+
+ tr.icinga-apply td:first-child::before {
+ color: @text-color;
+ // resize-full-alt
+ content: '\e829';
+ }
+
+}
+
+div.content.compact table.icinga-objects thead {
+ display: none;
+}
+
+table.deployment-log {
+
+ tr td:nth-child(2), tr th:nth-child(2) {
+ text-align: right;
+ padding-right: 1em;
+ }
+
+ tr th:first-child {
+ padding-left: 2em;
+ }
+
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-help:
+ content: '\e85b';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.succeeded td:first-child::before {
+ // icon-ok
+ color: @color-ok;
+ content: '\e803';
+ }
+
+ tr.pending td:first-child::before {
+ color: @gray;
+ // icon-spinner
+ content: '\e874';
+ .animate(spin 2s infinite linear);
+ }
+
+ tr.failed td:first-child::before {
+ // icon-ok
+ color: @color-critical;
+ content: '\e804';
+ }
+
+ tr.running td, tr.running td a {
+ font-weight: bold;
+ }
+}
+
+th.table-header-day {
+ text-align: right;
+}
+
+table.activity-log {
+ td {
+ max-height: 2em;
+ }
+ tr th:first-child {
+ padding-left: 2em;
+ }
+
+ tr td:last-child {
+ text-align: right;
+ white-space: nowrap;
+ width:10%;
+ }
+
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-help:
+ content: '\e85b';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.action-create td:first-child::before {
+ // icon-plus
+ color: @color-pending;
+ content: '\e805';
+ }
+
+ tr.action-modify td:first-child::before {
+ // icon-wrench
+ color: @color-ok;
+ content: '\e83d';
+ }
+
+ tr.action-delete td:first-child::before {
+ // icon-cancel
+ color: @color-critical;
+ content: '\e804';
+ }
+
+ tr.undeployed td, tr.undeployed a {
+ color: @gray;
+ }
+
+ tr.undeployed {
+ background-color: @gray-lightest;
+ &.active {
+ background-color: @gray-lighter;
+ }
+ &[href]:hover {
+ background-color: @gray-light;
+ td, a {
+ color: @text-color;
+ }
+ }
+ }
+
+ tr.branched {
+ background-color: @gray-lightest;
+ color: @color-pending;
+ }
+
+ tr.undeployed td:first-child::before {
+ color: @gray;
+ }
+
+ div.range-comment-container {
+ width: 100%;
+ position: absolute;
+ height: 100%;
+ background: @body-bg-color;
+ border-radius: 1em;
+ }
+ a.range-comment {
+ width: 100%;
+ height: 100%;
+ display: block;
+ border-radius: 1em;
+ padding: 0.2em 1em;
+ vertical-align: middle;
+ &::-webkit-scrollbar {
+ display: none;
+ }
+ scrollbar-width: none;
+ -ms-overflow-style: none;
+ overflow-y:auto;
+ overflow-x:hidden;
+ word-break: break-word;
+ &:hover {
+ cursor: default;
+ text-decoration: none;
+ }
+ background: fade(@color-warning-handled, 20%);
+ &:hover {
+ background: fade(@color-warning-handled, 60%);
+ }
+ }
+ td.comment-cell {
+ padding: 0;
+ min-width: 10em;
+ width: 40%;
+ position: relative;
+ &.continuing div.range-comment-container {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+ a.range-comment {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+ }
+ &.continued div.range-comment-container {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+ a.range-comment {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+ }
+ }
+ }
+}
+
+tr.branch_modified {
+ color: @color-pending;
+}
+
+table.config-diff {
+
+ tr th:first-child {
+ padding-left: 2em;
+ }
+
+ tr td:first-child {
+ padding-left: 2em;
+ &::before {
+ font-family: 'ifont';
+ // icon-help:
+ content: '\e85b';
+ float: left;
+ font-weight: bold;
+ margin-left: -1.5em;
+ line-height: 1.5em;
+ }
+ }
+
+ tr.file-unmodified td:first-child::before {
+ // icon-ok
+ color: @color-ok;
+ content: '\e803';
+ }
+
+ tr.file-created td:first-child::before {
+ // icon-plus
+ color: @color-pending;
+ content: '\e805';
+ }
+
+ tr.file-removed td:first-child::before {
+ // icon-cancel
+ color: @color-critical;
+ content: '\e804';
+ }
+
+ tr.file-modified td:first-child::before {
+ // icon-flapping
+ color: @color-warning;
+ content: '\e85d';
+ }
+}
+
+input[type=submit].icon-button {
+ font-family: 'ifont';
+ font-weight: normal;
+ background: none;
+ border: none;
+ padding: 0.2em 0.4em 0.2em 0.4em;
+ margin: 0 0 0 0.2em;
+
+ &:hover {
+ background-color: @icinga-blue;
+ }
+
+ &:disabled {
+ background-color: unset;
+ color: @gray-light;
+ cursor: default;
+ }
+}
+
+/** BEGIN breadcrumb **/
+
+// Hint: .badges is unused right now
+.breadcrumb {
+ list-style: none;
+ overflow: hidden;
+ padding: 0;
+
+ .badges {
+ display: inline-block;
+ padding: 0 0 0 0.5em;
+ .badge {
+ line-height: 1.25em;
+ font-size: 0.8em;
+ border: 1px solid @text-color;
+ margin: -0.25em 1px 0 0;
+ }
+ }
+}
+
+.breadcrumb {
+ > .critical a { color: @text-color-inverted; background: @color-critical; }
+ > .critical.handled a { color: @text-color-inverted; background: @color-critical-handled; }
+ > .unknown a { color: @text-color-inverted; background: @color-unknown; }
+ > .unknown.handled a { color: @text-color-inverted; background: @color-unknown-handled; }
+ > .warning a { color: @text-color-inverted; background: @color-warning; }
+ > .warning.handled a { color: @text-color-inverted; background: @color-warning-handled; }
+ > .ok a { color: @text-color-inverted; background: @color-ok; }
+}
+
+.breadcrumb {
+ > .critical a:after { border-left-color: @color-critical; }
+ > .critical.handled a:after { border-left-color: @color-critical-handled; }
+ > .unknown a:after { border-left-color: @color-unknown; }
+ > .unknown.handled a:after { border-left-color: @color-unknown-handled; }
+ > .warning a:after { border-left-color: @color-warning; }
+ > .warning.handled a:after { border-left-color: @color-warning-handled; }
+ > .ok a:after { border-left-color: @color-ok; }
+}
+
+.breadcrumb:after {
+ content:'';
+ display:block;
+ clear: both;
+}
+.breadcrumb li {
+ float: left;
+ cursor: pointer;
+ user-select: none;
+ background: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+
+}
+.breadcrumb li a {
+ // color: white;
+ color: @icinga-blue;
+ margin: 0;
+ // font-size: 1.2em;
+ text-decoration: none;
+ padding-left: 2em;
+ // line-height: 1.5em;
+ // background: @icinga-blue;
+ border: 1px none @icinga-blue;
+ border-right-style: solid;
+ border-left-style: solid;
+ position: relative;
+ display: block;
+ float: left;
+ &:focus {
+ outline: none;
+ }
+ &:hover {
+ text-decoration: none;
+ }
+}
+.action-bar .breadcrumb li a {
+ padding-left: 2em;
+}
+
+.breadcrumb li a:before, .breadcrumb li a:after {
+ content: " ";
+ display: block;
+ width: 0;
+ height: 0;
+ border-top: 1.3em solid transparent;
+ border-bottom: 1.2em solid transparent;
+ position: absolute;
+ margin-top: -1.2em;
+ top: 50%;
+ left: 100%;
+}
+
+.breadcrumb li a:before {
+ border-left: 1.2em solid @icinga-blue;
+ margin-left: 1px;
+ z-index: 1;
+}
+
+.breadcrumb li a:after {
+ border-left: 1.2em solid @body-bg-color;
+ z-index: 2;
+}
+
+.breadcrumb li:first-child a {
+ padding-left: 1em;
+ padding-right: 0.5em;
+}
+.breadcrumb li:last-child a {
+ color: @text-color;
+}
+
+.breadcrumb li:not(:last-child) a:hover { background: @icinga-blue; color: @text-color-on-icinga-blue; }
+.breadcrumb li:not(:last-child) a:hover:after { border-left-color: @icinga-blue; }
+.breadcrumb li:last-child:hover, .breadcrumb li:last-child a:hover { background: transparent; text-decoration: underline; }
+
+.breadcrumb li a:focus {
+ text-decoration: underline;
+}
+/** END of breadcrumb **/
+
+
+
+ul.filter-root {
+ margin-top: 0;
+ width: 100%;
+ padding-left: 0.5em;
+ list-style-type: none;
+ ul {
+ list-style-type: none;
+ padding-left: 1.5em;
+ }
+
+ ul.filter {
+ padding-left: 1.5em;
+ list-style-type: none;
+ width: 100%;
+ }
+
+ li.filter-chain, div.filter-expression {
+ width: 100%;
+ padding: 0.3em 0.5em;
+ min-width: 30em;
+ }
+
+ ul li.filter-chain::before, ul .filter-expression::before {
+ font-family: 'ifont';
+ // Formerly: icon-down-open: e821
+ // icon-right-small:
+ content: '\e877';
+ float: left;
+ margin-left: -1.5em;
+ margin-top: 0.5em;
+ }
+
+ ul.extensible-set {
+ padding-left: 0;
+ border: none;
+ display: inline-block;
+ vertical-align: top;
+ li::before {
+ content: none;
+ }
+ }
+
+ .filter-chain > input[type=submit].icon-button, .filter-expression > input[type=submit].icon-button {
+ display: none;
+ font-family: 'ifont';
+ font-weight: normal;
+ background: none;
+ border: none;
+ padding: 0.2em 0.4em 0.2em 0.4em;
+ margin: 0 0 0 0.2em;
+ }
+
+ .active input[type=submit].icon-button,
+ li:hover input[type=submit].icon-button,
+ div:hover input[type=submit].icon-button
+ {
+ display: inline;
+ }
+}
+
+.errors > ul.filter-root {
+ input[type=text], select {
+ border-color: transparent;
+ border-bottom-color: @gray-lighter;
+ }
+
+ select.column, select.operator {
+ border-left-color: @color-critical;
+ }
+}
+
+
+form.director-form li.filter-chain > select.operator {
+ min-width: 5em;
+ max-width: 5em;
+ width: 5em;
+}
+
+form.director-form div.filter-expression {
+ .column {
+ min-width: 7em;
+ max-width: 30em;
+ width: auto;
+ }
+
+ .sign {
+ min-width: 4em;
+ max-width: 4em;
+ width: 4em;
+ margin: 0 0.3em;
+ &.wide {
+ min-width: 6em;
+ max-width: 8em;
+ width: 8em;
+ }
+ }
+
+ div.expression-wrapper {
+ display: inline-block;
+ vertical-align: top;
+ }
+
+ div.expression-wrapper > input[type=text],
+ div.expression-wrapper > select {
+ min-width: 7em;
+ width: 10em;
+ max-width: 10em;
+ }
+}
+
+ul.director-suggestions {
+/*
+ min-width: 18.5em;
+ max-width: 34.65em;
+ width: 100%;
+ */
+ width: 20em;
+ max-height: 25em;
+ overflow-y: auto;
+ overflow-x: hidden;
+ border: 1px solid @icinga-blue;
+ position: absolute;
+ z-index: 2000;
+ padding: 0;
+ margin: 0;
+ list-style-type: none;
+ background-color: @low-sat-blue;
+ li {
+ margin: 0;
+ padding: 0.5em 1em;
+ }
+
+ li:hover {
+ background-color: @tr-hover-color;
+ cursor: pointer;
+ }
+
+ li.active {
+ color: @text-color;
+ &:hover {
+ color: @text-color;
+ }
+ }
+
+ table.benchmark {
+ font-size: 0.8em;
+ font-family: @font-family-fixed;
+ }
+}
+
+table.pivot {
+ width: 100%;
+ table-layout: fixed;
+
+ thead th {
+ text-align: center;
+ }
+
+ tbody th {
+ text-align: right;
+ width: 25%;
+ }
+ tbody td {
+ text-align: center;
+ }
+ tbody td > a {
+ display: block;
+ font-size: 2em;
+ line-height: 1.5em;
+ text-decoration: none;
+ color: @icinga-blue;
+ &:hover {
+ background: @tr-active-color;
+ text-decoration: none;
+ }
+ }
+}
+
+.tree li a {
+ display: inline-block;
+ padding-left: 2.4em;
+ line-height: 2em;
+ text-decoration: none;
+ color: @text-color;
+ outline: 0;
+ background-repeat: no-repeat;
+ background-position: 0.8em 0.4em;
+}
+
+ul.tree li > .handle {
+ background-image: none;
+ &:before {
+ content: '\e806';
+ font-family: 'ifont';
+ position: absolute;
+ font-size: 0.6em;
+ margin-left: 0.25em;
+ margin-top: 0.9em;
+ }
+}
+ul.tree li.collapsed > .handle {
+ background-image: none;
+ &:before {
+ content: '\e805';
+ }
+}
+.tree li a {
+ padding-left: 1em;
+}
+
+div.sql-dump {
+ background-color: @gray-lightest;
+ border: 1px solid @gray-light;
+ padding: 1em;
+}
+
+div.exception {
+ margin: 1em;
+}
+
+h2.action-create::before {
+ color: @color-pending;
+}
+h2.action-modify::before {
+ color: @color-ok;
+}
+h2.action-delete::before {
+ color: @color-critical;
+}
+
+/* Special components */
+table.table-basket-changes {
+ min-width: 18em;
+ max-width: 100%;
+ th {
+ width: 80%;
+ font-weight: normal;
+ text-align: left;
+ min-width: 10em;
+ }
+}
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-23 08:22:46 +0000