// Media queries // ——————— @media (max-width: 767px) {
div.panel { width: 100% !important; padding: 0px !important; }
}
// ———————
// Containers // ——————— .container-fluid {
padding-left: 0px; padding-right: 0px;
}
.container.kibana-container {
padding: 5px 10px; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box;
}
// Backgrounds // ———————
.bgNav {
background: @navbarBackground;
}
.bgPrimary {
background: @btnPrimaryBackground; color: rgba(255,255,255,.90);
}
.bgInfo {
background: @btnInfoBackground; color: rgba(255,255,255,.90);
}
.bgSuccess {
background: @btnSuccessBackground; color: rgba(255,255,255,.90);
}
.bgWarning {
background: @btnWarningBackground; color: rgba(255,255,255,.90);
}
.bgDanger {
background: @btnDangerBackground; color: rgba(255,255,255,.90);
}
.bgInverse {
background: @btnInverseBackground; color: rgba(255,255,255,.90);
}
code, pre {
background-color: @grayLighter;
}
// ——— Panels ———
.panel {
display: inline-table; vertical-align: top; // Work around for overflow issue. box-sizing: border-box; -moz-box-sizing: border-box; padding: 0px 0px 0px 0px; background: @kibanaPanelBackground; border: 3px solid @bodyBackground;
}
.panel-container {
border: 1px solid rgba(100, 100, 100, 0.50); padding: 10px;
}
.panel-container > [ng-controller] {
box-sizing: border-box; display: table; width: 100%; min-height: inherit;
}
.panel-header {
display: table-row; width: 100%; height: 0px;
}
.panel-content {
display: table-row; width: 100%;
}
.panel-title {
border: 0px; text-transform: uppercase; font-weight: bold;
}
.panel-loading {
position:absolute; top: 0px; left: 0px; z-index: 800;
}
.panel div.panel-extra div.panel-extra-container {
margin-right: 0px; line-height: 20px;
}
.panel div.panel-extra {
font-size: 0.9em; margin-bottom: 10px;
}
.panel div.panel-extra .extra {
float:right !important; text-align: right;
}
.panel-error {
color: @white; padding: 3px 10px 0px 10px; margin-bottom: 10px;
}
.ui-draggable-dragging {
display: block; z-index: 9999;
}
.dragInProgress .panel-container {
border: 1px solid @blue;
}
.panel-filler {
text-align: center; margin:5px; width:100%; background:rgba(100,100,100,0.50); border: 1px solid @blue;
}
.ui-resizable { position: relative;} .ui-resizable-handle { position: absolute;font-size: 0.1px; display: block; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-e { cursor: e-resize; width: 7px; right: 3px; top: 0; height: 100%; }
// —————————
.row-add-button {
margin: 5px;
}
div.editor-row {
vertical-align: top;
}
div.editor-row div.section {
margin-right: 20px; vertical-align: top; display: inline-block;
} div.editor-option {
vertical-align: top; display: inline-block; margin-right: 10px;
} div.editor-option label {
display: block;
}
events {
font-size: 12px;
}
.version {
font-size: 85%;
}
.legend {
color: @black;
}
div.fake-input {
background-color: @inputBackground; border: 1px solid @inputBorder; .border-radius(@inputBorderRadius @inputBorderRadius @inputBorderRadius @inputBorderRadius);
}
hr.small {
margin: 5px 0px;
}
form input.ng-invalid {
color: @errorText;
}
.editor-title {
margin-right: 10px; font-size: 1.7em; font-weight: bold; text-transform:capitalize;
}
.editor-title small {
opacity: 0.5; font-size: 0.7em; font-weight: normal;
}
.bordered {
border: 1px solid @tableBorder;
}
.table-unpadded {
th, td { padding: 0px 2px; }
}
.spy {
position:absolute; right:0px; top:0px;
}
.navbar-inner {
border-width: 0 0 0px;
}
.kibana-row {
margin-bottom: 0px;
}
.row-tab {
padding: 0px; cursor: pointer; width: 30px; height: 30px; line-height: 30px; vertical-align: middle;
}
.row-button {
width: 30px; text-align: center; float: left; cursor: pointer;
}
.row-text {
white-space: nowrap; text-transform: uppercase; font-weight: bold; font-size: 0.9em; margin: 0px 10px; text-align: left;
}
.row-close {
padding: 0px; margin: 5px; min-height: 30px !important; line-height: 30px; background: @kibanaPanelBackground; border: 1px solid rgba(100, 100, 100, 0.50);
}
.top-row-open {
background: @navbarBackground; padding: 5px 25px 5px 25px;
}
.top-row-close {
padding: 5px 10px; text-transform: uppercase; margin: 0px; text-align: left; min-height: 16px !important; line-height: 16px;
}
.row-open {
margin-top: 5px; left:-30px; position: absolute; z-index: 100; transition: .10s left; transition-delay: .10s; -webkit-transition-delay: .10s;
}
.row-open:hover {
left:-10px;
}
.odd {
background-color: @tableBackgroundAccent;
}
.nomargin {
margin: 0px;
}
[ng:cloak], [ng-cloak], .ng-cloak {
display: none !important;
}
.table tbody + tbody {
border-top: 0px;
}
.link {
color: @linkColor; cursor: pointer;
}
.hover {
color: @linkColorHover;
}
.pointer {
cursor: pointer;
}
.popover {
max-width: 480px;
}
.modal {
width: 100%; top: 0px !important;
}
.tiny {
font-size: 50%;
}
.smaller {
font-size: 70%;
}
.small {
font-size: 85%;
}
.large {
font-size: 120%;
}
.strong {
font-weight: bold;
}
a {
cursor: pointer;
}
.normal {
font-weight: normal;
}
.light {
font-weight: 200;
}
.input-smaller {
width: 75px;
}
.string {color:lighten(@textColor, 5%)} .number {color:lighten(@infoText, 5%)} .boolean {color:lighten(@warningText, 5%)} .key {color:lighten(@errorText, 5%)}
.btn-active {
background-color: #E6E6E6; background-image: none; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.05); outline: 0 none
}
.remove:hover {
background-color: @btnDangerBackgroundHighlight;
}
.faded {
opacity: 0.2;
}
div.flot-text {
color: @textColor !important;
}
.dashboard-notice {
z-index:8000; margin-left:0px; padding:3px 0px 3px 0px; width:100%; padding-left:20px; color: @white;
}
.alert-warning {
background-color: @warningBackground; border-color: @warningBorder; color: @warningText;
}
.dropdown-menu, .nav-pills > li > a {
-webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important;
}
.nav-pills > li.open > a {
border-color: transparent !important; border-color: rgba(51, 181, 229, 0.4) !important;
}
/* ===================================================
* popover-extra-placements.css v0.1 * http://twitter.github.com/bootstrap-popover-extra-placements * =================================================== * Copyright 2012 Daniel Kleehammer * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. * ========================================================== */
/*************************
* Top Positions *************************/
/** Top Left **/ .popover.topLeft {
margin-top: -10px;
}
.popover.topLeft .arrow {
bottom: -10px; left: 25%; margin-left: -10px; border-width: 10px 10px 0; border-top-color: @popoverTitleBackground;
}
.popover.topLeft .arrow:after {
border-width: 11px 11px 0; border-top-color: rgba(0, 0, 0, 0.25); bottom: -1px; left: -11px;
}
/** Top Right **/ .popover.topRight {
margin-top: -10px;
}
.popover.topRight .arrow {
bottom: -10px; left: 75%; margin-left: -10px; border-width: 10px 10px 0; border-top-color: @popoverTitleBackground;;
}
.popover.topRight .arrow:after {
border-width: 11px 11px 0; border-top-color: rgba(0, 0, 0, 0.25); bottom: -1px; left: -11px;
}
/*************************
* Right Positions *************************/
.popover {
&.rightTop .arrow { top: 10%; left: -@popoverArrowOuterWidth; margin-top: -@popoverArrowOuterWidth; border-left-width: 0; border-right-color: #999; // IE8 fallback border-right-color: @popoverArrowOuterColor; &:after { left: 1px; bottom: -@popoverArrowWidth; border-left-width: 0; border-right-color: @popoverArrowColor; } } &.rightBottom .arrow { top: 90%; left: -@popoverArrowOuterWidth; margin-top: -@popoverArrowOuterWidth; border-left-width: 0; border-right-color: #999; // IE8 fallback border-right-color: @popoverArrowOuterColor; &:after { left: 1px; bottom: -@popoverArrowWidth; border-left-width: 0; border-right-color: @popoverArrowColor; } } &.bottomLeft .arrow { left: 10%; margin-left: -@popoverArrowOuterWidth; border-top-width: 0; border-bottom-color: #999; // IE8 fallback border-bottom-color: @popoverArrowOuterColor; top: -@popoverArrowOuterWidth; &:after { top: 1px; margin-left: -@popoverArrowWidth; border-top-width: 0; border-bottom-color: @popoverArrowColor; } } &.bottomRight .arrow { left: 90%; margin-left: -@popoverArrowOuterWidth; border-top-width: 0; border-bottom-color: #999; // IE8 fallback border-bottom-color: @popoverArrowOuterColor; top: -@popoverArrowOuterWidth; &:after { top: 1px; margin-left: -@popoverArrowWidth; border-top-width: 0; border-bottom-color: @popoverArrowColor; } } &.leftTop .arrow { top: 10%; right: -@popoverArrowOuterWidth; margin-top: -@popoverArrowOuterWidth; border-right-width: 0; border-left-color: #999; // IE8 fallback border-left-color: @popoverArrowOuterColor; &:after { right: 1px; border-right-width: 0; border-left-color: @popoverArrowColor; bottom: -@popoverArrowWidth; } } &.leftBottom .arrow { top: 90%; right: -@popoverArrowOuterWidth; margin-top: -@popoverArrowOuterWidth; border-right-width: 0; border-left-color: #999; // IE8 fallback border-left-color: @popoverArrowOuterColor; &:after { right: 1px; border-right-width: 0; border-left-color: @popoverArrowColor; bottom: -@popoverArrowWidth; } } &.topLeft .arrow { left: 10%; margin-left: -@popoverArrowOuterWidth; border-bottom-width: 0; border-top-color: #999; // IE8 fallback border-top-color: @popoverArrowOuterColor; bottom: -@popoverArrowOuterWidth; &:after { bottom: 1px; margin-left: -@popoverArrowWidth; border-bottom-width: 0; border-top-color: @popoverArrowColor; } } &.topRight .arrow { left: 90%; margin-left: -@popoverArrowOuterWidth; border-bottom-width: 0; border-top-color: #999; // IE8 fallback border-top-color: @popoverArrowOuterColor; bottom: -@popoverArrowOuterWidth; &:after { bottom: 1px; margin-left: -@popoverArrowWidth; border-bottom-width: 0; border-top-color: @popoverArrowColor; } }
}