mirror of
https://github.com/codeninjasllc/discourse.git
synced 2025-02-17 12:11:16 -05:00
Merge pull request #3670 from riking/dark-theme-fix
Dark theme fixes, part 3
This commit is contained in:
commit
f1bce927b3
6 changed files with 26 additions and 34 deletions
|
@ -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%));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
@ -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%);
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
Loading…
Reference in a new issue