Merge pull request #3670 from riking/dark-theme-fix

Dark theme fixes, part 3
This commit is contained in:
Sam 2015-08-19 15:25:41 +10:00
commit f1bce927b3
6 changed files with 26 additions and 34 deletions

View file

@ -26,7 +26,7 @@
.number, .time-read { .number, .time-read {
font-size: 1.4em; font-size: 1.4em;
color: dark-light-diff($primary, $secondary, 50%, -50%); color: dark-light-diff($primary, $secondary, 50%, -20%);
} }
} }
@ -35,7 +35,7 @@
background-color: dark-light-diff($highlight, $secondary, 70%, -80%); background-color: dark-light-diff($highlight, $secondary, 70%, -80%);
.username a, .name, .title, .number, .time-read { .username a, .name, .title, .number, .time-read {
color: scale-color($highlight, $lightness: -50%); color: dark-light-choose(scale-color($highlight, $lightness: -50%), scale-color($highlight, $lightness: 50%));
} }
} }
} }

View file

@ -129,6 +129,11 @@ aside.quote {
} }
} }
.topic-body {
&.highlighted {
background-color: dark-light-diff($tertiary, $secondary, 85%, -65%);
}
}
.wiki .topic-body { .wiki .topic-body {
background-color: dark-light-diff($wiki, $secondary, 95%, -50%); background-color: dark-light-diff($wiki, $secondary, 95%, -50%);
} }
@ -269,7 +274,7 @@ table.md-table {
font-size: 35px; font-size: 35px;
width: 45px; width: 45px;
text-align: center; text-align: center;
color: lighten($primary, 75%); color: dark-light-diff($primary, $secondary, 75%, 20%);
} }
} }
@ -279,7 +284,7 @@ table.md-table {
text-transform: uppercase; text-transform: uppercase;
font-weight: bold; font-weight: bold;
font-size: 0.9em; font-size: 0.9em;
color: lighten($primary, 50%); color: dark-light-diff($primary, $secondary, 50%, 0%);
.custom-message { .custom-message {
text-transform: none; text-transform: none;

View file

@ -28,18 +28,13 @@
} }
b { b {
color: #000;
background: #eee;
border-style: solid;
border-color: #ccc #aaa #888 #bbb;
padding: 2px 6px; padding: 2px 6px;
border-radius: 4px; border-radius: 4px;
box-shadow: 0 2px 0 rgba(0,0,0,0.2),0 0 0 1px #fff inset; box-shadow: 0 2px 0 rgba(0,0,0,0.2),0 0 0 1px dark-light-choose(#fff,#000) inset;
background-color: #fafafa; background: dark-light-choose(#fafafa, #333);
border-color: #ccc #ccc #fff; border: 1px solid dark-light-choose(#ccc, #555);
border-style: solid solid none; border-bottom: medium none dark-light-choose(#fff, #000);
border-width: 1px 1px medium; color: dark-light-choose(#444, #aaa);
color: #444;
white-space: nowrap; white-space: nowrap;
display: inline-block; display: inline-block;
} }

View file

@ -699,9 +699,6 @@ $topic-avatar-width: 45px;
z-index: 2; z-index: 2;
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -75%); border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -75%);
padding: 12px $topic-body-width-padding 15px $topic-body-width-padding; padding: 12px $topic-body-width-padding 15px $topic-body-width-padding;
&.highlighted {
background-color: dark-light-diff($tertiary, $secondary, 85%, -65%);
}
} }
.topic-avatar { .topic-avatar {
border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -75%); border-top: 1px solid dark-light-diff($primary, $secondary, 90%, -75%);

View file

@ -214,7 +214,6 @@
width: 100%; width: 100%;
margin-bottom: 10px; margin-bottom: 10px;
overflow: hidden; overflow: hidden;
color: $secondary;
&.group { &.group {
.details { .details {
@ -269,7 +268,7 @@
.details { .details {
padding: 15px 15px 4px 15px; padding: 15px 15px 4px 15px;
margin-top: -200px; margin-top: -200px;
background: rgba($primary, .85); background: dark-light-choose(rgba($primary, .85), rgba($secondary, .85));
transition: margin .15s linear; transition: margin .15s linear;
h1 { h1 {
@ -316,20 +315,20 @@
width: 100%; width: 100%;
position: relative; position: relative;
float: left; float: left;
color: $secondary; color: dark-light-choose($secondary, lighten($primary, 10%));
h1 {font-weight: bold;} h1 {font-weight: bold;}
.primary-textual { .primary-textual {
padding: 3px; padding: 3px;
a[href] { a[href] {
color: $secondary; color: dark-light-choose($secondary, lighten($primary, 10%));
} }
} }
.bio { .bio {
color: $secondary; color: dark-light-choose($secondary, lighten($primary, 10%));
max-height: 300px; max-height: 300px;
overflow: auto; overflow: auto;
max-width: 750px; max-width: 750px;
@ -396,7 +395,7 @@
.details { .details {
padding: 12px 15px 2px 15px; padding: 12px 15px 2px 15px;
margin-top: 0; margin-top: 0;
background: rgba($primary, 1); background: dark-light-choose(rgba($primary, 1), scale-color($secondary, $lightness: 40%));
.bio { display: none; } .bio { display: none; }
.primary { .primary {
@ -533,21 +532,21 @@
.staff-counters { .staff-counters {
text-align: left; text-align: left;
background: $primary; background: $primary;
color: $secondary;
a {
color: $secondary;
}
> div { > div {
margin: 0 10px 0 0; margin: 0 10px 0 0;
display: inline-block; display: inline-block;
padding: 5px 0; padding: 5px 0;
&:first-of-type { &:first-of-type {
padding-left: 10px; padding-left: 10px;
} }
span { span {
padding: 1px 5px; padding: 1px 5px;
border-radius: 10px; border-radius: 10px;
} }
}
a {
color: $secondary;
} }
.active { .active {
font-weight: bold; font-weight: bold;

View file

@ -463,12 +463,8 @@ blockquote {
.posts-wrapper { position: relative; } .posts-wrapper { position: relative; }
.topic-body.highlighted {
background-color: scale-color($tertiary, $lightness: 75%);
}
span.highlighted { span.highlighted {
background-color: scale-color($highlight, $lightness: 70%); background-color: dark-light-choose(scale-color($highlight, $lightness: 70%), $highlight);
} }
.topic-avatar { .topic-avatar {