rnhmjoj/solarized-dark-ui
1
0
Fork 0
mirror of https://github.com/Rnhmjoj/solarized-dark-ui synced 2025-02-03 12:54:19 +01:00
Code Issues Releases Wiki Activity

Merge pull request #5 from atom/dark-original

Browse Source 
Dark Alpha
This commit is contained in:
Ben Ogle 2013-12-04 11:25:03 -08:00
commit fa2a29d1f8
5 changed files with 78 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
index.less
View File

@ -1,15 +1,15 @@
@import 'stylesheets/atom'; @import "stylesheets/atom";
@import 'stylesheets/utilities'; @import "stylesheets/buttons";
@import 'stylesheets/text'; @import "stylesheets/editor";
@import 'stylesheets/git'; @import "stylesheets/git";
@import 'stylesheets/sites'; @import "stylesheets/lists";
@import 'stylesheets/progress'; @import "stylesheets/overlays";
@import 'stylesheets/buttons'; @import "stylesheets/panels";
@import 'stylesheets/panels'; @import "stylesheets/panes";
@import 'stylesheets/panes'; @import "stylesheets/progress";
@import 'stylesheets/lists'; @import "stylesheets/sites";
@import 'stylesheets/editor'; @import "stylesheets/tabs";
@import 'stylesheets/tabs'; @import "stylesheets/text";
@import 'stylesheets/tooltips'; @import "stylesheets/tooltips";
@import 'stylesheets/overlays'; @import "stylesheets/tree-view";
@import 'stylesheets/dropdowns'; @import "stylesheets/utilities";

31
stylesheets/lists.less
View File

@ -21,17 +21,23 @@
.generate-list-item-text-color(error); .generate-list-item-text-color(error);
.generate-list-item-text-color(selected); .generate-list-item-text-color(selected);
.generate-list-item-status-color(@textClass, @status) { .generate-list-item-status-color(@color, @status) {
li:not(.list-nested-item).status-@{status}, li:not(.list-nested-item).status-@{status},
li.list-nested-item.status-@{status} > .list-item { li.list-nested-item.status-@{status} > .list-item {
.text(@textClass); color: @color;
} }
} }
.generate-list-item-status-color(subtle, ignored);
.generate-list-item-status-color(info, added); .generate-list-item-status-color(@text-color-subtle, ignored);
.generate-list-item-status-color(success, renamed); .generate-list-item-status-color(@text-color-added, added);
.generate-list-item-status-color(warning, modified); .generate-list-item-status-color(@text-color-renamed, renamed);
.generate-list-item-status-color(error, removed); .generate-list-item-status-color(@text-color-modified, modified);
.generate-list-item-status-color(@text-color-removed, removed);
li:not(.list-nested-item).selected,
li.list-nested-item.selected > .list-item {
.text(selected);
}
li:not(.list-nested-item):hover, li:not(.list-nested-item):hover,
li.list-nested-item:hover > .list-item, // i.e. highlight directory when hover child file li.list-nested-item:hover > .list-item, // i.e. highlight directory when hover child file
@ -47,13 +53,16 @@
&.select-list ol.list-group { &.select-list ol.list-group {
li.two-lines { li.two-lines {
.secondary-line { color: @text-color-subtle; } .secondary-line { color: @text-color-subtle; }
&.selected .secondary-line { color: lighten(@text-color-subtle, 10%); } &.selected .secondary-line {
color: @text-color;
text-shadow: none;
}
} }
// We want to highlight the background of the list items because we dont // We want to highlight the background of the list items because we dont
// know their size. // know their size.
li.selected { li.selected {
background-color: @background-color-highlight; background-color: @background-color-selected;
&:before{ display: none; } &:before{ display: none; }
} }
@ -87,7 +96,7 @@
.select-list.popover-list { .select-list.popover-list {
background-color: @overlay-background-color; background-color: @overlay-background-color;
-webkit-box-shadow: 0 0 3px 3px @base-border-color; box-shadow: 0 0 10px @base-border-color;
padding: @component-padding/2; padding: @component-padding/2;
border-radius: @component-border-radius; border-radius: @component-border-radius;
border: 1px solid @overlay-border-color; border: 1px solid @overlay-border-color;
@ -109,7 +118,7 @@
// For sortable lists in the settings view // For sortable lists in the settings view
li.ui-sortable-placeholder { li.ui-sortable-placeholder {
visibility: visible !important; visibility: visible !important;
background-color: darken(@pane-item-background-color, 3%); background-color: darken(@pane-item-background-color, 10%);
} }
} }

32
stylesheets/tree-view.less Normal file
View File

@ -0,0 +1,32 @@
@import "ui-variables";
.tree-view {
font-size: @font-size;
background: @tree-view-background-color;
.selected:before {
background: #444;
box-shadow: inset -3px 0 0 rgba(0,0,0, .05);
}
}
.focusable-panel {
opacity: 1;
background: #303030;
box-shadow: inset -3px 0 0 rgba(0,0,0, .05);
&:focus {
background: #282828;
.selected:before {
background: @background-color-selected;
}
.selected > .name,
.selected > .name:before,
.selected > .list-item > .name,
.selected > .list-item > .name:before {
color: #fff !important;
}
}
}

4
stylesheets/ui-mixins.less
View File

@ -5,7 +5,7 @@
.text(normal) { .text(normal) {
font-weight: normal; font-weight: normal;
color: @text-color; color: @text-color;
text-shadow: 0 -1px 0 #333; text-shadow: none;
} }
.text(subtle) { .text(subtle) {
font-weight: normal; font-weight: normal;
@ -15,7 +15,7 @@
.text(highlight) { .text(highlight) {
font-weight: normal; font-weight: normal;
color: @text-color-highlight; color: @text-color-highlight;
text-shadow: 0 -1px 0 #333; text-shadow: 0 1px 0 rgba(0,0,0, .5);
} }
.text(selected) { .text(selected) {
.text(highlight) .text(highlight)

12
stylesheets/ui-variables.less
View File

@ -6,16 +6,22 @@
@text-color-selected: @text-color-highlight; @text-color-selected: @text-color-highlight;
@text-color-info: #5293d8; @text-color-info: #5293d8;
@text-color-success: #1fe977; @text-color-success: #529b2f;
@text-color-warning: #f78a46; @text-color-warning: #ff982d;
@text-color-error: #c00; @text-color-error: #c00;
@text-color-ignored: @text-color-subtle;
@text-color-added: @text-color-success;
@text-color-renamed: @text-color-info;
@text-color-modified: @text-color-warning;
@text-color-removed: @text-color-error;
@background-color-info: #0098ff; @background-color-info: #0098ff;
@background-color-success: #17ca65; @background-color-success: #17ca65;
@background-color-warning: #ff4800; @background-color-warning: #ff4800;
@background-color-error: #c00; @background-color-error: #c00;
@background-color-highlight: rgba(255, 255, 255, 0.07); @background-color-highlight: rgba(255, 255, 255, 0.07);
@background-color-selected: @background-color-highlight; @background-color-selected: #4182C4;
@app-background-color: #333; @app-background-color: #333;