Skip to content

Commit

Permalink
Merge pull request #6767 from panda01/fix/darkTheme
Browse files Browse the repository at this point in the history
Fixes for the dark theme
  • Loading branch information
Rashid Khan committed Apr 7, 2016
2 parents 27e7e23 + 30d44ee commit 4e9e2ca
Show file tree
Hide file tree
Showing 4 changed files with 55 additions and 43 deletions.
4 changes: 4 additions & 0 deletions src/plugins/kibana/public/dashboard/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,10 @@ app.directive('dashboardApp', function (Notifier, courier, AppState, timefilter,
key: 'share',
description: 'Share Dashboard',
template: require('plugins/kibana/dashboard/partials/share.html')
}, {
key: 'options',
description: 'Options',
template: require('plugins/kibana/dashboard/partials/options.html')
}];

$scope.refresh = _.bindKey(courier, 'fetch');
Expand Down
1 change: 0 additions & 1 deletion src/ui/public/styles/base.less
Original file line number Diff line number Diff line change
Expand Up @@ -331,7 +331,6 @@ bread-crumbs {
saved-object-finder,
paginated-selectable-list {
.row {
background-color: @kibanaGray6;
padding: 10px;
display: flex;
flex-direction: row;
Expand Down
72 changes: 39 additions & 33 deletions src/ui/public/styles/dark-theme.less
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,9 @@

// /node_modules/bootstrap/less/buttons.less
.btn {
background-color: @dark-button-bg;
color: @dark-button-font;

&:hover,
&:focus,
&.focus {
Expand All @@ -106,7 +109,10 @@
// /node_modules/bootstrap/less/list-group.less
.list-group-item {
background-color: @list-group-bg;
border-color: @list-group-border;
border: 0 none transparent;
&:nth-child(even) {
background-color: @gray4;
}
}

a.list-group-item,
Expand Down Expand Up @@ -188,8 +194,9 @@

// /node_modules/bootstrap/less/navs.less
.nav-tabs {
border-bottom: 1px solid @nav-tabs-border-color;
border-bottom: 1px solid @gray4;
> li {
margin-bottom: -2px;
> a {
&:hover {
border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color;
Expand All @@ -200,9 +207,9 @@
&,
&:hover,
&:focus {
color: @nav-tabs-active-link-hover-color;
background-color: @nav-tabs-active-link-hover-bg;
border-color: @nav-tabs-active-link-hover-border-color;
color: @white;
background-color: @gray4;
border: 0 none transparent;
}
}
}
Expand All @@ -214,6 +221,10 @@
color: @navbar-default-color;
background-color: @navbar-default-bg;
border-color: @navbar-default-border;
button {
color: @white;
background-color: transparent;
}
}


Expand Down Expand Up @@ -276,16 +287,6 @@
.visualize-show-spy {
border-top-color: @visualize-show-spy-border;

&-tab {
border-color: @visualize-show-spy-border;
background: @visualize-show-spy-bg;
color: @visualize-show-spy-color;

&:hover {
background-color: @visualize-show-spy-hover-bg;
color: @visualize-show-spy-hover-color;
}
}
}
.visualize-spy-container {
pre {
Expand Down Expand Up @@ -322,15 +323,6 @@
// /src/ui/public/vislib/styles/_legend.less
.legend-col-wrapper {

.legend-toggle {
&:hover {
color: @sidebar-hover-color;
background-color: @sidebar-hover-bg;
}

background-color: @sidebar-bg;
}

.legend-ul {
border-left-color: @sidebar-bg;
color: @legend-item-color;
Expand All @@ -348,7 +340,7 @@
}

&-full {
background-color: @sidebar-hover-bg;
background-color: @gray3;
}

&-details {
Expand Down Expand Up @@ -437,16 +429,14 @@
}

.leaflet-left {
.leaflet-control {
.leaflet-control,
.leaflet-draw-actions {
a,
a:hover {
color: @tilemap-leaflet-control-color;
color: @dark-button-font;
background-color: @dark-button-bg;
}
}

.leaflet-draw-actions a {
background-color: @tilemap-leaflet-control-draw-action-bg;
}
}


Expand Down Expand Up @@ -486,7 +476,7 @@

// /src/ui/public/styles/config.less
.config {
border-bottom-color: @config-border;
border-bottom: 0 none transparent;

.config-close {
background-color: @config-close-bg;
Expand All @@ -511,7 +501,7 @@
background-color: @list-group-menu-item-active-bg;
}
&:hover {
background-color: @list-group-menu-item-hover-bg;
background-color: @gray2;
}
li {
color: @list-group-menu-item-color;
Expand All @@ -533,6 +523,10 @@
.pagination-other-pages {
&-list {
> li {
a {
background-color: @dark-button-bg;
color: @white;
}
&.active a {
color: @paginate-page-link-active-color;
}
Expand Down Expand Up @@ -580,4 +574,16 @@
}
}
}

saved-object-finder .form-group span {
background-color: @input-bg;
color: @dark-button-font;
}
saved-object-finder .paginate-heading {
color: @text-color;
}
.kibana-nav-actions .active {
background-color: @config-bg;
color: @dark-button-font;
}
}
21 changes: 12 additions & 9 deletions src/ui/public/styles/dark-variables.less
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@


@nav-link-hover-bg: @gray6;
@nav-tabs-active-link-hover-bg: @gray3;
@nav-tabs-active-link-hover-bg: @navbar-default-bg;

@nav-tabs-border-color: @gray6;
@nav-tabs-link-hover-border-color: @gray7;
Expand All @@ -55,15 +55,15 @@
@paginate-page-link-active-color: @gray9;


@dashboard-bg: #1e1b1e;
@panel-bg: #343434;
@panel-inner-border: @gray13;
@dashboard-bg: #272727;
@panel-bg: @dashboard-bg;
@panel-inner-border: @dashboard-bg;

@panel-default-text: @brand-primary;
@panel-default-border: #5c5c5c;
@panel-default-heading-bg: darken(@panel-bg, 5%);
@panel-default-border: @dashboard-bg;
@panel-default-heading-bg: @dashboard-bg;

@dashboard-panel-bg: @panel-bg;
@dashboard-panel-bg: @dashboard-bg;
@dashboard-panel-color: @text-color;
@dashboard-panel-heading-link-color: #a6a6a6;
@dashboard-panel-heading-link-hover-color: #a6a6a6;
Expand Down Expand Up @@ -127,7 +127,7 @@

@config-border: @gray4;
@config-bg: @body-bg;
@config-close-bg: @well-bg;
@config-close-bg: @gray3;
@config-saved-object-finder-options-bg: @body-bg;

@saved-object-finder-link-color: @text-color;
Expand All @@ -148,11 +148,14 @@
@component-active-bg: @gray9;

@navbar-default-color: @white;
@navbar-default-bg: @gray3;
@navbar-default-bg: #454545;
@navbar-default-border: darken(@navbar-default-bg, 10%);

@spinner-bg: @white;

@sidebar-bg: @btn-default-bg;
@sidebar-hover-bg: darken(@btn-default-bg, 5%);
@sidebar-hover-color: @text-color;

@dark-button-bg: @gray7;
@dark-button-font: @white;

0 comments on commit 4e9e2ca

Please sign in to comment.