Skip to content

Commit

Permalink
Merge pull request #38 from adambullmer/master
Browse files Browse the repository at this point in the history
Add Dark Soda / Monokai theme
  • Loading branch information
s10wen committed Feb 8, 2015
2 parents d48d782 + bd19b37 commit 2dfffd3
Show file tree
Hide file tree
Showing 2 changed files with 284 additions and 9 deletions.
37 changes: 28 additions & 9 deletions less/_panel-network.less
Original file line number Diff line number Diff line change
Expand Up @@ -75,21 +75,40 @@
}
}

/* Fallback Support */
.resource-source-frame-fallback {
background-color: @- !important; .contrast(@global-background, 5%) !important;
color: @global-text !important;
}


/* Network Timing Pane */
.resource-timing-view table {
background-color: @- !important; .contrast(@global-background, 5%) !important;
padding: 20px !important;
border-radius: 4px;
margin: 20px !important;
}
.resource-timing-view {

table {
background-color: @- !important; .contrast(@global-background, 5%) !important;
padding: 20px !important;
border-radius: 4px;
margin: 20px !important;

td {
.network-timing-bar-title {
color: @global-text !important;
text-shadow: 0 1px 1px @- !important; .contrast(@global-background, 5%);
}
}
}

.resource-timing-view table td .network-timing-bar-title {
color: @global-text !important;
text-shadow: 0 1px 1px @- !important; .contrast(@global-background, 5%);
.network-timing-table {
.footnote, .network-timing-footer {
a {
color: @global-accent;
}
}
}
}


#network-views .request-headers-view .parent {
& { background-color: @- !important; .contrast(@global-background, 2.5%) };
color: @global-text !important;
Expand Down
256 changes: 256 additions & 0 deletions themes/dark-soda-monokai.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,256 @@
//************************************************************************/
/* Dark Soda / Monokai by Adam Bullmer <adam.bullmer@gmail.com> */
/*************************************************************************/
/* Based on Sublime Text's Monokai theme */

@theme-type: dark;

// Default colours
@alpha : hsl( 80, 76%, 53%); //* light green */
@bravo : hsl(340, 95%, 56%); //* dark red */
@charlie : hsl(187, 71%, 68%); //* light blue */
@delta : hsl(261, 100%, 75%); //* purple */
@echo : hsl( 53, 66%, 71%); //* yellow */
@foxtrot : hsl( 21, 86%, 59%); //* orange */
@golf : hsl(338, 95%, 56%); //* magenta */
@hotel : hsl(203, 41%, 62%); //* blue */

@orange : #e3b959;

@white : #f8f8f2;
@grey : #676767;
@black : #272822;

// Global Settings
@text-height : 14px;
@global-accent : @alpha;
@global-arrow : #AAB0AF;
@global-background : @black;
@global-boxshadow : rgba(17,17,17,.6);
@global-divider : lighten(@global-background, 5%);
@global-hover : lighten(@global-background, 5%);
@global-input : @black;
@global-selected : #364c3b;
@global-text : @white;
@global-label : #626262;
@global-warn : @echo;
@global-error : @bravo;
@global-textshadow : @black;

// JavaScript
@js-atom : @delta;
@js-attribute : @alpha;
@js-builtin : @hotel;
@js-comment : @grey;
@js-def : @white;
@js-error : @golf;
@js-header : #ff6400;
@js-hr : #aeaeae;
@js-keyword : @golf;
@js-link : @hotel;
@js-meta : #d8fa3c;
@js-number : @delta;
@js-operator : @bravo;
@js-property : @white;
@js-string : @echo;
@js-tag : @golf;
@js-variable : @white;
@js-variable-2 : @white;

// JavaScript Objects
@js-obj-array : @white;
@js-obj-boolean : @alpha;
@js-obj-function : @charlie;
@js-obj-name : @hotel;
@js-obj-number : @alpha;
@js-obj-preview : @white;
@js-obj-regexp : @foxtrot;
@js-obj-string : @echo;
@js-obj-undefined : @golf;

// CSS
@css-at-rule : #b094bb;
@css-atom : @charlie;
@css-builtin : @alpha;
@css-comment : @grey;
@css-def : @alpha;
@css-important : @golf;
@css-meta : @charlie;
@css-number : @delta;
@css-operator : @delta;
@css-property : @charlie;
@css-qualifier : @alpha;
@css-string : @echo;
@css-string-2 : @white;
@css-tag : @golf;
@css-variable : @alpha;
@css-variable-2 : @alpha;

// HTML Highlighting
@xml-attribute : @alpha;
@xml-comment : #7c7c7c;
@xml-error : #bf4c4c;
@xml-iframe-root : #db0;
@xml-js-node : #c2c3c3;
@xml-link : #e3b959;
@xml-pseudo : #49a5d2;
@xml-pseudo-highlighted : #a6371a;
@xml-shadow-root : #db0;
@xml-string : @echo;
@xml-tag : @bravo;

// Tabbed Header Configuration
@tab-color-top : lighten(@global-background, 18%);
@tab-color-bottom : lighten(@global-background, 8%);
@tab-highlighted : @global-accent;
@tab-label : #999;
@tab-label-selected : #f8f8f8;
@tab-label-unsaved : #db0;

// Main Toolbar
@tab-main-icons-padding : 6px;
@tab-main-toolbar-height : 34px;
@tab-sub-icons-padding : 0;
@tab-sub-toolbar-height : 25px;

// Glyphs
@glyph-active : @global-accent;
@glyph-inactive : lighten(@global-background, 35%);

// Crumbs
@crumb-selected-background : @global-selected;
@crumb-selected-text : #f8f8f8;
@crumb-text : @global-text;

// Console
@console-default-text : @global-text;
@console-input-text : #f1f1f1;
@console-link : #888;

// Dialog [Ctrl/Cmd + O | Ctrl/Cmd + Shift + O]
@dialog-background : lighten(@global-background, 5%);
@dialog-border : lighten(@global-background, 20%);
@dialog-item-background : @global-background;
@dialog-item-text : lighten(@global-text, 10%);
@dialog-item-highlight : @global-accent;

// Editor Properties
@cm-cursor : #fff;
@cm-error : #9D1E15;
@cm-gutter : lighten(@global-background, 4%);
@cm-gutter-border : lighten(@global-background, 5%);
@cm-gutter-lines : lighten(@global-background, 40%);
@cm-lines-no-sourcemap : lighten(@global-background, 1%);
@cm-matching-bracket : #15ca1a;
@cm-nonmatching-bracket : #db0404;
@cm-lines-no-sourcemap : lighten(@global-background, 1%);
@cm-selected : lighten(@global-background, 10%);
@cm-whitespace : lighten(@global-background, 5%);

// Element Highlighter
@eh-base-color : @global-selected;
@eh-children-shadow : darken(@global-background, 10%);
@eh-editing-outline : @global-accent;
@eh-highlight-background : @selection-background;
@eh-highlight-outline : @selection-border;
@eh-hover-background : @hover-background;
@eh-hover-outline : @hover-border;
@eh-clipboard-selection : lighten(@global-background, 40%);

// Elements Sidebar
@style-edit-mode-selector-text : #999;
@style-selector-text : @grey;
@style-separator : lighten(@global-background, 10%);
@style-value : @delta;

// Filters
@filter-background : lighten(@global-background,5%);
@filter-text : @global-text;
@filter-hover : lighten(@global-background, 10%);
@filter-selected : lighten(@global-background, 15%);
@filter-selected-text : lighten(@global-text, 15%);
@filter-error : @global-error;
@filter-warning : #db0;
@filter-info : #49a6d2;
@filter-log : @bravo;
@filter-debug : #FC844C;

// Find
@find-header-background : lighten(@global-background, 3%);
@find-header-text : #888;
@find-highlight-background : @global-accent;
@find-highlight-text : #000;

// Forms
@form-button-background : linear-gradient(@tab-color-top, @tab-color-bottom);
@form-button-border : lighten(@global-background, 10%);
@form-button-pressed : inset 0 1px 1px 0 darken(@global-background, 5%), 0 1px 1px 0 lighten(@global-background, 30%);
@form-button-text : darken(@global-text, 10%);
@form-input-background : lighten(@global-background, 5%);
@form-input-border : lighten(@global-background, 10%);
@form-input-text : lighten(@global-text, 10%);
@form-label-text : @global-text;

// Local Modifications
@history-added-text : #7EB17E;
@history-removed-text : @global-error;

// Screencast
@screencast-viewport : lighten(@global-background, 10%);
@screencast-viewport-border : @global-accent;

// Scrollbars
@sb-thickness : 12px;
@sb-thumb-border : darken(@global-background, 10%);
@sb-thumb-color : lighten(@global-background, 20%);
@sb-thumb-roundness : 8px;

// Settings
@settings-background : #444;
@settings-border : #555;
@settings-delimiter : #eee;
@settings-dialog : #333;
@settings-edit-background : #222;
@settings-folder-background : #222;
@settings-selected : rgba(150, 255, 150, 0.2);
@settings-text : #333;

// Table/Sidebar Selections | Breakpoints
@selection-background : @global-selected;
@selection-border : lighten(@selection-background, 15%);
@selection-text : lighten(@global-text, 10%);
@hover-background : @global-hover;
@hover-border : lighten(@hover-background, 10%);
@hover-text : @global-text;

// Sources Tab
@sources-exception-all : rgba(220,3,3,1);
@sources-exception-uncaught : rgb(213,191,0);
@sources-highlight-text : @black;
@sources-pane-background : rgba(0,0,0,.8);
@sources-placeholder-text : #999;
@sources-save-background : rgba(255,255,255,0.2);
@sources-text : @grey;

// Tables
@table-primary : @global-background;
@table-secondary : lighten(@global-background,2%);

// Timeline
@timeline-expandable-border : lighten(@global-background, 35%);
@timeline-graph-bar : rgba(200,200,200,.3);
@timeline-graph-bar-background : rgba(200,200,200,.2);
@timeline-overview-background : rgba(0,0,0,.8);
@timeline-graph-selection : @global-accent;
@timeline-progress-pane : fade(lighten(@global-background,30%), 50%);
@timeline-resources-divider : lighten(@global-background, 3%);

// Popovers
@popover-details-row-title : @bravo;
@popover-details-title : #db0;
@popover-title : #ff8b3e;
@popover-tree-border : #888;

@popover-background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGkAAABpCAYAAAA5gg06AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMzNFODNCNTE0QTZFMjExQjY2OUE2RUJCODYzRjA1RCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo5MDY1NzM5QkE2QTMxMUUyQkZBRkJBNzVEQjUzM0I4RCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo5MDY1NzM5QUE2QTMxMUUyQkZBRkJBNzVEQjUzM0I4RCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1LjEgV2luZG93cyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA0M0U4M0I1MTRBNkUyMTFCNjY5QTZFQkI4NjNGMDVEIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAzM0U4M0I1MTRBNkUyMTFCNjY5QTZFQkI4NjNGMDVEIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+4LICiQAAAl5JREFUeNrs3c9KVFEAwGHHmVEb6R85oLWpRArBIINo1RNEtIgmgqAnqF0v0M5WQdDGVYVU0EsEUYRERUhUCxdJVihpOZhTcztHZ6JFEQ13cet+PzjXGWFmcb45xzsgnEKSJF3Kdt2mAJIgQRIkQYIkSIIESZAgCZI6q9TpCyfqN3I9cRcrZ60kQcrHdveHhsMY/58n7jfb/WoYj+8cvTL38y+np6czhRRhamEcy/Mn/9S9C1Phx2TAepe1lTQSxvrH6+OrDz3vn7zpyxtOsbeUDB8f+xQenol/SgLW5QC1miWk0/Eyc/3RtueTD6p5XUXPrt2vjp47vLCvNh7n421cUVm5cRiKSJ/nlkp5Boo1Vr4UX999ur31tJalu7s98bI8u9DjXqyra2V+udxYWYtzuzNseZWsIJXjpdn4VkC0UdL88a9yRd+TfJkVJEGCJEiCBEmQIAmSIEESJEGCJEiQBEmQIAmSIEESJEGCJEiQBEmQIAmSIEESJEiCJEiQBEmQIAmSIEESJEiCJEiQBEmQIAkSJFMASZAg/U3rx88U+8qJKW1NbLm7PReNrCC9iJehI7vrmwb6v+YdqHpgV7208YF9mcb5SWkhLYVxMz4YOXlwsX9wSyPPQMMnxpZaT2+l8Z6FJOlsh/rFmXabw3jYfrIwM9+bNJNcnQJTrpSbW/cOrLWBwiq6FB9k6Uy/eEzaoTDOh1HbMTqY18W0GMbtAHQ1rTdM++DFuP9OtMb+HN491gPObNpvmuZ2l6uc2CxI/1odb3eykgQJkiBBEiRBgiRIggRJkCAp830XYABd2IbZvLB5+AAAAABJRU5ErkJggg==);

