Skip to content

N
nexpie-grafana-theme
Commit cac70a10 by Torkel Ödegaard
Options

more work on light theme (#77)

parent 9794c2eb
Showing with 107 additions and 93 deletions
src/app/panels/filtering/module.html
<div ng-controller='filtering' ng-init="init()">
<style>
.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 #202020;
}
.filter-panel-filter:first-child {
padding-left: 0;
}
.filter-panel-filter ul {
margin-bottom: 0px;
}
.filter-deselected {
opacity: 0.5;
}
.filter-action {
float:right;
padding-right: 2px;
margin-bottom: 0px !important;
margin-left: 0px;
margin-top: 4px;
}
.add-filter-action {
padding: 3px 10px 0px 5px;
position: relative;
top: 4px;
}
.filter-mandate {
text-decoration: underline;
cursor: pointer;
}
.filter-apply {
float:right;
}
</style>
<div class='filtering-container'>
......
src/css/bootstrap.dark.min.css
This source diff could not be displayed because it is too large. You can view the blob instead.
src/css/bootstrap.light.min.css
This source diff could not be displayed because it is too large. You can view the blob instead.
src/vendor/bootstrap/less/bootswatch.light.less → src/css/less/bootswatch.light.less
......@@ -356,6 +356,11 @@ div.subnav {
}
}
legend, label {
color: @textColor;
border-bottom: 0px solid #222;
}
// TABLES
// -----------------------------------------------------
......@@ -480,10 +485,6 @@ legend {
}
.label {
min-width: 80px;
.border-radius(0);
font-weight: 300;
text-shadow: none;
&-success {
background-color: @green;
......@@ -503,27 +504,8 @@ legend {
}
.badge {
.border-radius(0);
font-weight: 300;
text-shadow: none;
color: @black;
&-success {
background-color: @green;
}
&-important {
background-color: @red;
}
&-info {
background-color: @purple;
}
&-inverse {
background-color: @black;
}
border-radius: 0;
font-weight: 200;
}
// MISC
......
src/css/less/grafana.less
......@@ -113,10 +113,8 @@
position: fixed;
left: 0px;
right: 0px;
top: 49px;
top: 54px;
bottom: 0px;
outline: 1px solid #101214;
border-top: 1px solid #3e444c;
padding: 0 10px;
background: @kibanaPanelBackground;
}
......@@ -189,12 +187,13 @@
min-height: 250px;
margin-left: -10px;
margin-right: -10px;
border-top: 1px solid black;
background-color: @fullEditBackground;
border-top: 1px solid @fullEditBorder;
.tabs {
.nav-tabs {
margin: 0;
background: @grayDark;
background: @fullEditTabsBackground;
border-top: 1px solid #555;
}
......@@ -215,23 +214,16 @@
}
}
/* Graphite Target Editor */
@grafanaTargetColor: #c8c8c8;
@grafanaTargetColorHide: darken(#c8c8c8, 25%);
.grafana-target {
}
.grafana-target-inner-wrapper {
//border-top: 1px solid #444444;
width: 100%;
}
.grafana-target-inner {
border-top: 2px solid black;
border-left: 2px solid black;
border-right: 2px solid black;
background: @grayDark;
border-top: 2px solid @grafanaTargetBorder;
border-left: 2px solid @grafanaTargetBorder;
border-right: 2px solid @grafanaTargetBorder;
background: @grafanaTargetBackground;
width: 100%;
}
......
src/css/less/overrides.less
......@@ -564,3 +564,58 @@ div.flot-text {
background-color: darken(@purple, 10%);
color: lighten(@linkColor, 5%);
}
// 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;
}
.filter-action {
float:right;
padding-right: 2px;
margin-bottom: 0px !important;
margin-left: 0px;
margin-top: 4px;
}
.add-filter-action {
padding: 3px 10px 0px 5px;
position: relative;
top: 4px;
}
.filter-mandate {
text-decoration: underline;
cursor: pointer;
}
.filter-apply {
float:right;
}
\ No newline at end of file
src/css/less/submenu.less
.submenu-controls {
background: #292929;
background: @submenuBackground;
font-size: inherit;
label {
margin: 0;
......@@ -13,7 +13,7 @@
.submenu-panel {
padding: 0 10px 0 17px;
border-right: 1px solid #202020;
border-right: 1px solid @submenuBorder;
float: left;
}
......
src/css/less/variables.dark.less
......@@ -29,6 +29,20 @@
// -------------------------
@kibanaPanelBackground: @grayDarker;
// Submenu
@submenuBackground: #292929;
@submenuBorder: #202020;
// Tabs
@fullEditTabsBackground: @grayDark;
@fullEditBorder: @black;
@fullEditBackground: transparent;
// Graphite Target Editor
@grafanaTargetBorder: @black;
@grafanaTargetBackground: @grayDark;
@grafanaTargetColor: #c8c8c8;
@grafanaTargetColorHide: darken(#c8c8c8, 25%);
// Scaffolding
// -------------------------
......
src/css/less/variables.light.less
......@@ -33,6 +33,22 @@
// -------------------------
@kibanaPanelBackground: @white;
// Submenu
@submenuBackground: rgb(218, 217, 217);
@submenuBorder: @white;
// Tabs
@fullEditTabsBackground: @white;
@fullEditBorder: @white;
@fullEditBackground: @bodyBackground;
// Graphite Target Editor
@grafanaTargetBorder: @black;
@grafanaTargetBackground: @grayLight;
@grafanaTargetColor: #c8c8c8;
@grafanaTargetColorHide: darken(#c8c8c8, 25%);
// Scaffolding
// -------------------------
@bodyBackground: @grayLighter;
......@@ -113,7 +129,7 @@
// Forms
// -------------------------
@inputBackground: @white;
@inputBorder: @gray;
@inputBorder: @grayLight;
@inputBorderRadius: @baseBorderRadius;
@inputDisabledBackground: @grayLighter;
@formActionsBackground: #f5f5f5;
......
tasks/options/less.js
......@@ -16,9 +16,9 @@ module.exports = function(config) {
yuicompress:true
},
files: {
"<%= srcDir %>/css/bootstrap.dark.min.css": "<%= srcDir %>/vendor/bootstrap/less/bootstrap.dark.less",
"<%= srcDir %>/css/bootstrap.light.min.css": "<%= srcDir %>/vendor/bootstrap/less/bootstrap.light.less",
"<%= srcDir %>/css/bootstrap-responsive.min.css": "<%= srcDir %>/vendor/bootstrap/less/grafana-responsive.less"
"<%= srcDir %>/css/bootstrap.dark.min.css": "<%= srcDir %>/css/less/bootstrap.dark.less",
"<%= srcDir %>/css/bootstrap.light.min.css": "<%= srcDir %>/css/less/bootstrap.light.less",
"<%= srcDir %>/css/bootstrap-responsive.min.css": "<%= srcDir %>/css/less/grafana-responsive.less"
}
}
};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment