Discourse/discourse
Discourse/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-09-06 10:50:21 +08:00
Code Packages Activity Actions 9

removing scale-color, first pass

Browse source
This commit is contained in:
Kris 2017-10-10 16:07:46 -04:00 • committed by Robin Ward
parent c2a8b95e83
commit dc2d9f05dc
63 changed files with 285 additions and 271 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/assets/stylesheets/common/admin/admin_base.scss
View file

@ -512,7 +512,7 @@ $mobile-breakpoint: 700px;
} }
.desc { .desc {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
h3 { h3 {
@ -545,7 +545,7 @@ section.details {
} }
#selected-controls { #selected-controls {
background-color: scale-color($tertiary, $lightness: 75%); background-color: $tertiary-low;
padding: 8px; padding: 8px;
min-height: 27px; min-height: 27px;
position: fixed; position: fixed;
@ -581,7 +581,7 @@ section.details {
border-top: 0; border-top: 0;
} }
&.highlight-danger { &.highlight-danger {
background-color: scale-color($danger, $lightness: 50%); background-color: $danger-low;
} }
border-top: 1px solid $primary-low; border-top: 1px solid $primary-low;
&:before, &:after { &:before, &:after {
@ -651,7 +651,7 @@ section.details {
font-weight: normal; font-weight: normal;
padding: 0 6px; padding: 0 6px;
color: $secondary; color: $secondary;
background-color: scale-color($tertiary, $lightness: 50%); background-color: $tertiary-medium;
border-radius: 3px; border-radius: 3px;
} }
} }
@ -661,7 +661,7 @@ section.details {
p.help { p.help {
margin: 0; margin: 0;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 0.9em; font-size: 0.9em;
} }
} }
@ -679,7 +679,7 @@ section.details {
.current-badge-actions { .current-badge-actions {
margin: 10px; margin: 10px;
padding: 10px; padding: 10px;
border-top: 1px solid dark-light-choose(scale-color($primary, $lightness: 80%), scale-color($secondary, $lightness: 20%)); border-top: 1px solid dark-light-choose($primary-low, $secondary-high);
} }
.buttons { .buttons {
@ -732,7 +732,7 @@ section.details {
.groups { .groups {
.ac-wrap { .ac-wrap {
width: 100% !important; width: 100% !important;
border-color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); border-color: dark-light-choose($primary-low-mid, $secondary-high);
.item { .item {
margin-right: 10px; margin-right: 10px;
} }
@ -754,7 +754,7 @@ section.details {
} }
.select2-choices { .select2-choices {
width: 100%; width: 100%;
border-color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); border-color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.content-list { .content-list {
@ -1250,7 +1250,7 @@ table.api-keys {
margin: 0 0 20px 6px; margin: 0 0 20px 6px;
a.filter { a.filter {
display: inline-block; display: inline-block;
background-color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); background-color: dark-light-choose($primary-low-mid, $secondary-high);
padding: 3px 10px; padding: 3px 10px;
border-radius: 3px; border-radius: 3px;
@ -1283,7 +1283,7 @@ table.api-keys {
.staff-actions, .screened-emails, .screened-urls, .screened-ip-addresses, .permalinks, .web-hook-events { .staff-actions, .screened-emails, .screened-urls, .screened-ip-addresses, .permalinks, .web-hook-events {
border-bottom: dotted 1px dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); border-bottom: dotted 1px dark-light-choose($primary-low-mid, $secondary);
.heading-container { .heading-container {
width: 100%; width: 100%;
@ -1607,7 +1607,7 @@ table#user-badges {
} }
p.description { p.description {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin-bottom: 1em; margin-bottom: 1em;
max-width: 700px; max-width: 700px;
} }
@ -1629,7 +1629,7 @@ table#user-badges {
.reply-key { .reply-key {
display: block; display: block;
font-size: 12px; font-size: 12px;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.username div { .username div {
max-width: 180px; max-width: 180px;

4
app/assets/stylesheets/common/admin/customize.scss
View file

@ -35,7 +35,7 @@
.select2-chosen, .color-schemes li { .select2-chosen, .color-schemes li {
.fa { .fa {
margin-right: 6px; margin-right: 6px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
.show-current-style { .show-current-style {
@ -173,7 +173,7 @@
td.actions { width: 200px; } td.actions { width: 200px; }
.hex-input { width: 80px; margin-bottom: 0; } .hex-input { width: 80px; margin-bottom: 0; }
.hex { text-align: center; } .hex { text-align: center; }
.description { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } .description { color: dark-light-choose($primary-medium, $secondary-medium); }
.invalid .hex input { .invalid .hex input {
background-color: white; background-color: white;

4
app/assets/stylesheets/common/admin/flagging.scss
View file

@ -6,7 +6,7 @@
.flagged-post.deleted { .flagged-post.deleted {
.flagged-post-excerpt, .flagged-post-avatar { .flagged-post-excerpt, .flagged-post-avatar {
background-color: scale-color($danger, $lightness: 70%); background-color: $danger-low;
} }
} }
@ -122,7 +122,7 @@
} }
&:hover { &:hover {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
} }
} }

22
app/assets/stylesheets/common/base/_topic-list.scss
View file

@ -74,7 +74,7 @@
border: none; border: none;
td { td {
border-bottom: 1px solid scale-color($danger, $lightness: 60%); border-bottom: 1px solid $danger-low;
line-height: 0.1em; line-height: 0.1em;
padding: 0px; padding: 0px;
text-align: center; text-align: center;
@ -82,7 +82,7 @@
td span { td span {
background-color: $secondary; background-color: $secondary;
color: scale-color($danger, $lightness: 60%); color: $danger-low;
padding: 0px 8px; padding: 0px 8px;
font-size: 0.929em; font-size: 0.929em;
} }
@ -100,14 +100,14 @@
} }
th { th {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
font-size: 1em; font-size: 1em;
button .d-icon {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));} button .d-icon {color: dark-light-choose($primary-medium, $secondary-medium);}
} }
td { td {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 1em; font-size: 1em;
} }
@ -122,7 +122,7 @@
.topic-excerpt { .topic-excerpt {
font-size: 0.929em; font-size: 0.929em;
margin-top: 8px; margin-top: 8px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
word-wrap: break-word; word-wrap: break-word;
line-height: 1.4; line-height: 1.4;
padding-right: 20px; padding-right: 20px;
@ -167,7 +167,7 @@
.category .badge-notification { .category .badge-notification {
background-color:transparent; background-color:transparent;
color: scale-color($primary, $lightness: 50%); color: $primary-medium;
} }
.subcategories .badge { .subcategories .badge {
@ -224,7 +224,7 @@
background-color: transparent; background-color: transparent;
padding: 0; padding: 0;
border: 0; border: 0;
color: scale-color($danger, $lightness: 20%); color: $danger-medium;
font-size: 0.929em; font-size: 0.929em;
cursor: default; cursor: default;
} }
@ -309,7 +309,7 @@ ol.category-breadcrumb {
} }
.top-date-string { .top-date-string {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
font-weight: normal; font-weight: normal;
text-transform: uppercase; text-transform: uppercase;
} }
@ -369,12 +369,12 @@ ol.category-breadcrumb {
} }
div.education { div.education {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.list-cell { .list-cell {
padding: 12px 5px; padding: 12px 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.table-heading { .table-heading {

4
app/assets/stylesheets/common/base/alert.scss
View file

@ -1,6 +1,6 @@
.alert { .alert {
padding: 8px 35px 8px 14px; padding: 8px 35px 8px 14px;
background-color: scale-color($danger, $lightness: 75%); background-color: $danger-low;
color: #c09853; color: #c09853;
.close { .close {
@ -30,7 +30,7 @@
-webkit-appearance: none; -webkit-appearance: none;
} }
&.alert-success { &.alert-success {
background-color: $success-low; background-color: $success-medium;
color: $primary; color: $primary;
} }
&.alert-error { &.alert-error {

2
app/assets/stylesheets/common/base/category-list.scss
View file

@ -76,7 +76,7 @@
padding: 0 1em 1em 1em; padding: 0 1em 1em 1em;
text-align: center; text-align: center;
font-size: 1.05em; font-size: 1.05em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
.overflow { .overflow {
max-height: 6em; max-height: 6em;
overflow: hidden; overflow: hidden;

2
app/assets/stylesheets/common/base/combobox.scss
View file

@ -26,7 +26,7 @@
.select2-drop { .select2-drop {
background: $secondary; background: $secondary;
.d-icon { .d-icon {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }

8
app/assets/stylesheets/common/base/compose.scss
View file

@ -35,7 +35,7 @@
background-color: $tertiary-low; background-color: $tertiary-low;
} }
@include hover { @include hover {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
text-decoration: none; text-decoration: none;
} }
} }
@ -92,8 +92,8 @@ div.ac-wrap div.item a.remove, .remove-link {
display: inline-block; display: inline-block;
border: 1px solid $primary-low; border: 1px solid $primary-low;
&:hover { &:hover {
background-color: scale-color($danger, $lightness: 75%); background-color: $danger-low;
border: 1px solid scale-color($danger, $lightness: 30%); border: 1px solid $danger-medium;
text-decoration: none; text-decoration: none;
color: $danger; color: $danger;
} }
@ -162,7 +162,7 @@ div.ac-wrap {
} }
#draft-status, #file-uploading { #draft-status, #file-uploading {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.composer-bottom-right { .composer-bottom-right {

4
app/assets/stylesheets/common/base/directory.scss
View file

@ -36,10 +36,10 @@
tr.me { tr.me {
td { td {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
.username a, .name, .title, .number, .time-read { .username a, .name, .title, .number, .time-read {
color: dark-light-choose(scale-color($highlight, $lightness: -50%), scale-color($highlight, $lightness: 50%)); color: dark-light-choose(scale-color($highlight, $lightness: -50%), $highlight-medium);
} }
} }
} }

10
app/assets/stylesheets/common/base/discourse.scss
View file

@ -132,7 +132,7 @@ input {
} }
&.invalid { &.invalid {
background-color: dark-light-choose(scale-color($danger, $lightness: 80%), scale-color($danger, $lightness: -60%)); background-color: dark-light-choose($danger-low, scale-color($danger, $lightness: -60%));
} }
.radio &[type="radio"], .radio &[type="radio"],
@ -191,19 +191,19 @@ input {
} }
// the default for table cells in topic list // the default for table cells in topic list
// is scale-color($primary, $lightness: 50%) // is $primary-medium
// numbers get dimmer as they get colder // numbers get dimmer as they get colder
.coldmap { .coldmap {
&-high { &-high {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)) !important; color: dark-light-choose($primary-low-mid, $secondary-high) !important;
} }
&-med { &-med {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)) !important; color: dark-light-choose($primary-medium, $secondary-high) !important;
} }
&-low { &-low {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)) !important; color: dark-light-choose($primary-medium, $secondary-medium) !important;
} }
} }

6
app/assets/stylesheets/common/base/emoji.scss
View file

@ -76,7 +76,7 @@ img.emoji {
.emoji-picker .section-header .clear-recent .fa{ .emoji-picker .section-header .clear-recent .fa{
margin: 0; margin: 0;
padding: 0; padding: 0;
color: dark-light-choose(scale-color($header_primary, $lightness: 50%), $header_primary); color: dark-light-choose($header_primary-medium, $header_primary);
&:hover { &:hover {
color: $primary; color: $primary;
@ -197,7 +197,7 @@ img.emoji {
} }
.emoji-picker .filter .d-icon-search { .emoji-picker .filter .d-icon-search {
color: dark-light-choose(scale-color($header_primary, $lightness: 50%), $header_primary); color: dark-light-choose($header_primary-medium, $header_primary);
font-size: 16px; font-size: 16px;
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
@ -239,7 +239,7 @@ img.emoji {
top: 12px; top: 12px;
border: 0; border: 0;
background: none; background: none;
color: dark-light-choose(scale-color($header_primary, $lightness: 50%), $header_primary); color: dark-light-choose($header_primary-medium, $header_primary);
outline: none; outline: none;
display: none; display: none;

4
app/assets/stylesheets/common/base/group.scss
View file

@ -15,7 +15,7 @@
.group-info-full-name { .group-info-full-name {
font-size: 1.2em; font-size: 1.2em;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
span { span {
@ -93,7 +93,7 @@ table.group-members {
border-bottom: 3px solid $primary-low; border-bottom: 3px solid $primary-low;
text-align: center; text-align: center;
padding: 5px 0px 5px 5px; padding: 5px 0px 5px 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
} }

8
app/assets/stylesheets/common/base/groups.scss
View file

@ -8,7 +8,7 @@
width: 100%; width: 100%;
th { th {
border-bottom: 1px solid $primary-low; border-bottom: 1px solid $primary-low;
padding: 5px 0px; padding: 5px 0px;
text-align: left; text-align: left;
} }
@ -30,16 +30,16 @@
.groups-info-name { .groups-info-name {
font-weight: bold; font-weight: bold;
color: $primary; color: $primary;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
.groups-info-full-name { .groups-info-full-name {
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
.groups-info-title { .groups-info-title {
font-size: 0.9em; font-size: 0.9em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
span { span {

2
app/assets/stylesheets/common/base/header.scss
View file

@ -151,7 +151,7 @@
.unread-notifications { .unread-notifications {
left: auto; left: auto;
right: 0; right: 0;
background-color: scale-color($tertiary, $lightness: 50%); background-color: dark-light-choose($tertiary-medium, $tertiary);
} }
.unread-private-messages, .ring { .unread-private-messages, .ring {
left: auto; left: auto;

8
app/assets/stylesheets/common/base/history.scss
View file

@ -40,11 +40,11 @@
} }
.diff-ins { .diff-ins {
color: dark-light-choose($primary, $secondary); color: dark-light-choose($primary, $secondary);
background: scale-color($success, $lightness: 90%); background: $success-low;
} }
ins { ins {
color: $success; color: $success;
background: scale-color($success, $lightness: 90%); background: $success-low;
} }
del, .diff-del { del, .diff-del {
code, img { code, img {
@ -67,11 +67,11 @@
filter: alpha(opacity=50); filter: alpha(opacity=50);
} }
.diff-del { .diff-del {
background: scale-color($danger, $lightness: 60%); background: $danger-low;
} }
del { del {
color: $danger; color: $danger;
background: scale-color($danger, $lightness: 60%); background: $danger-low;
} }
span.date { span.date {
font-weight: bold; font-weight: bold;

10
app/assets/stylesheets/common/base/login.scss
View file

@ -29,7 +29,7 @@ $input-width: 220px;
.disclaimer { .disclaimer {
font-size: 0.9em; font-size: 0.9em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
clear: both; clear: both;
} }
@ -56,7 +56,7 @@ $input-width: 220px;
float: auto; float: auto;
} }
.instructions { .instructions {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin: 0; margin: 0;
font-size: 0.929em; font-size: 0.929em;
font-weight: normal; font-weight: normal;
@ -70,7 +70,7 @@ $input-width: 220px;
.password-reset { .password-reset {
.instructions { .instructions {
label { label {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }
@ -98,7 +98,7 @@ $input-width: 220px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.instructions { .instructions {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin: 0; margin: 0;
font-size: 0.929em; font-size: 0.929em;
font-weight: normal; font-weight: normal;
@ -113,5 +113,5 @@ $input-width: 220px;
button#login-link, button#new-account-link button#login-link, button#new-account-link
{ {
background: transparent; background: transparent;
color: dark-light-choose(scale-color($primary, $lightness: 35%), scale-color($secondary, $lightness: 65%)); color: dark-light-choose($primary-high, $secondary-low);
} }

16
app/assets/stylesheets/common/base/menu-panel.scss
View file

@ -67,7 +67,7 @@
.new { .new {
font-size: 0.8em; font-size: 0.8em;
margin-left: 0.5em; margin-left: 0.5em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -79,7 +79,7 @@
margin: 5px 5px 0 8px; margin: 5px 5px 0 8px;
.box {margin-top: 0;} .box {margin-top: 0;}
.badge-notification { .badge-notification {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
background-color: transparent; background-color: transparent;
display: inline; display: inline;
padding: 0; padding: 0;
@ -88,7 +88,7 @@
// note these topic counts only appear for anons in the category hamburger drop down // note these topic counts only appear for anons in the category hamburger drop down
b.topics-count { b.topics-count {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
font-size: 11px; font-size: 11px;
} }
@ -161,7 +161,7 @@
.topic-statuses { .topic-statuses {
float: none; float: none;
display: inline-block; display: inline-block;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin: 0; margin: 0;
.fa { .fa {
margin: 0; margin: 0;
@ -183,7 +183,7 @@
transition: all linear .15s; transition: all linear .15s;
.user-results { .user-results {
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
} }
@ -204,8 +204,8 @@
margin: 0.5em 0; margin: 0.5em 0;
} }
.fa { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } .fa { color: dark-light-choose($primary-medium, $secondary-medium); }
.icon { color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); } .icon { color: dark-light-choose($primary-high, $secondary-low); }
li { li {
background-color: $tertiary-low; background-color: $tertiary-low;
padding: 0.25em 0.5em; padding: 0.25em 0.5em;
@ -299,7 +299,7 @@ div.menu-links-header {
text-align: right; text-align: right;
} }
.fa, a { .fa, a {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
a { a {

8
app/assets/stylesheets/common/base/modal.scss
View file

@ -13,7 +13,7 @@
.input-hint-text { .input-hint-text {
margin-left: 0.5em; margin-left: 0.5em;
color: $secondary-medium; color: $secondary-high;
} }
.modal-header { .modal-header {
@ -327,8 +327,8 @@
.cannot_delete_reason { .cannot_delete_reason {
position: absolute; position: absolute;
background: dark-light-choose(scale-color($primary, $lightness: 10%), scale-color($secondary, $lightness: 10%)); background: dark-light-choose($primary, $secondary);
color: dark-light-choose(scale-color($primary, $lightness: 100%), scale-color($secondary, $lightness: 0%)); color: dark-light-choose($secondary, $secondary);
text-align: center; text-align: center;
border-radius: 2px; border-radius: 2px;
padding: 12px 8px; padding: 12px 8px;
@ -339,7 +339,7 @@
border: solid transparent; border: solid transparent;
content: " "; content: " ";
position: absolute; position: absolute;
border-top-color: dark-light-choose(scale-color($primary, $lightness: 10%), scale-color($secondary, $lightness: 10%)); border-top-color: dark-light-choose($primary, $secondary);
border-width: 8px; border-width: 8px;
} }
} }

2
app/assets/stylesheets/common/base/notifications-button.scss
View file

@ -1,6 +1,6 @@
.notifications-button.notifications-button.notifications-button { .notifications-button.notifications-button.notifications-button {
.d-icon.regular, .d-icon.muted, .d-icon.watching-first-post { .d-icon.regular, .d-icon.muted, .d-icon.watching-first-post {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.d-icon.tracking, .d-icon.watching { .d-icon.tracking, .d-icon.watching {
color: $tertiary; color: $tertiary;

8
app/assets/stylesheets/common/base/onebox.scss
View file

@ -97,7 +97,7 @@ aside.onebox {
header { header {
margin-bottom: 8px; margin-bottom: 8px;
a[href] { a[href] {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
text-decoration: none; text-decoration: none;
} }
} }
@ -123,12 +123,12 @@ aside.onebox {
} }
a[href] { a[href] {
color: dark-light-choose(scale-color($tertiary, $lightness: -20%), $tertiary); color: dark-light-choose($tertiary, $tertiary);
text-decoration: none; text-decoration: none;
} }
a[href]:visited { a[href]:visited {
color: dark-light-choose(scale-color($tertiary, $lightness: -20%), $tertiary); color: dark-light-choose($tertiary, $tertiary);
} }
img { img {
@ -364,7 +364,7 @@ aside.onebox.stackexchange .onebox-body {
} }
.onebox-metadata { .onebox-metadata {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.onebox.xkcd .onebox-body { .onebox.xkcd .onebox-body {

12
app/assets/stylesheets/common/base/search.scss
View file

@ -10,7 +10,7 @@
} }
.like-count { .like-count {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
.fa { color: $love; font-size: 12px; } .fa { color: $love; font-size: 12px; }
} }
@ -32,7 +32,7 @@
margin-right: 14px; margin-right: 14px;
} }
a.search-link:visited .topic-title { a.search-link:visited .topic-title {
color: scale-color($tertiary, $lightness: 15%); color: $tertiary-high;
} }
.search-link { .search-link {
.topic-statuses, .topic-title { .topic-statuses, .topic-title {
@ -43,7 +43,7 @@
.topic-statuses { .topic-statuses {
float: none; float: none;
display: inline-block; display: inline-block;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 1.0em; font-size: 1.0em;
} }
} }
@ -52,13 +52,13 @@
line-height: 20px; line-height: 20px;
word-wrap: break-word; word-wrap: break-word;
max-width: 640px; max-width: 640px;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
.date { .date {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.search-highlight { .search-highlight {
color: dark-light-choose(scale-color($primary, $lightness: 10%), scale-color($secondary, $lightness: 90%)); color: dark-light-choose($primary, $secondary-low);
} }
} }

4
app/assets/stylesheets/common/base/share_link.scss
View file

@ -55,7 +55,7 @@
float: right; float: right;
font-size: 1.429em; font-size: 1.429em;
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -67,7 +67,7 @@
.date { .date {
float: right; float: right;
margin: 5px; margin: 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
input[type=text] { input[type=text] {

16
app/assets/stylesheets/common/base/tagging.scss
View file

@ -83,7 +83,7 @@
margin: 0; margin: 0;
} }
$tag-color: scale-color($primary, $lightness: 40%); $tag-color: $primary-medium;
.discourse-tag-count { .discourse-tag-count {
font-size: 0.8em; font-size: 0.8em;
@ -109,18 +109,18 @@ $tag-color: scale-color($primary, $lightness: 40%);
} }
&.box { &.box {
background-color: scale-color($primary, $lightness: 90%); background-color: $primary-low;
color: scale-color($primary, $lightness: 30%); color: $primary-high;
padding: 2px 8px; padding: 2px 8px;
.extra-info-wrapper & { .extra-info-wrapper & {
background-color: scale-color($header-primary, $lightness: 90%); background-color: $header_primary-low;
color: scale-color($header-primary, $lightness: 30%); color: $header_primary-medium;
} }
} }
&.simple, &.simple:visited, &.simple:hover { &.simple, &.simple:visited, &.simple:hover {
margin-right: 0px; margin-right: 0px;
color: scale-color($primary, $lightness: 30%); color: $primary-high;
} }
} }
@ -183,7 +183,7 @@ $tag-color: scale-color($primary, $lightness: 40%);
.discourse-tag.bullet:before { .discourse-tag.bullet:before {
content: "\f04d"; content: "\f04d";
font-family: FontAwesome; font-family: FontAwesome;
color: scale-color($primary, $lightness: 70%); color: $primary-low-mid;
margin-right: 5px; margin-right: 5px;
font-size: 0.7em; font-size: 0.7em;
position:relative; position:relative;
@ -226,7 +226,7 @@ header .discourse-tag {color: $tag-color }
.autocomplete { .autocomplete {
.d-icon-tag { .d-icon-tag {
color: dark-light-choose($primary, scale-color($primary, $lightness: 70%)); color: dark-light-choose($primary, $primary-low-mid);
padding-right: 5px; padding-right: 5px;
} }

28
app/assets/stylesheets/common/base/topic-post.scss
View file

@ -30,16 +30,16 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
} }
.fa { .fa {
font-size: 11px; font-size: 11px;
margin-left: 3px; margin-left: 3px;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.new_user a, .user-title, .user-title a { .new_user a, .user-title, .user-title a {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -49,8 +49,8 @@
h1, h2, h3, h4, h5, h6 { margin: 30px 0 10px; } h1, h2, h3, h4, h5, h6 { margin: 30px 0 10px; }
h1 { line-height: 1em; } /* normalize.css sets h1 font size but not line height */ h1 { line-height: 1em; } /* normalize.css sets h1 font size but not line height */
a { word-wrap: break-word; } a { word-wrap: break-word; }
ins { background-color: dark-light-choose(scale-color($success, $lightness: 90%), scale-color($success, $lightness: -60%)); } ins { background-color: dark-light-choose($success-low, scale-color($success, $lightness: -60%)); }
del { background-color: dark-light-choose(scale-color($danger, $lightness: 90%), scale-color($danger, $lightness: -60%)); } del { background-color: dark-light-choose($danger-low, scale-color($danger, $lightness: -60%)); }
} }
@ -72,7 +72,7 @@ aside.quote {
.title { .title {
@include post-aside; @include post-aside;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
// 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;
// blockquote is underneath this and has top margin // blockquote is underneath this and has top margin
@ -88,7 +88,7 @@ aside.quote {
} }
.quote-controls, .quote-controls .d-icon { .quote-controls, .quote-controls .d-icon {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.cooked .highlight { .cooked .highlight {
@ -238,7 +238,7 @@ aside.quote {
} }
&.via-email { &.via-email {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
&.raw-email { &.raw-email {
cursor: pointer; cursor: pointer;
@ -287,7 +287,7 @@ blockquote > *:last-child {
.gap { .gap {
padding: 0.25em 0 0.5em 4.3em; padding: 0.25em 0 0.5em 4.3em;
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
cursor: pointer; cursor: pointer;
text-transform: uppercase; text-transform: uppercase;
font-weight: bold; font-weight: bold;
@ -329,12 +329,12 @@ blockquote > *:last-child {
font-size: 35px; font-size: 35px;
width: 45px; width: 45px;
text-align: center; text-align: center;
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
} }
.small-action-desc.timegap { .small-action-desc.timegap {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.small-action-desc { .small-action-desc {
padding: 0.25em 0 0.5em 4.3em; padding: 0.25em 0 0.5em 4.3em;
@ -342,7 +342,7 @@ blockquote > *:last-child {
text-transform: uppercase; text-transform: uppercase;
font-weight: bold; font-weight: bold;
font-size: 0.9em; font-size: 0.9em;
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
.custom-message { .custom-message {
text-transform: none; text-transform: none;
@ -388,7 +388,7 @@ blockquote > *:last-child {
a.mention, a.mention-group { a.mention, a.mention-group {
padding: 2px 4px; padding: 2px 4px;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
background: $primary-low; background: $primary-low;
border-radius: 8px; border-radius: 8px;
font-weight: bold; font-weight: bold;
@ -408,7 +408,7 @@ a.mention, a.mention-group {
} }
.broken-image, .large-image { .broken-image, .large-image {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
border: 1px solid $primary-low; border: 1px solid $primary-low;
font-size: 32px; font-size: 32px;
padding: 16px; padding: 16px;

4
app/assets/stylesheets/common/base/topic.scss
View file

@ -149,7 +149,7 @@
} }
.expand-links { .expand-links {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.track-link { .track-link {
@ -165,7 +165,7 @@
li { li {
margin-bottom: 0.5em; margin-bottom: 0.5em;
a[href] { a[href] {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.clicks { .clicks {
margin-left: 0.5em; margin-left: 0.5em;

4
app/assets/stylesheets/common/base/user-badges.scss
View file

@ -196,7 +196,7 @@
.badge-groups { .badge-groups {
margin: 20px 0; margin: 20px 0;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
h3 { h3 {
margin-bottom: 1.0em; margin-bottom: 1.0em;
} }
@ -222,7 +222,7 @@
} }
.grant-info-item { .grant-info-item {
margin-bottom: 1em; margin-bottom: 1em;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.badge-title .form-horizontal .controls { .badge-title .form-horizontal .controls {

14
app/assets/stylesheets/common/base/user.scss
View file

@ -198,7 +198,7 @@
} }
a { a {
color: $secondary; color: dark-light-choose($primary-medium, $secondary-high);
} }
.active { .active {
@ -253,7 +253,7 @@
} }
.instructions { .instructions {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin-top: 5px; margin-top: 5px;
margin-bottom: 10px; margin-bottom: 10px;
font-size: 80%; font-size: 80%;
@ -343,7 +343,7 @@
padding-top: 10px; padding-top: 10px;
li a { li a {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -415,7 +415,7 @@
} }
.topic-info { .topic-info {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
@media all and (max-width : 600px) { @media all and (max-width : 600px) {
@ -435,7 +435,7 @@
.links-section { .links-section {
.domain { .domain {
font-size: 0.714em; font-size: 0.714em;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
} }
@ -462,7 +462,7 @@
} }
.instructions { .instructions {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin-bottom: 10px; margin-bottom: 10px;
font-size: 80%; font-size: 80%;
line-height: 1.4em; line-height: 1.4em;
@ -477,7 +477,7 @@
} }
.warning { .warning {
background-color: scale-color($danger, $lightness: 30%); background-color: $danger-medium;
padding: 5px 8px; padding: 5px 8px;
color: $secondary; color: $secondary;
width: 520px; width: 520px;

8
app/assets/stylesheets/common/components/badges.scss
View file

@ -254,7 +254,7 @@
font-size: 11px; font-size: 11px;
line-height: 1; line-height: 1;
text-align: center; text-align: center;
background-color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 70%)); background-color: dark-light-choose($primary-low-mid, $secondary-low);
&[href] { &[href] {
color: $secondary; color: $secondary;
} }
@ -266,14 +266,14 @@
// New posts // New posts
&.new-posts, &.unread-posts { &.new-posts, &.unread-posts {
background-color: dark-light-choose(scale-color($tertiary, $lightness: 50%), $tertiary); background-color: dark-light-choose($tertiary-medium, $tertiary);
color: dark-light-choose($secondary, $secondary); color: dark-light-choose($secondary, $secondary);
font-weight: dark-light-choose(normal, bold); font-weight: dark-light-choose(normal, bold);
} }
&.new-topic { &.new-topic {
background-color: transparent; background-color: transparent;
color: scale-color($tertiary, $lightness: 20%); color: $tertiary-high;
font-weight: normal; font-weight: normal;
font-size: 0.929em; font-size: 0.929em;
} }
@ -304,7 +304,7 @@
font-size: 1em; font-size: 1em;
line-height: 1; line-height: 1;
&[href] { &[href] {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }

6
app/assets/stylesheets/common/components/banner.scss
View file

@ -5,8 +5,8 @@
#banner { #banner {
padding: 10px; padding: 10px;
border-radius: 5px; border-radius: 5px;
background: scale-color($tertiary, $lightness: 90%); background: $tertiary-low;
box-shadow: 0 1px 2px scale-color($tertiary, $lightness: 70%); box-shadow: 0 1px 2px $tertiary-medium;
color: darken($tertiary, 45%); color: darken($tertiary, 45%);
z-index: 1001; z-index: 1001;
overflow: auto; overflow: auto;
@ -18,7 +18,7 @@
.close { .close {
font-size: 1.786em; font-size: 1.786em;
margin-top: -5px; margin-top: -5px;
color: scale-color($tertiary, $lightness: 70%); color: $tertiary-medium;
padding-left: 5px; padding-left: 5px;
float: right; float: right;
} }

8
app/assets/stylesheets/common/components/buttons.scss
View file

@ -56,7 +56,7 @@
} }
&[disabled], &.disabled { &[disabled], &.disabled {
background: $primary-low; background: $primary-low;
&:hover { color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); } &:hover { color: dark-light-choose($primary-low-mid, $secondary-high); }
cursor: not-allowed; cursor: not-allowed;
} }
@ -74,7 +74,7 @@
.btn-primary { .btn-primary {
border: none; border: none;
font-weight: normal; font-weight: normal;
color: dark-light-choose(#fff, scale-color($primary, $lightness: 60%)); color: dark-light-choose(#fff, $primary-medium);
background: $tertiary; background: $tertiary;
&[href] { &[href] {
@ -82,10 +82,10 @@
} }
&:hover, &.btn-hover { &:hover, &.btn-hover {
color: #fff; color: #fff;
background: dark-light-choose(scale-color($tertiary, $lightness: -20%), scale-color($tertiary, $lightness: -20%)); background: dark-light-choose($tertiary, $tertiary);
} }
&:active, &.btn-active { &:active, &.btn-active {
@include linear-gradient(scale-color($tertiary, $lightness: -20%), scale-color($tertiary, $lightness: -10%)); @include linear-gradient($tertiary, $tertiary);
color: $secondary; color: $secondary;
} }
&[disabled], &.disabled { &[disabled], &.disabled {

4
app/assets/stylesheets/common/components/dropdown-select-box.scss
View file

@ -37,7 +37,7 @@
align-self: center; align-self: center;
margin-right: 0; margin-right: 0;
opacity: 1; opacity: 1;
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-high, $secondary-medium);
} }
} }
@ -62,7 +62,7 @@
flex: 1; flex: 1;
font-size: 0.857em; font-size: 0.857em;
font-weight: normal; font-weight: normal;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%));; color: dark-light-choose($primary-medium, $secondary-medium);;
white-space: normal; white-space: normal;
} }
} }

4
app/assets/stylesheets/common/components/hashtag.scss
View file

@ -1,9 +1,9 @@
a.hashtag { a.hashtag {
color: dark-light-choose($primary, scale-color($primary, $lightness: 70%)); color: dark-light-choose($primary, $primary-low-mid);
font-weight: bold; font-weight: bold;
&:visited, &:hover { &:visited, &:hover {
color: dark-light-choose($primary, scale-color($primary, $lightness: 70%)); color: dark-light-choose($primary, $primary-low-mid);
} }
&:hover { &:hover {

2
app/assets/stylesheets/common/components/select-box.scss
View file

@ -231,7 +231,7 @@
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
cursor: pointer; cursor: pointer;
border-radius: 5px; border-radius: 5px;
background: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); background: dark-light-choose($primary-medium, $secondary-medium);
} }
&::-webkit-scrollbar-track { &::-webkit-scrollbar-track {

8
app/assets/stylesheets/common/components/user-info.scss
View file

@ -23,17 +23,17 @@
.username a { .username a {
font-weight: bold; font-weight: bold;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
.name { .name {
margin-left: 5px; margin-left: 5px;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
} }
.title { .title {
margin-top: 3px; margin-top: 3px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -56,7 +56,7 @@
min-height: 80px; min-height: 80px;
.granted-on { .granted-on {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.post-link { .post-link {

8
app/assets/stylesheets/common/components/user-stream-item.scss
View file

@ -70,7 +70,7 @@
} }
.edit-reason { .edit-reason {
background-color: dark-light-choose(scale-color($highlight, $lightness: 25%), scale-color($highlight, $lightness: -50%)); background-color: dark-light-choose($highlight-medium, scale-color($highlight, $lightness: -50%));
padding: 3px 5px 5px 5px; padding: 3px 5px 5px 5px;
} }
@ -100,7 +100,7 @@
// common/base/header.scss // common/base/header.scss
.fa, .icon { .fa, .icon {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 1.714em; font-size: 1.714em;
} }
} }
@ -116,13 +116,13 @@
.name { .name {
display: inline-block; display: inline-block;
margin-top: 5px; margin-top: 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium,$secondary-medium);
} }
.title { .title {
display: inline-block; display: inline-block;
margin-top: 5px; margin-top: 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }

2
app/assets/stylesheets/common/foundation/helpers.scss
View file

@ -81,6 +81,6 @@
// Buttons // Buttons
// --------------------------------------------------- // ---------------------------------------------------
.disable-no-hover:hover { .disable-no-hover:hover {
background: dark-light-choose(scale-color($primary, $lightness: 90%), scale-color($secondary, $lightness: 60%));; background: dark-light-choose($primary-low, $secondary-medium);;
color: $primary; color: $primary;
} }

18
app/assets/stylesheets/common/foundation/variables.scss
View file

@ -83,14 +83,25 @@ $base-font-family: Helvetica, Arial, sans-serif !default;
//primary //primary
$primary-low: dark-light-diff($primary, $secondary, 90%, -65%); $primary-low: dark-light-diff($primary, $secondary, 90%, -65%);
$primary-low-mid: dark-light-diff($primary, $secondary, 70%, -45%);
$primary-medium: dark-light-diff($primary, $secondary, 50%, -20%); $primary-medium: dark-light-diff($primary, $secondary, 50%, -20%);
$primary-high: dark-light-diff($primary, $secondary, 30%, -10%);
//header_primary
$header_primary-low: dark-light-diff($header_primary, $secondary, 90%, -65%);
$header_primary-medium: dark-light-diff($header_primary, $secondary, 50%, -20%);
$header_primary-high: dark-light-diff($header_primary, $secondary, 20%, 20%);
//secondary //secondary
$secondary-low: dark-light-diff($secondary, $primary, 50%, -50%); $secondary-low: dark-light-diff($secondary, $primary, 70%, -70%);
$secondary-medium: dark-light-diff($secondary, $primary, 30%, -35%); $secondary-medium: dark-light-diff($secondary, $primary, 50%, -50%);
$secondary-high: dark-light-diff($secondary, $primary, 30%, -35%);
//tertiary //tertiary
$tertiary-low: dark-light-diff($tertiary, $secondary, 85%, -65%); $tertiary-low: dark-light-diff($tertiary, $secondary, 85%, -65%);
$tertiary-medium: dark-light-diff($tertiary, $secondary, 50%, -45%);
$tertiary-high: dark-light-diff($tertiary, $secondary, 20%, -25%);
//quaternary //quaternary
$quaternary-low: dark-light-diff($quaternary, $secondary, 70%, -70%); $quaternary-low: dark-light-diff($quaternary, $secondary, 70%, -70%);
@ -104,7 +115,8 @@ $danger-low: dark-light-diff($danger, $secondary, 50%, -40%);
$danger-medium: dark-light-diff($danger, $secondary, 30%, -60%); $danger-medium: dark-light-diff($danger, $secondary, 30%, -60%);
//success //success
$success-low: dark-light-diff($success, $secondary, 50%, -60%); $success-low: dark-light-diff($success, $secondary, 80%, -60%);
$success-medium: dark-light-diff($success, $secondary, 50%, -40%);
//love //love
$love-low: dark-light-diff($love, $secondary, 85%, -60%); $love-low: dark-light-diff($love, $secondary, 85%, -60%);

14
app/assets/stylesheets/common/topic-timeline.scss
View file

@ -48,7 +48,7 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
border-top: 1px solid dark-light-choose(scale-color($primary, $lightness: 90%), scale-color($secondary, $lightness: 90%)); border-top: 1px solid dark-light-choose($primary-low, $secondary-low);
box-shadow: 0px -2px 4px -1px rgba(0,0,0,.25); box-shadow: 0px -2px 4px -1px rgba(0,0,0,.25);
padding-top: 20px; padding-top: 20px;
z-index: 100000; z-index: 100000;
@ -81,7 +81,7 @@
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
.username { .username {
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
word-wrap: break-word; word-wrap: break-word;
font-weight: bold; font-weight: bold;
} }
@ -201,14 +201,14 @@
.start-date { .start-date {
@include unselectable; @include unselectable;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.timeline-scrollarea { .timeline-scrollarea {
margin-top: 0.5em; margin-top: 0.5em;
margin-left: 0.5em; margin-left: 0.5em;
border-left: 1px solid; border-left: 1px solid;
border-color: dark-light-choose(scale-color($tertiary, $lightness: 80%), scale-color($tertiary, $lightness: 20%)); border-color: dark-light-choose($tertiary-low, $tertiary-high);
position: relative; position: relative;
-webkit-transform: translate3d(0,0,0); -webkit-transform: translate3d(0,0,0);
} }
@ -224,7 +224,7 @@
.timeline-handle { .timeline-handle {
@include border-radius-all(0.8em); @include border-radius-all(0.8em);
width: 0.35em; width: 0.35em;
background-color: dark-light-choose(scale-color($tertiary, $lightness: 80%), scale-color($tertiary, $lightness: 20%)); background-color: dark-light-choose($tertiary-low, $tertiary-high);
height: 100%; height: 100%;
float: left; float: left;
z-index: 501; z-index: 501;
@ -235,7 +235,7 @@
} }
.timeline-ago { .timeline-ago {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.timeline-scroller { .timeline-scroller {
@ -273,7 +273,7 @@
.now-date { .now-date {
@include unselectable; @include unselectable;
display: inline-block; display: inline-block;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin-top: 0.5em; margin-top: 0.5em;
i { i {
margin-left: 0.15em; margin-left: 0.15em;

6
app/assets/stylesheets/desktop/category-list.scss
View file

@ -27,7 +27,7 @@
.topics .badge-notification, .topics .badge-notification,
.category .badge-notification { .category .badge-notification {
background-color: transparent; background-color: transparent;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.topics { .topics {
@ -70,11 +70,11 @@
a.last-posted-at, a.last-posted-at,
a.last-posted-at:visited { a.last-posted-at:visited {
font-size: 0.86em; font-size: 0.86em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.topic-statuses .fa { .topic-statuses .fa {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.topic-post-badges { .topic-post-badges {

14
app/assets/stylesheets/desktop/compose.scss
View file

@ -100,7 +100,7 @@
} }
.posts-count { .posts-count {
background-color: dark-light-choose(scale-color($tertiary, $lightness: -40%), scale-color($tertiary, $lightness: 40%)); background-color: dark-light-choose($tertiary, $tertiary-medium);
} }
ul { ul {
@ -110,7 +110,7 @@
} }
.search-link { .search-link {
.fa, .blurb { .fa, .blurb {
color: dark-light-choose(scale-color($primary, $lightness: 45%), scale-color($secondary, $lightness: 55%)); color: dark-light-choose($primary-high, $secondary-medium);
} }
} }
.badge-wrapper { .badge-wrapper {
@ -155,7 +155,7 @@
right: 1px; right: 1px;
position: absolute; position: absolute;
i { font-size: 1.1em; } i { font-size: 1.1em; }
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
padding: 0 10px 5px 10px; padding: 0 10px 5px 10px;
} }
a.cancel { a.cancel {
@ -191,7 +191,7 @@
display: block; display: block;
i { i {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }
@ -353,7 +353,7 @@
} }
i { i {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -437,7 +437,7 @@
.d-editor-button-bar { .d-editor-button-bar {
top: 0; top: 0;
position: absolute; position: absolute;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
background-color: $secondary; background-color: $secondary;
z-index: 100; z-index: 100;
overflow: hidden; overflow: hidden;
@ -447,7 +447,7 @@
box-sizing: border-box; box-sizing: border-box;
button { button {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-high, $secondary-high);
} }
} }
} }

10
app/assets/stylesheets/desktop/discourse.scss
View file

@ -26,7 +26,7 @@ header {
display: block; display: block;
width: 27px; width: 27px;
margin: auto; margin: auto;
border-top: 3px double dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 50%)); border-top: 3px double dark-light-choose($primary-low-mid, $secondary-medium);
} }
} }
@ -293,7 +293,7 @@ input {
} }
.active { .active {
background-color: scale-color($danger, $lightness: 30%); background-color: $danger-medium;
border-color: $danger; border-color: $danger;
} }
} }
@ -328,6 +328,8 @@ input {
input, input,
select { select {
border-radius: 0; border-radius: 0;
background-color: $primary-low;
border-color: $primary-low;
} }
.add-on, .add-on,
@ -392,7 +394,7 @@ input {
.input-append { .input-append {
.add-on { .add-on {
color: $danger; color: $danger;
background-color: scale-color($danger, $lightness: 30%); background-color: $danger-medium;
border-color: scale-color($danger, $lightness: -20%); border-color: scale-color($danger, $lightness: -20%);
} }
} }
@ -421,7 +423,7 @@ input {
.input-append { .input-append {
.add-on { .add-on {
color: $success; color: $success;
background-color: scale-color($success, $lightness: 90%); background-color: $success-low;
border-color: $success; border-color: $success;
} }
} }

2
app/assets/stylesheets/desktop/group.scss
View file

@ -3,7 +3,7 @@
float: left; float: left;
a, i { a, i {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.active { .active {

4
app/assets/stylesheets/desktop/header.scss
View file

@ -31,13 +31,13 @@ and (max-width : 570px) {
} }
.search-link .blurb { .search-link .blurb {
color: dark-light-choose(scale-color($primary, $lightness: 45%), scale-color($secondary, $lightness: 55%)); color: dark-light-choose($primary-high, $secondary-medium);
display: block; display: block;
word-wrap: break-word; word-wrap: break-word;
font-size: 11px; font-size: 11px;
line-height: 1.3em; line-height: 1.3em;
.search-highlight { .search-highlight {
color: dark-light-choose(scale-color($primary, $lightness: 25%), scale-color($secondary, $lightness: 75%)); color: dark-light-choose($primary-high, $secondary-low);
} }
} }

6
app/assets/stylesheets/desktop/latest-topic-list.scss
View file

@ -3,7 +3,7 @@
.table-heading { .table-heading {
padding: 12px 5px; padding: 12px 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.no-topics, .more-topics { .no-topics, .more-topics {
@ -32,10 +32,10 @@
.topic-stats { .topic-stats {
flex: 1; flex: 1;
text-align: right; text-align: right;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
.topic-last-activity a { .topic-last-activity a {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
} }

4
app/assets/stylesheets/desktop/login.scss
View file

@ -14,7 +14,7 @@
#login-form { #login-form {
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 35%), scale-color($secondary, $lightness: 65%)); color: dark-light-choose($primary-high, $secondary-low);
} }
} }
@ -53,7 +53,7 @@
.instructions { .instructions {
label { label {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }

8
app/assets/stylesheets/desktop/modal.scss
View file

@ -62,7 +62,7 @@
.close { .close {
font-size: 1.429em; font-size: 1.429em;
text-decoration: none; text-decoration: none;
color: dark-light-choose(scale-color($primary, $lightness: 35%), scale-color($secondary, $lightness: 65%)); color: dark-light-choose($primary-high, $secondary-low);
cursor: pointer; cursor: pointer;
&:hover { &:hover {
color: $primary; color: $primary;
@ -93,7 +93,7 @@
.custom-message-length { .custom-message-length {
margin: -10px 0 10px 20px; margin: -10px 0 10px 20px;
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
font-size: 85%; font-size: 85%;
} }
@ -116,11 +116,11 @@
li { li {
margin: 0 4px 8px 0; margin: 0 4px 8px 0;
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
cursor: pointer; cursor: pointer;
} }
a:hover { a:hover {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }

2
app/assets/stylesheets/desktop/queued-posts.scss
View file

@ -11,7 +11,7 @@
float: right; float: right;
font-size: 0.929em; font-size: 0.929em;
margin-top: 1px; margin-top: 1px;
span {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } span {color: dark-light-choose($primary-medium, $secondary-medium); }
} }
.cooked { .cooked {

20
app/assets/stylesheets/desktop/topic-list.scss
View file

@ -34,10 +34,10 @@
// -------------------------------------------------- // --------------------------------------------------
.topic-list-icons { .topic-list-icons {
.d-icon-thumb-tack { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } .d-icon-thumb-tack { color: dark-light-choose($primary-medium, $secondary-medium); }
.d-icon-thumb-tack.unpinned { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } .d-icon-thumb-tack.unpinned { color: dark-light-choose($primary-medium, $secondary-medium); }
a.title {color: $primary;} a.title {color: $primary;}
.d-icon-bookmark { color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } .d-icon-bookmark { color: dark-light-choose($primary-medium, $secondary-medium); }
} }
.topic-list { .topic-list {
@ -55,7 +55,7 @@
} }
} }
th { th {
button .d-icon {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } button .d-icon {color: dark-light-choose($primary-medium, $secondary-medium); }
} }
> tbody > tr { > tbody > tr {
@ -106,8 +106,8 @@
} }
.posters a:first-child .avatar.latest:not(.single) { .posters a:first-child .avatar.latest:not(.single) {
box-shadow: 0 0 3px 1px desaturate(scale-color($tertiary, $lightness: 65%), 35%); box-shadow: 0 0 3px 1px desaturate($tertiary-medium, 35%);
border: 2px solid desaturate(scale-color($tertiary, $lightness: 50%), 40%); border: 2px solid desaturate($tertiary-medium, 40%);
position: relative; position: relative;
top: -2px; top: -2px;
left: -2px; left: -2px;
@ -134,7 +134,7 @@
.post-actions { .post-actions {
clear: both; clear: both;
width: auto; width: auto;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
text-align: left; text-align: left;
font-size: 12px; font-size: 12px;
margin-top: 5px; margin-top: 5px;
@ -143,7 +143,7 @@
} }
a { a {
font-size: 11px; font-size: 11px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
margin-right: 3px; margin-right: 3px;
line-height: 20px; line-height: 20px;
} }
@ -220,11 +220,11 @@
margin: 10px 0 0; margin: 10px 0 0;
/* topic status glyphs */ /* topic status glyphs */
i { i {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)) !important; color: dark-light-choose($primary-medium, $secondary-medium) !important;
font-size: 0.929em; font-size: 0.929em;
} }
a.last-posted-at, a.last-posted-at:visited { a.last-posted-at, a.last-posted-at:visited {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 0.88em; font-size: 0.88em;
} }
.badge { .badge {

54
app/assets/stylesheets/desktop/topic-post.scss
View file

@ -31,7 +31,7 @@ h1 .topic-statuses .topic-status i {
font-size: 0.929em; font-size: 0.929em;
float: right; float: right;
margin: 1px 25px 0 0; margin: 1px 25px 0 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.actions .fade-out { .actions .fade-out {
@ -61,11 +61,11 @@ nav.post-controls {
} }
.highlight-action { .highlight-action {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
a, button { a, button {
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
.d-icon { .d-icon {
opacity: 1.0; opacity: 1.0;
@ -98,7 +98,7 @@ nav.post-controls {
.show-replies { .show-replies {
margin-left: -10px; margin-left: -10px;
font-size: inherit; font-size: inherit;
span.badge-posts {color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); } span.badge-posts {color: dark-light-choose($primary-medium, $secondary-high); }
&:hover { &:hover {
background: $primary-low; background: $primary-low;
span.badge-posts {color: $primary;} span.badge-posts {color: $primary;}
@ -111,7 +111,7 @@ nav.post-controls {
button.create { button.create {
margin-right: 0; margin-right: 0;
color: dark-light-choose(scale-color($primary, $lightness: 20%), scale-color($secondary, $lightness: 80%)); color: dark-light-choose($primary-high, $secondary-low);
margin-left: 10px; margin-left: 10px;
} }
@ -248,7 +248,7 @@ nav.post-controls {
padding: 0; padding: 0;
} }
.post-date { color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); } .post-date { color: dark-light-choose($primary-medium, $secondary-high); }
.d-icon-arrow-up, .d-icon-arrow-down { margin-left: 5px; } .d-icon-arrow-up, .d-icon-arrow-down { margin-left: 5px; }
.reply:first-of-type .row { border-top: none; } .reply:first-of-type .row { border-top: none; }
@ -261,10 +261,10 @@ nav.post-controls {
font-size: 0.929em; font-size: 0.929em;
a { a {
font-weight: bold; font-weight: bold;
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
} }
.arrow {color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); } .arrow {color: dark-light-choose($primary-medium, $secondary-high); }
} }
.post-action { .post-action {
@ -291,7 +291,7 @@ a.star {
h3 { h3 {
margin-bottom: 4px; margin-bottom: 4px;
color: dark-light-choose(scale-color($primary, $lightness: 20%), scale-color($secondary, $lightness: 80%)); color: dark-light-choose($primary-high, $secondary-low);
line-height: 23px; line-height: 23px;
font-weight: normal; font-weight: normal;
font-size: 1em; font-size: 1em;
@ -299,7 +299,7 @@ a.star {
h4 { h4 {
margin: 1px 0 2px 0; margin: 1px 0 2px 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
font-size: 0.857em; font-size: 0.857em;
line-height: 15px; line-height: 15px;
@ -312,7 +312,7 @@ a.star {
span.domain { span.domain {
font-size: 0.714em; font-size: 0.714em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.avatars { .avatars {
@ -352,7 +352,7 @@ a.star {
line-height: 20px; line-height: 20px;
} }
.number, i { .number, i {
color: dark-light-choose(scale-color($primary, $lightness: 20%), scale-color($secondary, $lightness: 80%)); color: dark-light-choose($primary-high, $secondary-low);
font-size: 130%; font-size: 130%;
} }
.avatar a { .avatar a {
@ -369,12 +369,12 @@ a.star {
.participants { // PMs // .participants { // PMs //
.user { float: left; margin: 7px 20px 7px 0; } .user { float: left; margin: 7px 20px 7px 0; }
.user a { .user a {
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
font-weight: bold; font-weight: bold;
font-size: 0.929em; font-size: 0.929em;
} }
.d-icon-times { .d-icon-times {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
} }
} }
@ -394,7 +394,7 @@ a.star {
.btn { .btn {
border: 0; border: 0;
padding: 0 23px; padding: 0 23px;
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
background: blend-primary-secondary(5%); background: blend-primary-secondary(5%);
border-left: 1px solid $primary-low; border-left: 1px solid $primary-low;
border-top: 1px solid $primary-low; border-top: 1px solid $primary-low;
@ -415,7 +415,7 @@ a.star {
} }
.link-summary .btn { .link-summary .btn {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
background: blend-primary-secondary(5%); background: blend-primary-secondary(5%);
width: 100%; width: 100%;
&:hover { &:hover {
@ -427,7 +427,7 @@ a.star {
@mixin topic-footer-buttons-text { @mixin topic-footer-buttons-text {
line-height: 32px; line-height: 32px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
@mixin topic-footer-button { @mixin topic-footer-button {
@ -574,7 +574,7 @@ video {
.moderator { .moderator {
.topic-body { .topic-body {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
} }
} }
@ -710,7 +710,7 @@ $topic-avatar-width: 45px;
background-clip: padding-box; background-clip: padding-box;
span { span {
font-size: 0.857em; font-size: 0.857em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
span.title { span.title {
font-weight: bold; font-weight: bold;
@ -809,7 +809,7 @@ $topic-avatar-width: 45px;
color: $secondary; color: $secondary;
font-weight: normal; font-weight: normal;
margin-bottom: 10px; margin-bottom: 10px;
background: scale-color($tertiary, $lightness: 50%); background: $tertiary-medium;
&[href] { &[href] {
color: $secondary; color: $secondary;
@ -817,7 +817,7 @@ $topic-avatar-width: 45px;
&:hover &:hover
{ {
color: $secondary; color: $secondary;
background: scale-color($tertiary, $lightness: 20%); background: $tertiary-high;
} }
&:active { &:active {
@include linear-gradient(darken($tertiary, 18%), darken($tertiary, 12%)); @include linear-gradient(darken($tertiary, 18%), darken($tertiary, 12%));
@ -837,7 +837,7 @@ $topic-avatar-width: 45px;
article.boxed { article.boxed {
.select-posts { .select-posts {
button.select-post { button.select-post {
background-color: scale-color($tertiary, $lightness: 50%); background-color: $tertiary-medium;
color: $secondary; color: $secondary;
} }
} }
@ -860,8 +860,8 @@ $topic-avatar-width: 45px;
button { button {
margin-left: 8px; margin-left: 8px;
background-color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); background-color: dark-light-choose($primary-low-mid, $secondary-high);
border: 1px solid dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); border: 1px solid dark-light-choose($primary-medium, $secondary-high);
color: $primary; color: $primary;
} }
} }
@ -905,7 +905,7 @@ a.attachment:before {
float: right; float: right;
font-size: 0.929em; font-size: 0.929em;
margin-top: 1px; margin-top: 1px;
a {color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); } a {color: dark-light-choose($primary-medium, $secondary-medium); }
} }
} }
@ -922,11 +922,11 @@ span.highlighted {
} }
.username.new-user a { .username.new-user a {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.read-state { .read-state {
color: scale-color($tertiary, $lightness: 50%); color: $tertiary-medium;
position: absolute; position: absolute;
right: 0px; right: 0px;
top: 13px; top: 13px;

4
app/assets/stylesheets/desktop/topic.scss
View file

@ -45,7 +45,7 @@
} }
.private-message-glyph { .private-message-glyph {
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
float: left; float: left;
margin: 0 5px 0 0; margin: 0 5px 0 0;
} }
@ -188,7 +188,7 @@
#topic-filter { #topic-filter {
background-color: scale-color($highlight, $lightness: 25%); background-color: $highlight-medium;
padding: 8px; padding: 8px;
bottom: 0; bottom: 0;
position: fixed; position: fixed;

2
app/assets/stylesheets/desktop/upload.scss
View file

@ -17,7 +17,7 @@
line-height: 18px; line-height: 18px;
} }
.description, .hint { .description, .hint {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
display: block; display: block;
} }
.hint { .hint {

12
app/assets/stylesheets/desktop/user.scss
View file

@ -54,7 +54,7 @@
} }
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
&.active { &.active {
color: $primary; color: $primary;
@ -99,7 +99,7 @@
text-align: left; text-align: left;
border-bottom: 3px solid $primary-low; border-bottom: 3px solid $primary-low;
padding: 0 0 10px 0; padding: 0 0 10px 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
} }
@ -140,10 +140,10 @@
} }
} }
.secondary { .secondary {
background: scale-color($secondary, $lightness: -5%); background: $secondary;
border-top: 1px solid $primary-low; border-top: 1px solid $primary-low;
border-bottom: 1px solid $primary-low; border-bottom: 1px solid $primary-low;
dl { dl {
padding: 8px 10px; padding: 8px 10px;

2
app/assets/stylesheets/embed.scss
View file

@ -87,7 +87,7 @@ article.post {
} }
a.new-user { a.new-user {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
span.title { span.title {

2
app/assets/stylesheets/mobile/components/user-stream-item.scss
View file

@ -17,7 +17,7 @@
.notification { .notification {
&.unread { &.unread {
background-color: dark-light-choose(scale-color($tertiary, $lightness: 85%), srgb-scale($tertiary, $secondary, 15%)); background-color: dark-light-choose($tertiary-low, srgb-scale($tertiary, $secondary, 15%));
} }
} }

14
app/assets/stylesheets/mobile/compose.scss
View file

@ -66,7 +66,7 @@ input[type=radio], input[type=checkbox] {
right: 1px; right: 1px;
position: absolute; position: absolute;
font-size: 1.071em; font-size: 1.071em;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
.toggle-toolbar { .toggle-toolbar {
@ -84,7 +84,7 @@ input[type=radio], input[type=checkbox] {
max-width: 80%; max-width: 80%;
white-space: nowrap; white-space: nowrap;
i { i {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }
@ -119,7 +119,7 @@ input[type=radio], input[type=checkbox] {
text-overflow: ellipsis; text-overflow: ellipsis;
i { i {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }
@ -176,11 +176,11 @@ input[type=radio], input[type=checkbox] {
#reply-title { #reply-title {
margin-right: 10px; margin-right: 10px;
&:disabled { &:disabled {
background-color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); background-color: dark-light-choose($primary-low-mid, $secondary-high);
} }
} }
.d-editor-input:disabled { .d-editor-input:disabled {
background-color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); background-color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.d-editor-input { .d-editor-input {
color: dark-light-choose(darken($primary, 40%), blend-primary-secondary(90%)); color: dark-light-choose(darken($primary, 40%), blend-primary-secondary(90%));
@ -317,7 +317,7 @@ input[type=radio], input[type=checkbox] {
display: block; display: block;
margin: 1px 4px; margin: 1px 4px;
position: absolute; position: absolute;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
background-color: $secondary; background-color: $secondary;
z-index: 100; z-index: 100;
overflow: hidden; overflow: hidden;
@ -328,7 +328,7 @@ input[type=radio], input[type=checkbox] {
box-sizing: border-box; box-sizing: border-box;
button { button {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
button.btn.no-text { button.btn.no-text {
margin: 0 2px; margin: 0 2px;

2
app/assets/stylesheets/mobile/directory.scss
View file

@ -23,7 +23,7 @@
&.me { &.me {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
.username a, .name, .title, .number, .time-read, .user-stat .label { .username a, .name, .title, .number, .time-read, .user-stat .label {
color: scale-color($highlight, $lightness: -50%); color: scale-color($highlight, $lightness: -50%);

4
app/assets/stylesheets/mobile/discourse.scss
View file

@ -63,7 +63,7 @@ h2 {
.topic-status { .topic-status {
i { i {
color: $secondary-medium; color: $secondary-high;
} }
} }
@ -100,7 +100,7 @@ h2 {
.fa { .fa {
margin-right: 8px; margin-right: 8px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }

4
app/assets/stylesheets/mobile/login.scss
View file

@ -16,7 +16,7 @@
#login-form { #login-form {
a { a {
color: dark-light-choose(scale-color($primary, $lightness: 35%), scale-color($secondary, $lightness: 65%)); color: dark-light-choose($primary-high, $secondary-low);
} }
label { float: left; display: block; } label { float: left; display: block; }
textarea, input, select { textarea, input, select {
@ -59,7 +59,7 @@ $input-width: 184px;
tr.instructions { tr.instructions {
label { label {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }

4
app/assets/stylesheets/mobile/modal.scss
View file

@ -105,7 +105,7 @@
.custom-message-length { .custom-message-length {
margin: -4px 0 10px 20px; margin: -4px 0 10px 20px;
color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); color: dark-light-choose($primary-high, $secondary-low);
font-size: 85%; font-size: 85%;
} }
@ -164,7 +164,7 @@
.alert { .alert {
padding: 5px; padding: 5px;
&.alert-success { &.alert-success {
background-color: scale-color($success, $lightness: 90%); background-color: $success-low;
color: $success; color: $success;
} }
} }

18
app/assets/stylesheets/mobile/topic-list.scss
View file

@ -26,7 +26,7 @@
position: relative; position: relative;
} }
.nav-pills .drop { .nav-pills .drop {
border: 1px solid $primary-low; border: 1px solid $primary-low;
position: absolute; position: absolute;
z-index: 1000; z-index: 1000;
background-color: $secondary; background-color: $secondary;
@ -82,7 +82,7 @@
th, th,
td { td {
padding: 7px 0; padding: 7px 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
max-width: 300px; max-width: 300px;
} }
@ -119,7 +119,7 @@
max-width: 160px; max-width: 160px;
} }
.num .fa, a, a:visited { .num .fa, a, a:visited {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
@ -129,7 +129,7 @@
a { a {
// let's make all ages dim on mobile so we're not // let's make all ages dim on mobile so we're not
// overwhelming people with info about each topic // overwhelming people with info about each topic
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)) !important; color: dark-light-choose($primary-low-mid, $secondary-high) !important;
} }
} }
} }
@ -142,7 +142,7 @@
td { td {
padding: 12px 5px; padding: 12px 5px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
vertical-align: top; vertical-align: top;
} }
@ -212,7 +212,7 @@ tr.category-topic-link {
.featured-topic { .featured-topic {
margin: 8px 0; margin: 8px 0;
a.last-posted-at, a.last-posted-at:visited { a.last-posted-at, a.last-posted-at:visited {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }
} }
@ -291,7 +291,7 @@ tr.category-topic-link {
figure { figure {
float: left; float: left;
margin: 3px 7px 0 0; margin: 3px 7px 0 0;
color: dark-light-choose(scale-color($primary, $lightness: 10%), scale-color($secondary, $lightness: 90%)); color: dark-light-choose($primary, $secondary-low);
font-weight: bold; font-weight: bold;
font-size: 0.857em; font-size: 0.857em;
} }
@ -359,7 +359,7 @@ tr.category-topic-link {
padding: 4px 0; padding: 4px 0;
list-style: none; list-style: none;
background-color: $secondary; background-color: $secondary;
border: 1px solid dark-light-choose(rgba(0, 0, 0, 0.2), scale-color($primary, $lightness: -60%)); border: 1px solid dark-light-choose(rgba(0, 0, 0, 0.2), $primary);
border-radius: 5px; border-radius: 5px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
background-clip: padding-box; background-clip: padding-box;
@ -379,7 +379,7 @@ tr.category-topic-link {
.dropdown-menu .active > a:hover { .dropdown-menu .active > a:hover {
color: $tertiary; color: $tertiary;
text-decoration: none; text-decoration: none;
background-color: scale-color($tertiary, $lightness: 75%); background-color: $tertiary-low;
} }
.open > .dropdown-menu { .open > .dropdown-menu {
display: block; display: block;

28
app/assets/stylesheets/mobile/topic-post.scss
View file

@ -63,7 +63,7 @@ nav.post-controls {
padding: 8px 10px; padding: 8px 10px;
vertical-align: top; vertical-align: top;
background: transparent; background: transparent;
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
float: left; float: left;
&.hidden { &.hidden {
display: none; display: none;
@ -91,7 +91,7 @@ nav.post-controls {
/* shift post reply button to the right and make it black */ /* shift post reply button to the right and make it black */
.post-controls button.create { .post-controls button.create {
float: right; float: right;
color: dark-light-choose(scale-color($primary, $lightness: 20%), scale-color($secondary, $lightness: 80%)); color: dark-light-choose($primary-high, $secondary-low);
} }
@ -153,7 +153,7 @@ a.reply-to-tab {
position: absolute; position: absolute;
z-index: 400; z-index: 400;
right: 80px; right: 80px;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
span { display: none; } span { display: none; }
} }
@ -181,7 +181,7 @@ a.star {
h3 { h3 {
margin-bottom: 4px; margin-bottom: 4px;
margin-top: 0; margin-top: 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
line-height: 23px; line-height: 23px;
font-weight: normal; font-weight: normal;
font-size: 1em; font-size: 1em;
@ -189,7 +189,7 @@ a.star {
h4 { h4 {
margin: 0 0 3px 0; margin: 0 0 3px 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal; font-weight: normal;
font-size: 0.857em; font-size: 0.857em;
line-height: 15px; line-height: 15px;
@ -246,7 +246,7 @@ a.star {
line-height: 20px; line-height: 20px;
} }
.number, i { .number, i {
color: dark-light-choose(scale-color($primary, $lightness: 20%), scale-color($secondary, $lightness: 80%)); color: dark-light-choose($primary-high, $secondary-low);
font-size: 110%; font-size: 110%;
} }
@ -269,7 +269,7 @@ a.star {
} }
.domain { .domain {
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.topic-links { .topic-links {
@ -288,7 +288,7 @@ a.star {
.btn { .btn {
border: 0; border: 0;
padding: 0 15px; padding: 0 15px;
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
background: blend-primary-secondary(5%); background: blend-primary-secondary(5%);
border-left: 1px solid $primary-low; border-left: 1px solid $primary-low;
border-top: 1px solid $primary-low; border-top: 1px solid $primary-low;
@ -301,7 +301,7 @@ a.star {
} }
.link-summary .btn { .link-summary .btn {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%)); color: dark-light-choose($primary-medium, $secondary-high);
background: blend-primary-secondary(5%); background: blend-primary-secondary(5%);
width: 100%; width: 100%;
} }
@ -324,7 +324,7 @@ a.star {
#topic-footer-buttons p { #topic-footer-buttons p {
clear: both; /* this is to force the drop-down notification state description para below the button */ clear: both; /* this is to force the drop-down notification state description para below the button */
margin: 0; margin: 0;
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
#topic-footer-button { #topic-footer-button {
@ -382,7 +382,7 @@ span.post-count {
} }
.moderator .topic-body { .moderator .topic-body {
background-color: $highlight-low; background-color: dark-light-choose($highlight-low, $highlight-medium);
} }
.quote-button.visible { .quote-button.visible {
@ -410,7 +410,7 @@ iframe {
padding-top: 1px; padding-top: 1px;
} }
span { span {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
span.title { span.title {
color: $primary; color: $primary;
@ -495,7 +495,7 @@ blockquote {
.posts-wrapper { position: relative; } .posts-wrapper { position: relative; }
span.highlighted { span.highlighted {
background-color: dark-light-choose(scale-color($highlight, $lightness: 70%), $highlight); background-color: dark-light-choose($highlight-low, $highlight);
} }
.topic-avatar { .topic-avatar {
@ -526,7 +526,7 @@ span.highlighted {
} }
.username.new-user a { .username.new-user a {
color: dark-light-choose(scale-color($primary, $lightness: 70%), scale-color($secondary, $lightness: 30%)); color: dark-light-choose($primary-low-mid, $secondary-high);
} }
.user-title { .user-title {

8
app/assets/stylesheets/mobile/topic.scss
View file

@ -31,7 +31,7 @@
.private-message-glyph { display: none; } .private-message-glyph { display: none; }
} }
.private-message-glyph { color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%)); } .private-message-glyph { color: dark-light-choose($primary-low-mid, $secondary-high); }
.private_message #topic-title .private-message-glyph { display: inline; } .private_message #topic-title .private-message-glyph { display: inline; }
@ -172,9 +172,9 @@
.topic-post:last-of-type {padding-bottom: 40px;} .topic-post:last-of-type {padding-bottom: 40px;}
.heatmap-high {color: scale-color($danger, $lightness: -25%) !important;} .heatmap-high {color: $danger !important;}
.heatmap-med {color: $danger !important;} .heatmap-med {color: $danger-medium !important;}
.heatmap-low {color: scale-color($danger, $lightness: 25%) !important;} .heatmap-low {color: $danger-low !important;}
sup sup, sub sup, sup sub, sub sub { top: 0; } sup sup, sub sup, sup sub, sub sub { top: 0; }

2
app/assets/stylesheets/mobile/upload.scss
View file

@ -7,7 +7,7 @@
line-height: 18px; line-height: 18px;
} }
.description { .description {
color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%)); color: dark-light-choose($primary-medium, $secondary-medium);
} }
} }