FIX: Dark theme fixes for admin, quotes, code

This commit is contained in:
Kane York 2015-08-18 12:23:06 -07:00
parent 3edf0e662f
commit a4da72a83b
6 changed files with 29 additions and 23 deletions

View File

@ -129,16 +129,16 @@ td.flaggers td {
} }
.admin-controls { .admin-controls {
background-color: dark-light-diff($primary, $secondary, 90%, -75%); background-color: dark-light-diff($primary, $secondary, 90%, -65%);
padding: 10px 10px 3px 0; padding: 10px 10px 3px 0;
@include clearfix; @include clearfix;
.nav.nav-pills { .nav.nav-pills {
li.active { li.active {
a { a {
border-color: dark-light-diff($primary, $secondary, 90%, -60%); border-color: dark-light-diff($primary, $secondary, 90%, -90%);
background-color: lighten($primary, 40%); background-color: dark-light-diff($primary, $secondary, 40%, -10%);
&:hover { &:hover {
background-color: lighten($primary, 40%); background-color: dark-light-diff($primary, $secondary, 40%, -10%);
} }
} }
} }
@ -1113,7 +1113,7 @@ table.api-keys {
.content-list { .content-list {
h3 { h3 {
color: dark-light-diff($primary, $secondary, 50%, -60%); color: dark-light-diff($primary, $secondary, 50%, -20%);
font-size: 1.071em; font-size: 1.071em;
padding-left: 5px; padding-left: 5px;
margin-bottom: 10px; margin-bottom: 10px;

View File

@ -7,7 +7,7 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
.hljs { .hljs {
display: block; display: block;
padding: 0.5em; padding: 0.5em;
color: #333; color: dark-light-choose(#333, #f8f8f8);
} }
.hljs-comment, .hljs-comment,
@ -26,7 +26,7 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
.hljs-subst, .hljs-subst,
.hljs-request, .hljs-request,
.hljs-status { .hljs-status {
color: #333; color: dark-light-choose(#333, #f8f8f8);
font-weight: bold; font-weight: bold;
} }
@ -40,7 +40,7 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
.hljs-tag .hljs-value, .hljs-tag .hljs-value,
.hljs-phpdoc, .hljs-phpdoc,
.tex .hljs-formula { .tex .hljs-formula {
color: #d14; color: dark-light-choose(#d14, #f66);
} }
.hljs-title, .hljs-title,
@ -70,14 +70,14 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
.hljs-tag .hljs-title, .hljs-tag .hljs-title,
.hljs-rules .hljs-property, .hljs-rules .hljs-property,
.django .hljs-tag .hljs-keyword { .django .hljs-tag .hljs-keyword {
color: #000080; color: dark-light-choose(#000080, #99f);
font-weight: normal; font-weight: normal;
} }
.hljs-attribute, .hljs-attribute,
.hljs-variable, .hljs-variable,
.lisp .hljs-body { .lisp .hljs-body {
color: #008080; color: dark-light-choose(#008080, #0ee);
} }
.hljs-regexp { .hljs-regexp {
@ -132,8 +132,8 @@ github.com style (c) Vasily Polovnyov <vast@whiteants.net>
*/ */
p > code, li > code, pre > code { p > code, li > code, pre > code {
color: #333; color: dark-light-choose(#333, #f8f8f8);
background: #f8f8f8; background: dark-light-choose(#f8f8f8, #333);
} }
// removed some unnecessary styles here // removed some unnecessary styles here

View File

@ -32,8 +32,8 @@ small {
blockquote { blockquote {
background-color: dark-light-diff($primary, $secondary, 97%, -45%); border-left: 5px solid dark-light-diff($primary, $secondary, 90%, -75%);
border-left: 5px solid dark-light-diff($primary, $secondary, 90%, -65%); background-color: dark-light-diff($primary, $secondary, 97%, -65%);
overflow: hidden; overflow: hidden;
clear: both; clear: both;
} }

View File

@ -50,8 +50,8 @@ aside.quote {
.badge-wrapper { margin-left: 5px; } .badge-wrapper { margin-left: 5px; }
.title { .title {
border-left: 5px solid dark-light-diff($primary, $secondary, 90%, -65%); border-left: 5px solid dark-light-diff($primary, $secondary, 90%, -75%);
background-color: dark-light-diff($primary, $secondary, 97%, -45%); background-color: dark-light-diff($primary, $secondary, 97%, -65%);
color: scale-color($primary, $lightness: 30%); color: scale-color($primary, $lightness: 30%);
// IE will screw up the blockquote underneath if bottom padding is 0px // IE will screw up the blockquote underneath if bottom padding is 0px
padding: 12px 12px 1px 12px; padding: 12px 12px 1px 12px;
@ -113,8 +113,8 @@ aside.quote {
.quote-button { .quote-button {
display: none; display: none;
position: absolute; position: absolute;
background-color: scale-color($primary, $lightness: 50%); background-color: dark-light-diff($primary, $secondary, 50%, -50%);
color: $secondary; color: dark-light-choose($secondary, $primary);
padding: 10px; padding: 10px;
z-index: 401; z-index: 401;
@ -124,7 +124,7 @@ aside.quote {
} }
&:hover { &:hover {
background-color: scale-color($primary, $lightness: 40%); background-color: dark-light-diff($primary, $secondary, 40%, -40%);
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -73,17 +73,16 @@
.btn-primary { .btn-primary {
border: none; border: none;
color: $secondary;
font-weight: normal; font-weight: normal;
color: #fff; color: dark-light-choose($primary, scale-color($primary, $lightness: 60%));
background: $tertiary; background: dark-light-choose($tertiary, $tertiary);
&[href] { &[href] {
color: $secondary; color: $secondary;
} }
&:hover { &:hover {
color: #fff; color: #fff;
background: scale-color($tertiary, $lightness: -20%); background: dark-light-choose(scale-color($tertiary, $lightness: -20%), scale-color($tertiary, $lightness: -20%));
} }
&:active { &:active {
@include linear-gradient(scale-color($tertiary, $lightness: -20%), scale-color($tertiary, $lightness: -10%)); @include linear-gradient(scale-color($tertiary, $lightness: -20%), scale-color($tertiary, $lightness: -10%));

View File

@ -42,3 +42,10 @@ $base-font-family: Helvetica, Arial, sans-serif !default;
@return scale-color($adjusted-color, $lightness: $darkness); @return scale-color($adjusted-color, $lightness: $darkness);
} }
} }
@function dark-light-choose($light-theme-result, $dark-theme-result) {
@if brightness($primary) < brightness($secondary) {
@return $light-theme-result;
} @else {
@return $dark-theme-result;
}
}