@popover-arrow: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAABMCAYAAACPiIzuAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTNFODNCNTE0QTZFMjExQjY2OUE2RUJCODYzRjA1RCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyMzdGN0JCRUE2QTQxMUUyOUFDOUJDNzA3QUQ2RDI5QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyMzdGN0JCREE2QTQxMUUyOUFDOUJDNzA3QUQ2RDI5QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1LjEgV2luZG93cyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAyM0U4M0I1MTRBNkUyMTFCNjY5QTZFQkI4NjNGMDVEIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAxM0U4M0I1MTRBNkUyMTFCNjY5QTZFQkI4NjNGMDVEIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+FMRF/AAAA6FJREFUeNrsl11IFFEUx1fdolbX/XBLM/tAt6JwtVo17CHooaAHCwvTwhJEkkgUEYyKIBCl3HwIfIko6JMUesgeLEstKwTZMtLwgyxDw7CHXfNbW+wcuXcYh5n1zp2FKBw4zJ2P/e25d84953+C5ubmdIE6gpZgfxl2ZfyOJkCp4YQwDtYF8AgoTK8VkJSUpMqzXLBn5KzJs4tgWWRcAmYDq+RZswsI6qvrML4sehRN7uWAFauFnQM7joMvTzrNw+2Doa/P1kWRZ3lgBaywUrBsHKBHnp7hFTgeav1qbL1UH0neOQ2WvxiskExFh56gR+KHA0294W5Xo036rhxM+Df0AD2RmwpM2/KhuiWCzuJoS9FhKUxYh7aKhlXogb9P3Fvbbv14/a2VXJYBcD+F2egXelfVZOt/2mVmCdbu++6IzputFnKZRWGpOMAQ6HvcYVET/f31Xaax7yMYq7vAuzUIe44P4g46RuPzUn+ygkKjwmc3ZWz3hK01/YbLh7V7rg0hbIpOc9vJFC8LMCzGPGM/kujZkrlzBEFgVeIP0MAKDN9onbanJ4hBLvBqQhoaCCzyB0RQbFq8d3PGjl8EVAGgKaWgfUFDBIGOU7sFoNlum7KnJ3pEoDIw32JZo5kAq7dmJ3vxxuCrz8Z9N44NkOcUpKoG7EWg5N4DsHLxDZgmUwpqJturmVzfloLUJsc3xAxgE4GqAYogt9v9D5S6JRX0P8GYglYsTqQHpOsQOGWCLdOkggCEFeoMLSh6DaAQCuqpeW/Sqs/OU1D3PbfVN+sL1nN6JSgkKI/m6ZFJPdfeBNAChTQ26F3OtdEBVCKnkFTDAFRIpaicQmIO2sqJuwfgdJUqJCVhw+pZJotCYoVhgdaZ4mwzhtXGWa2wGqyXKAlQrKBo4YZBbfQRcTIPRNESGm2a4a4BRJy4BGB6ghfVEHdBISLlMgXGHXIsAKreAQDE9aoQA43rLdORznXjTHEml89I1pjf7D/avq2MStkwyQ0TQYX+KsjpdGpO1wBMhpMXJVUuifAaWI9b/n4k1hVKcYaZIAbP8A+lmrSGtAUEYDE3TK4FBGABF0ypBQRgviZJJW0BAZijSZ/5awG5xJ5SC8itHOVaQE0yVNoCcsPkWkAuFYQ5ClOLtAVUDZPp3Fzizo0ZptAC+lSLPWwBY9McXsjto2SNylQrR+wppS0gD4i2iJ/ELSCAyrXkM6EF9Adi8gzTNgSkgTbtWjLtHwEGAIab1RKaLSq+AAAAAElFTkSuQmCC);

0 comments on commit 2dfffd3

Please sign in to comment.