Merge branch 'master' of github.com:torkelo/grafana-private into pro
Conflicts: src/css/less/grafana.less src/test/test-main.js
This commit is contained in:
Torkel Ödegaard
@@ -56,7 +56,7 @@ hr {
|
||||
}
|
||||
|
||||
.brand {
|
||||
padding: 15px 20px 15px;
|
||||
padding: 0px 15px;
|
||||
color: @grayLighter;
|
||||
font-weight: normal;
|
||||
text-shadow: none;
|
||||
@@ -212,7 +212,7 @@ div.subnav {
|
||||
|
||||
.nav-tabs {
|
||||
|
||||
border-bottom: 1px solid @grayDark;
|
||||
border-bottom: 1px solid @fullEditBorder;
|
||||
|
||||
& > li > a {
|
||||
.border-radius(0);
|
||||
@@ -221,8 +221,9 @@ div.subnav {
|
||||
li > a:hover,
|
||||
li.active > a,
|
||||
li.active > a:hover {
|
||||
border-color: transparent;
|
||||
background-color: @blue;
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
border-bottom: 2px solid @blue;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
@@ -362,7 +363,7 @@ div.subnav {
|
||||
background-image: none;
|
||||
.box-shadow(none);
|
||||
border: none;
|
||||
.border-radius(0);
|
||||
.border-radius(2px);
|
||||
text-shadow: none;
|
||||
|
||||
&.disabled {
|
||||
@@ -544,16 +545,16 @@ a:hover {
|
||||
.modal {
|
||||
.border-radius(1px);
|
||||
border-top: solid 1px lighten(@grayDark, 5%);
|
||||
background-color: @grayDark;
|
||||
background-color: @grafanaPanelBackground;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
border-bottom: 1px solid @grayDark;
|
||||
border-bottom: 1px solid @grafanaPanelBackground;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background-color: @grayDark;
|
||||
border-top: 1px solid @grayDark;
|
||||
background-color: @grafanaPanelBackground;
|
||||
border-top: 1px solid @grafanaPanelBackground;
|
||||
.border-radius(0 0 0px 0px);
|
||||
.box-shadow(none);
|
||||
}
|
||||
|
||||
@@ -159,8 +159,9 @@ div.subnav {
|
||||
li.active > a,
|
||||
li.active > a:hover {
|
||||
border-color: transparent;
|
||||
background-color: @blue;
|
||||
color: @white;
|
||||
background-color: transparent;
|
||||
border-bottom: 2px solid @blue;
|
||||
color: @blue
|
||||
}
|
||||
|
||||
li.disabled > a {
|
||||
|
||||
@@ -8,8 +8,6 @@
|
||||
}
|
||||
|
||||
.grafana-console-header {
|
||||
background: @fullEditTabsBackground;
|
||||
border-top: @fullEditTabsBorder;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
|
||||
+125
-140
@@ -1,8 +1,11 @@
|
||||
@import "p_pro.less";
|
||||
@import "submenu.less";
|
||||
@import "graph.less";
|
||||
@import "console.less";
|
||||
@import "bootstrap-tagsinput.less";
|
||||
@import "p_pro.less";
|
||||
@import "tables_lists.less";
|
||||
@import "search.less";
|
||||
@import "panel.less";
|
||||
|
||||
.hide-controls {
|
||||
padding: 0;
|
||||
@@ -33,79 +36,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Search
|
||||
|
||||
.grafana-search-panel {
|
||||
.search-field-wrapper {
|
||||
padding: 6px 10px;
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
button {
|
||||
margin: 0 2px 0 0;
|
||||
}
|
||||
> span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding-right: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-results-container {
|
||||
max-height: 600px;
|
||||
overflow: auto;
|
||||
.logo-icon {
|
||||
width: 24px;
|
||||
padding: 13px 11px 0 0;
|
||||
display: block;
|
||||
.search-result-item a {
|
||||
}
|
||||
|
||||
.search-result-item:hover, .search-result-item.selected {
|
||||
.search-result-link, .icon {
|
||||
color: @grafanaListHighlight;
|
||||
}
|
||||
.search-result-link .label {
|
||||
background-color: @blue;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.search-result-link {
|
||||
color: @grafanaListMainLinkColor;
|
||||
.icon {
|
||||
padding-right: 10px;
|
||||
color: @grafanaListHighlightContrast;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-item:nth-child(odd) {
|
||||
background-color: @grafanaListAccent;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
padding: 6px 10px;
|
||||
white-space: nowrap;
|
||||
border-top: 1px solid @grafanaListBorderTop;
|
||||
border-bottom: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
|
||||
.search-result-tags {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.search-result-actions {
|
||||
float: right;
|
||||
padding-left: 10px;
|
||||
}
|
||||
float: left;
|
||||
}
|
||||
|
||||
.search-tagview-switch {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 266px;
|
||||
color: darken(@linkColor, 30%);
|
||||
&.active {
|
||||
color: @linkColor;
|
||||
}
|
||||
.page-title {
|
||||
padding: 15px 0;
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.row-button {
|
||||
@@ -160,7 +101,7 @@
|
||||
|
||||
.panel-fullscreen {
|
||||
z-index: 100;
|
||||
display: block !important;
|
||||
display: block;
|
||||
position: fixed;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
@@ -176,49 +117,16 @@
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-fullscreen .container-fluid.main {
|
||||
height: 0px;
|
||||
width: 0px;
|
||||
position: fixed;
|
||||
right: -10000px;
|
||||
.dashboard-fullscreen {
|
||||
.row-control-inner {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.histogram-chart {
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.panel-full-edit-tabs {
|
||||
margin-top: 30px;
|
||||
min-height: 250px;
|
||||
margin-left: -10px;
|
||||
margin-right: -10px;
|
||||
background-color: @fullEditBackground;
|
||||
border-top: 1px solid @fullEditBorder;
|
||||
|
||||
.tabs {
|
||||
.nav-tabs {
|
||||
margin: 0;
|
||||
background: @fullEditTabsBackground;
|
||||
border-top: 1px solid @fullEditTabsBorder;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.tab-content {
|
||||
overflow: visible;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.nav-tabs > li > a {
|
||||
line-height: 15px;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
|
||||
.grafana-target:last-child {
|
||||
border-bottom: 1px solid @grafanaTargetBorder;
|
||||
}
|
||||
@@ -241,7 +149,6 @@
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
margin-right: 90px;
|
||||
margin-left: 30px;
|
||||
>li {
|
||||
float: left;
|
||||
}
|
||||
@@ -249,9 +156,6 @@
|
||||
|
||||
.grafana-metric-options {
|
||||
margin-top: 35px;
|
||||
.grafana-segment-list {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// fix for fixed positioned panel & scrolling
|
||||
@@ -281,6 +185,23 @@
|
||||
&a:hover {
|
||||
background: @grafanaTargetFuncBackground;
|
||||
}
|
||||
|
||||
&.template-param-name {
|
||||
border-right: none;
|
||||
padding-right: 3px;
|
||||
}
|
||||
&.annotation-segment {
|
||||
padding: 8px 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.grafana-target-segment-icon {
|
||||
i {
|
||||
width: 15px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
.grafana-target-function {
|
||||
@@ -306,15 +227,7 @@ input[type=text].grafana-function-param-input {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.grafana-target-controls-left {
|
||||
list-style: none;
|
||||
float: left;
|
||||
width: 30px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.grafana-target-controls {
|
||||
width: 120px;
|
||||
float: right;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
@@ -325,10 +238,13 @@ input[type=text].grafana-function-param-input {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
a {
|
||||
padding: 8px 7px;
|
||||
.icon {
|
||||
position: relative;
|
||||
top: 8px;
|
||||
}
|
||||
|
||||
a {
|
||||
padding: 8px 7px;
|
||||
color: @grafanaTargetColor;
|
||||
font-size: 16px;
|
||||
|
||||
@@ -350,6 +266,7 @@ input[type=text].grafana-target-text-input {
|
||||
float: left;
|
||||
color: @grafanaTargetColor;
|
||||
border-radius: 0;
|
||||
border-right: 1px solid @grafanaTargetSegmentBorder;
|
||||
}
|
||||
|
||||
input[type=text].grafana-target-segment-input {
|
||||
@@ -402,7 +319,6 @@ select.grafana-target-segment-input {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.scrollable {
|
||||
max-height: 300px;
|
||||
overflow: auto;
|
||||
@@ -432,23 +348,22 @@ select.grafana-target-segment-input {
|
||||
::-webkit-scrollbar-button:horizontal:increment:active { background-image: none; }
|
||||
::-webkit-scrollbar-button:vertical:decrement:active { background-image: none; }
|
||||
::-webkit-scrollbar-button:vertical:increment:active {background-image: none; }
|
||||
|
||||
::-webkit-scrollbar-track-piece { background-color: grayDark; }
|
||||
::-webkit-scrollbar-track-piece { background-color: transparent; }
|
||||
|
||||
::-webkit-scrollbar-thumb:vertical {
|
||||
height: 50px;
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3a3a3a), color-stop(100%, #222222));
|
||||
border: 1px solid #0d0d0d;
|
||||
border-top: 1px solid #666666;
|
||||
border-left: 1px solid #666666;
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%, @scrollbarBackground), color-stop(100%, @scrollbarBackground2));
|
||||
border: 1px solid @scrollbarBorder;
|
||||
border-top: 1px solid @scrollbarBorder;
|
||||
border-left: 1px solid @scrollbarBorder;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:horizontal {
|
||||
width: 50px;
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3a3a3a), color-stop(100%, #222222));
|
||||
border: 1px solid #1f1f1f;
|
||||
border-top: 1px solid #666666;
|
||||
border-left: 1px solid #666666;
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @scrollbarBackground), color-stop(100%, @scrollbarBackground2));
|
||||
border: 1px solid @scrollbarBorder;
|
||||
border-top: 1px solid @scrollbarBorder;
|
||||
border-left: 1px solid @scrollbarBorder;
|
||||
}
|
||||
|
||||
|
||||
@@ -504,12 +419,6 @@ select.grafana-target-segment-input {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.grafana-version-footer {
|
||||
padding-top: 15px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
.metrics-editor-help:hover {
|
||||
.hide {
|
||||
display: block;
|
||||
@@ -536,3 +445,79 @@ select.grafana-target-segment-input {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.dashboard-edit-view {
|
||||
padding: 20px;
|
||||
background-color: @grafanaPanelBackground;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dashboard-editor-body {
|
||||
padding: 20px 10px;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.dashboard-editor-footer {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dashboard-editor-header {
|
||||
overflow: hidden;
|
||||
.tabs {
|
||||
float: left;
|
||||
}
|
||||
.nav {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-editor-title {
|
||||
border-bottom: 1px solid @fullEditBorder;
|
||||
padding-right: 20px;
|
||||
float: left;
|
||||
color: @linkColor;
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
line-height: 38px;
|
||||
margin: 0;
|
||||
.icon {
|
||||
padding: 0 8px 0 5px;
|
||||
color: @textColor;
|
||||
}
|
||||
}
|
||||
|
||||
.grafana-version-info {
|
||||
position: absolute;
|
||||
bottom: 2px;
|
||||
left: 3px;
|
||||
font-size: 80%;
|
||||
color: darken(@gray, 25%);
|
||||
a { color: darken(@gray, 25%); }
|
||||
}
|
||||
|
||||
.template-variable {
|
||||
color: @variable;
|
||||
}
|
||||
|
||||
.grafana-info-box:before {
|
||||
content: "\f05a";
|
||||
font-family:'FontAwesome';
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: -8px;
|
||||
font-size: 20px;
|
||||
color: @blue;
|
||||
}
|
||||
|
||||
.grafana-info-box {
|
||||
position: relative;
|
||||
padding: 5px 15px;
|
||||
background-color: @grafanaTargetBackground;
|
||||
border: 1px solid @grafanaTargetBorder;
|
||||
h5 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.grafana-tip {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
@@ -5,8 +5,6 @@
|
||||
.graph-legend {
|
||||
margin: 0 20px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
|
||||
.popover-content {
|
||||
padding: 0;
|
||||
@@ -45,7 +43,7 @@
|
||||
|
||||
.graph-legend-series {
|
||||
padding-left: 10px;
|
||||
padding-top: 2px;
|
||||
padding-top: 6px;
|
||||
}
|
||||
|
||||
.graph-legend-value {
|
||||
|
||||
+22
-76
@@ -14,7 +14,7 @@
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.container.grafana-container {
|
||||
.main-view-container {
|
||||
padding: 5px 10px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
@@ -65,74 +65,6 @@ code, pre {
|
||||
background-color: @grayLighter;
|
||||
}
|
||||
|
||||
.panel {
|
||||
display: inline-table;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.panel-container {
|
||||
padding: 0px 0px 0px 0px;
|
||||
background: @grafanaPanelBackground;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.panel-content {
|
||||
padding: 0px 10px 5px 10px;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
border: 0px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.panel-loading {
|
||||
position:absolute;
|
||||
top: 0px;
|
||||
right: 4px;
|
||||
z-index: 800;
|
||||
}
|
||||
|
||||
.panel div.panel-extra div.panel-extra-container {
|
||||
margin-right: -10px;
|
||||
margin-top: 3px;
|
||||
text-align: center;
|
||||
ul {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.panel div.panel-extra {
|
||||
font-size: 0.9em;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.panel div.panel-extra .extra {
|
||||
float:right !important;
|
||||
}
|
||||
|
||||
.panel-error {
|
||||
color: @white;
|
||||
//padding: 5px 10px 0px 10px;
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
padding: 0px 17px 6px 5px;
|
||||
top: 0;
|
||||
i {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
}
|
||||
.panel-error-arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
border-left: 31px solid transparent;
|
||||
border-right: 30px solid transparent;
|
||||
border-bottom: 27px solid @grafanaPanelBackground;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
div.editor-row {
|
||||
vertical-align: top;
|
||||
}
|
||||
@@ -142,11 +74,13 @@ div.editor-row div.section {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.editor-option {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
div.editor-option label {
|
||||
display: block;
|
||||
}
|
||||
@@ -266,9 +200,9 @@ form input.ng-invalid {
|
||||
left:-34px;
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
transition: .25s left;
|
||||
transition-delay: .25s;
|
||||
-webkit-transition-delay: .25s;
|
||||
transition: .10s left;
|
||||
transition-delay: .10s;
|
||||
-webkit-transition-delay: .10s;
|
||||
}
|
||||
|
||||
.row-open:hover {
|
||||
@@ -467,7 +401,6 @@ div.flot-text {
|
||||
/*************************
|
||||
* Right Positions
|
||||
*************************/
|
||||
|
||||
.popover {
|
||||
&.rightTop .arrow {
|
||||
top: 10%;
|
||||
@@ -583,17 +516,30 @@ div.flot-text {
|
||||
}
|
||||
}
|
||||
|
||||
// typeahead max height
|
||||
.typeahead {
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
// Labels & Badges
|
||||
|
||||
.label-tag {
|
||||
background-color: @purple;
|
||||
color: darken(@white, 5%);
|
||||
border-radius: 2px;
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
padding: 4px 6px;
|
||||
.icon-tag {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
padding-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.label-tag:hover {
|
||||
opacity: 0.85;
|
||||
background-color: darken(@purple, 10%);
|
||||
color: @white;
|
||||
}
|
||||
|
||||
.annotation-editor-table {
|
||||
@@ -603,7 +549,6 @@ div.flot-text {
|
||||
}
|
||||
|
||||
// Top menu
|
||||
|
||||
.save-dashboard-dropdown {
|
||||
padding: 10px;
|
||||
li>a {
|
||||
@@ -632,3 +577,4 @@ code, pre {
|
||||
background-color: @grafanaPanelBackground;
|
||||
color: @textColor;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,71 @@
|
||||
.panel {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.panel-container {
|
||||
padding: 0px 0px 0px 0px;
|
||||
background: @grafanaPanelBackground;
|
||||
margin: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.panel-content {
|
||||
padding: 0px 10px 5px 10px;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
border: 0px;
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.panel-loading {
|
||||
position:absolute;
|
||||
top: 0px;
|
||||
right: 4px;
|
||||
z-index: 800;
|
||||
}
|
||||
|
||||
.panel div.panel-extra div.panel-extra-container {
|
||||
margin-right: -10px;
|
||||
margin-top: 3px;
|
||||
text-align: center;
|
||||
ul {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.panel div.panel-extra {
|
||||
font-size: 0.9em;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.panel div.panel-extra .extra {
|
||||
float:right !important;
|
||||
}
|
||||
|
||||
.panel-error {
|
||||
color: @white;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
padding: 0px 17px 6px 5px;
|
||||
top: 0;
|
||||
i {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-error-arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
border-left: 31px solid transparent;
|
||||
border-right: 30px solid transparent;
|
||||
border-bottom: 27px solid @grafanaPanelBackground;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
// Search
|
||||
.grafana-search-panel {
|
||||
.search-field-wrapper {
|
||||
padding: 6px 10px;
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
button {
|
||||
margin: 0 4px 0 0;
|
||||
}
|
||||
> span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding-right: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-results-container {
|
||||
height: 500px;
|
||||
overflow: auto;
|
||||
display: block;
|
||||
line-height: 28px;
|
||||
|
||||
.search-result-item:hover, .search-result-item.selected {
|
||||
.search-result-link, .search-result-link > .icon {
|
||||
color: @grafanaListHighlight;
|
||||
}
|
||||
}
|
||||
|
||||
.selected {
|
||||
.search-result-tag {
|
||||
opacity: 0.70;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-link {
|
||||
color: @grafanaListMainLinkColor;
|
||||
.icon {
|
||||
padding-right: 10px;
|
||||
color: @grafanaListHighlightContrast;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-item:nth-child(odd) {
|
||||
background-color: @grafanaListAccent;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
padding: 0px 10px;
|
||||
white-space: nowrap;
|
||||
border-bottom: 1px solid @grafanaListBorderBottom;
|
||||
border-top: 1px solid @grafanaListBorderTop;
|
||||
border-left: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
|
||||
.search-result-tags {
|
||||
float: right;
|
||||
.label-tag {
|
||||
margin-left: 6px;
|
||||
font-size: 11px;
|
||||
padding: 2px 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-actions {
|
||||
float: right;
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.search-tagview-switch {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 24px;
|
||||
color: darken(@linkColor, 30%);
|
||||
&.active {
|
||||
color: @linkColor;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
+1
-109
@@ -1,118 +1,10 @@
|
||||
.submenu-controls {
|
||||
background: @submenuBackground;
|
||||
font-size: inherit;
|
||||
label {
|
||||
margin: 0;
|
||||
padding-right: 4px;
|
||||
display: inline;
|
||||
}
|
||||
input[type=checkbox] {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.submenu-controls-visible:not(.hide-controls) {
|
||||
.panel-fullscreen {
|
||||
top: 82px;
|
||||
top: 91px;
|
||||
}
|
||||
}
|
||||
|
||||
.submenu-panel {
|
||||
padding: 0 4px 0 8px;
|
||||
border-right: 1px solid @submenuBorder;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.submenu-panel:first-child {
|
||||
padding-left: 17px;
|
||||
}
|
||||
|
||||
.submenu-panel-title {
|
||||
float: left;
|
||||
text-transform: uppercase;
|
||||
padding: 4px 10px 3px 0;
|
||||
}
|
||||
|
||||
.submenu-panel-wrapper {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.submenu-toggle {
|
||||
padding: 4px 0 3px 8px;
|
||||
float: left;
|
||||
.annotation-color-icon {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.submenu-toggle:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.submenu-control-edit {
|
||||
padding: 4px 4px 3px 8px;
|
||||
float: right;
|
||||
border-left: 1px solid @submenuBorder;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.annotation-disabled, .annotation-disabled a {
|
||||
color: darken(@textColor, 25%);
|
||||
}
|
||||
|
||||
|
||||
// Filter submenu
|
||||
.filtering-container {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.filtering-container label {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.filtering-container input[type=checkbox] {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.filter-panel-filter {
|
||||
display:inline-block;
|
||||
vertical-align: top;
|
||||
padding: 4px 10px 3px 10px;
|
||||
border-right: 1px solid @submenuBorder;
|
||||
}
|
||||
|
||||
.filter-panel-filter:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.filter-panel-filter ul {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.filter-deselected {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.filtering-container .filter-action {
|
||||
float:right;
|
||||
padding-right: 2px;
|
||||
margin-bottom: 0px !important;
|
||||
margin-left: 0px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.add-filter-action {
|
||||
padding: 3px 5px 0px 5px;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
}
|
||||
|
||||
.filter-mandate {
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-apply {
|
||||
float:right;
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
.grafana-options-table {
|
||||
width: 100%;
|
||||
|
||||
tr:nth-child(odd) td {
|
||||
background-color: @grafanaListAccent;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 5px 10px;
|
||||
white-space: nowrap;
|
||||
border-bottom: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
|
||||
tr:first-child {
|
||||
td {
|
||||
border-top: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
}
|
||||
|
||||
td:first-child {
|
||||
border-left: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
|
||||
td:last-child {
|
||||
border-right: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
}
|
||||
|
||||
.max-width {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-o-text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.grafana-options-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
max-width: 450px;
|
||||
|
||||
li:nth-child(odd) {
|
||||
background-color: @grafanaListAccent;
|
||||
}
|
||||
|
||||
li {
|
||||
float: left;
|
||||
margin: 2px;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid @grafanaListBorderBottom;
|
||||
border: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
li:first-child {
|
||||
border: 1px solid @grafanaListBorderBottom;
|
||||
}
|
||||
}
|
||||
@@ -6,7 +6,7 @@
|
||||
// -------------------------
|
||||
@black: #000;
|
||||
@gray: #bbb;
|
||||
@grayDark: #303030;
|
||||
@grayDark: #262626;
|
||||
@grayDarker: #1f1f1f;
|
||||
|
||||
@grayLight: #ADAFAE;
|
||||
@@ -24,20 +24,14 @@
|
||||
@orange: #FF8800;
|
||||
@pink: #FF4444;
|
||||
@purple: #9933CC;
|
||||
@variable: #32D1DF;
|
||||
|
||||
// grafana Variables
|
||||
// -------------------------
|
||||
@grafanaPanelBackground: @grayDarker;
|
||||
|
||||
// Submenu
|
||||
@submenuBackground: #292929;
|
||||
@submenuBorder: #202020;
|
||||
|
||||
// Tabs
|
||||
@fullEditTabsBackground: @grayDark;
|
||||
@fullEditBorder: @black;
|
||||
@fullEditBackground: transparent;
|
||||
@fullEditTabsBorder: #555;
|
||||
@fullEditBorder: #555;
|
||||
|
||||
// Graphite Target Editor
|
||||
@grafanaTargetBorder: @black;
|
||||
@@ -46,8 +40,8 @@
|
||||
@grafanaTargetColorHide: darken(#c8c8c8, 25%);
|
||||
@grafanaTargetSegmentBorder: #050505;
|
||||
|
||||
@grafanaTargetFuncBackground: #444;
|
||||
@grafanaTargetFuncHightlight: #555;
|
||||
@grafanaTargetFuncBackground: #333;
|
||||
@grafanaTargetFuncHightlight: #444;
|
||||
|
||||
// Scaffolding
|
||||
// -------------------------
|
||||
@@ -95,13 +89,18 @@
|
||||
|
||||
// Lists
|
||||
@grafanaListBackground: transparent;
|
||||
@grafanaListAccent: #232323;
|
||||
@grafanaListBorderTop: #3E3E3E;
|
||||
@grafanaListBorderBottom: #1c1919;
|
||||
@grafanaListAccent: lighten(@grayDarker, 2%);
|
||||
@grafanaListBorderTop: @grayDark;
|
||||
@grafanaListBorderBottom: @black;
|
||||
@grafanaListHighlight: @blue;
|
||||
@grafanaListHighlightContrast: #4F4F4F;
|
||||
@grafanaListMainLinkColor: @linkColor;
|
||||
|
||||
// Scrollbars
|
||||
@scrollbarBackground: #3a3a3a;
|
||||
@scrollbarBackground2: #3a3a3a;
|
||||
@scrollbarBorder: black;
|
||||
|
||||
// Tables
|
||||
// -------------------------
|
||||
@tableBackground: transparent; // overall background-color
|
||||
@@ -134,12 +133,10 @@
|
||||
@btnInverseBackgroundHighlight: darken(@black, 5%);
|
||||
|
||||
|
||||
|
||||
|
||||
// Forms
|
||||
// -------------------------
|
||||
@inputBackground: lighten(@grayDark,10%);
|
||||
@inputBorder: lighten(@grayDark,20%);
|
||||
@inputBackground: lighten(@grayDark,5%);
|
||||
@inputBorder: lighten(@grayDark,5%);
|
||||
@inputBorderRadius: @baseBorderRadius;
|
||||
@inputDisabledBackground: #555;
|
||||
@formActionsBackground: transparent;
|
||||
|
||||
@@ -28,6 +28,7 @@
|
||||
@orange: #FF7518;
|
||||
@pink: #E671B8;
|
||||
@purple: #9954BB;
|
||||
@variable: #32D1DF;
|
||||
|
||||
// grafana Variables
|
||||
// -------------------------
|
||||
@@ -38,10 +39,7 @@
|
||||
@submenuBorder: @white;
|
||||
|
||||
// Tabs
|
||||
@fullEditTabsBackground: @white;
|
||||
@fullEditBorder: @white;
|
||||
@fullEditBackground: @navbarBackground;
|
||||
@fullEditTabsBorder: @white;
|
||||
@fullEditBorder: @grayLighter;
|
||||
|
||||
// Graphite Target Editor
|
||||
@grafanaTargetBorder: @submenuBackground;
|
||||
@@ -61,8 +59,8 @@
|
||||
|
||||
// Links
|
||||
// -------------------------
|
||||
@linkColor: @blue;
|
||||
@linkColorHover: darken(@linkColor, 10%);
|
||||
@linkColor: @textColor;
|
||||
@linkColorHover: @blue;
|
||||
|
||||
|
||||
// Typography
|
||||
@@ -99,7 +97,7 @@
|
||||
|
||||
// Lists
|
||||
@grafanaListBackground: transparent;
|
||||
@grafanaListAccent: #f9f9f9;
|
||||
@grafanaListAccent: @grayLighter;
|
||||
@grafanaListBorderTop: #eee;
|
||||
@grafanaListBorderBottom: #efefef;
|
||||
@grafanaListHighlight: @blue;
|
||||
@@ -114,6 +112,11 @@
|
||||
@tableBackgroundHover: #E8F8FD; // for hover
|
||||
@tableBorder: #ddd; // table and cell border
|
||||
|
||||
// Scrollbars
|
||||
@scrollbarBackground: @grayLighter;
|
||||
@scrollbarBackground2: @grayLighter;
|
||||
@scrollbarBorder: @grayLight;
|
||||
|
||||
// Buttons
|
||||
// -------------------------
|
||||
@btnBackground: @grayLighter;
|
||||
@@ -189,7 +192,7 @@
|
||||
|
||||
// Input placeholder text color
|
||||
// -------------------------
|
||||
@placeholderText: @gray;
|
||||
@placeholderText: @grayLight;
|
||||
|
||||
|
||||
// Hr border color
|
||||
@@ -219,7 +222,7 @@
|
||||
|
||||
@navbarText: #666;
|
||||
@navbarLinkColor: #666;
|
||||
@navbarLinkColorHover: #333;
|
||||
@navbarLinkColorHover: @blue;
|
||||
@navbarLinkColorActive: #555;
|
||||
@navbarLinkBackgroundHover: transparent;
|
||||
@navbarLinkBackgroundActive: darken(@navbarBackground, 6.5%);
|
||||
|
||||
Reference in New Issue
Block a user