From 4a1ec205854b3fa7f144172d4b3f0e2114a0b283 Mon Sep 17 00:00:00 2001 From: Kris Aubuchon Date: Thu, 24 Jul 2014 12:21:22 -0400 Subject: [PATCH] adding border to poster expansion, changing media screen to media all, trying new notification style --- .../stylesheets/common/admin/admin_base.scss | 4 ++-- app/assets/stylesheets/common/base/header.scss | 7 +++++-- .../stylesheets/common/base/magnific-popup.scss | 2 +- app/assets/stylesheets/common/base/mobile.scss | 2 +- .../common/components/badges.css.scss | 13 +++++++------ .../stylesheets/common/foundation/mixins.scss | 16 ++++++++-------- app/assets/stylesheets/desktop/compose.scss | 2 +- app/assets/stylesheets/desktop/header.scss | 5 ++++- .../stylesheets/desktop/poster_expansion.scss | 1 + app/assets/stylesheets/desktop/topic-list.scss | 2 +- app/assets/stylesheets/desktop/topic-post.scss | 8 ++++---- app/assets/stylesheets/desktop/topic.scss | 4 ++-- app/models/site_customization.rb | 4 ++-- lib/sass/discourse_stylesheets.rb | 2 +- spec/models/site_customization_spec.rb | 4 ++-- 15 files changed, 42 insertions(+), 34 deletions(-) diff --git a/app/assets/stylesheets/common/admin/admin_base.scss b/app/assets/stylesheets/common/admin/admin_base.scss index ad48b0c52d7..f8f3eb15c65 100644 --- a/app/assets/stylesheets/common/admin/admin_base.scss +++ b/app/assets/stylesheets/common/admin/admin_base.scss @@ -1135,7 +1135,7 @@ button.ru { visibility: hidden; } -@media only screen +@media all and (max-width : 850px) { .nav-stacked { .glyph {width: auto; position: relative;} @@ -1144,7 +1144,7 @@ and (max-width : 850px) { } } -@media only screen +@media all and (min-width : 320px) and (max-width : 500px) { diff --git a/app/assets/stylesheets/common/base/header.scss b/app/assets/stylesheets/common/base/header.scss index 89ea5451258..3bafc2a8d75 100644 --- a/app/assets/stylesheets/common/base/header.scss +++ b/app/assets/stylesheets/common/base/header.scss @@ -128,14 +128,16 @@ } .unread-notifications { right: -4px; - background-color: scale-color($tertiary, $lightness: 50%); + background-color: $secondary; } .unread-private-messages { left: -4px; } } .flagged-posts { - background-color: $danger; + border-color: $danger; + color: $danger; + background: $secondary; } } @@ -231,6 +233,7 @@ padding: 3px; margin-top: -22px; margin-left: 60px; + background: transparent; } .heading { padding: 5px 5px 5px 0; diff --git a/app/assets/stylesheets/common/base/magnific-popup.scss b/app/assets/stylesheets/common/base/magnific-popup.scss index 7427e863f86..57b1ee9c1a5 100644 --- a/app/assets/stylesheets/common/base/magnific-popup.scss +++ b/app/assets/stylesheets/common/base/magnific-popup.scss @@ -535,7 +535,7 @@ button { @if $include-mobile-layout-for-image { - @media screen and (max-width: 800px) and (orientation:landscape), screen and (max-height: 300px) { + @media all and (max-width: 800px) and (orientation:landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ diff --git a/app/assets/stylesheets/common/base/mobile.scss b/app/assets/stylesheets/common/base/mobile.scss index 617990659df..65de181766b 100644 --- a/app/assets/stylesheets/common/base/mobile.scss +++ b/app/assets/stylesheets/common/base/mobile.scss @@ -1,4 +1,4 @@ -@media only screen +@media all and (min-device-width : 320px) and (max-device-width : 540px) { #reply-control { diff --git a/app/assets/stylesheets/common/components/badges.css.scss b/app/assets/stylesheets/common/components/badges.css.scss index 24e712ea528..2fb4ab8e0ee 100644 --- a/app/assets/stylesheets/common/components/badges.css.scss +++ b/app/assets/stylesheets/common/components/badges.css.scss @@ -61,22 +61,23 @@ h1 a.badge-category div {vertical-align: top;} .badge-notification { @extend %badge; - padding: 4px; - color: $secondary; + padding: 3px; + color: $tertiary; + border: 1px solid $tertiary; font-size: 11px; line-height: 1; min-width: 11px; text-align: center; - background-color: scale-color($primary, $lightness: 70%); + background-color: transparent; &[href] { - color: $secondary; + color: $tertiary; } // New posts &.new-posts, &.unread-posts { - background-color: scale-color($tertiary, $lightness: 50%); - color: $secondary; + background-color: transparent; + color: $tertiary; font-weight: normal; } diff --git a/app/assets/stylesheets/common/foundation/mixins.scss b/app/assets/stylesheets/common/foundation/mixins.scss index 8fa2a8c6cb7..f4fbe9b3009 100644 --- a/app/assets/stylesheets/common/foundation/mixins.scss +++ b/app/assets/stylesheets/common/foundation/mixins.scss @@ -7,28 +7,28 @@ @mixin small-width { - @media screen and (max-width: 850px) { + @media all and (max-width: 850px) { @content; } } @mixin medium-width { - @media screen and (min-width: 1000px) and (max-width: 1139px) { + @media all and (min-width: 1000px) and (max-width: 1139px) { @content; } } @mixin large-width { - @media screen and (min-width: 1140px) { + @media all and (min-width: 1140px) { @content; } } -@mixin mobile-portrait { @media only screen and (max-width : 320px) { @content; } } -@mixin not-mobile-portrait { @media only screen and (min-width : 321px) { @content; } } -@mixin mobile-landscape { @media only screen and (min-width : 321px) and (max-width : 959px) { @content; } } -@mixin not-tablet-landscape { @media only screen and (max-width : 959px) { @content; } } -@mixin tablet-landscape { @media only screen and (min-width : 960px) { @content; } } +@mixin mobile-portrait { @media all and (max-width : 320px) { @content; } } +@mixin not-mobile-portrait { @media all and (min-width : 321px) { @content; } } +@mixin mobile-landscape { @media all and (min-width : 321px) and (max-width : 959px) { @content; } } +@mixin not-tablet-landscape { @media all and (max-width : 959px) { @content; } } +@mixin tablet-landscape { @media all and (min-width : 960px) { @content; } } // CSS3 properties // -------------------------------------------------- diff --git a/app/assets/stylesheets/desktop/compose.scss b/app/assets/stylesheets/desktop/compose.scss index 9e96e2f39d2..b14da55c6a1 100644 --- a/app/assets/stylesheets/desktop/compose.scss +++ b/app/assets/stylesheets/desktop/compose.scss @@ -445,7 +445,7 @@ padding-right: 20px; } -@media screen and (min-width: 1550px) { +@media all and (min-width: 1550px) { #reply-control { .wmd-controls { width: 1450px; diff --git a/app/assets/stylesheets/desktop/header.scss b/app/assets/stylesheets/desktop/header.scss index b8300e459c4..c9be7237d94 100644 --- a/app/assets/stylesheets/desktop/header.scss +++ b/app/assets/stylesheets/desktop/header.scss @@ -21,7 +21,10 @@ /* needs to be global, used in user-drop down and user page too */ .unread-private-messages { - background-color: $success; + border-color: $success; + color: $success; + background: $secondary; + &.badge-notification[href] {color: $success;} } #main { diff --git a/app/assets/stylesheets/desktop/poster_expansion.scss b/app/assets/stylesheets/desktop/poster_expansion.scss index 7bf523fad5c..03915fe91f3 100644 --- a/app/assets/stylesheets/desktop/poster_expansion.scss +++ b/app/assets/stylesheets/desktop/poster_expansion.scss @@ -9,6 +9,7 @@ margin-top: -2px; background-color: $secondary; padding: 12px 12px 5px 12px; + border: 1px solid scale-color-diff(); h1 { display: inline-block; diff --git a/app/assets/stylesheets/desktop/topic-list.scss b/app/assets/stylesheets/desktop/topic-list.scss index ef359bf7bbd..f225cff2058 100644 --- a/app/assets/stylesheets/desktop/topic-list.scss +++ b/app/assets/stylesheets/desktop/topic-list.scss @@ -290,7 +290,7 @@ button.dismiss-read { /* Tablet (portrait) ----------- */ -@media only screen +@media all and (max-width : 850px) { .nav-pills { diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss index 4c7a68fe804..99de6d0b641 100644 --- a/app/assets/stylesheets/desktop/topic-post.scss +++ b/app/assets/stylesheets/desktop/topic-post.scss @@ -1048,7 +1048,7 @@ span.highlighted { /* Tablet (portrait) ----------- */ -@media only screen +@media all and (max-width : 1140px) { .extra-info { h1 { @@ -1061,7 +1061,7 @@ and (max-width : 1140px) { } -@media only screen +@media all and (max-width : 975px) { .extra-info { h1 { @@ -1073,14 +1073,14 @@ and (max-width : 975px) { } } -@media only screen +@media all and (max-width : 940px) { .post-cloak .reply-to-tab { right: 250px; } } -@media only screen +@media all and (max-width : 870px) { .extra-info { h1 { diff --git a/app/assets/stylesheets/desktop/topic.scss b/app/assets/stylesheets/desktop/topic.scss index a4c12f40ca5..4171c439047 100644 --- a/app/assets/stylesheets/desktop/topic.scss +++ b/app/assets/stylesheets/desktop/topic.scss @@ -292,7 +292,7 @@ kbd padding: .1em .6em; } -@media only screen +@media all and (max-width : 940px) { #topic-progress, #topic-progress-expanded { @@ -301,7 +301,7 @@ and (max-width : 940px) { } -@media only screen +@media all and (max-width : 870px) { #topic-progress, #topic-progress-expanded { diff --git a/app/models/site_customization.rb b/app/models/site_customization.rb index 7217f0b6dcc..1a7c453b421 100644 --- a/app/models/site_customization.rb +++ b/app/models/site_customization.rb @@ -179,14 +179,14 @@ class SiteCustomization < ActiveRecord::Base return "" unless stylesheet.present? return @stylesheet_link_tag if @stylesheet_link_tag ensure_stylesheets_on_disk! - @stylesheet_link_tag = "" + @stylesheet_link_tag = "" end def mobile_stylesheet_link_tag return "" unless mobile_stylesheet.present? return @mobile_stylesheet_link_tag if @mobile_stylesheet_link_tag ensure_stylesheets_on_disk! - @mobile_stylesheet_link_tag = "" + @mobile_stylesheet_link_tag = "" end end diff --git a/lib/sass/discourse_stylesheets.rb b/lib/sass/discourse_stylesheets.rb index 0c994ee7973..29bf3baa9c9 100644 --- a/lib/sass/discourse_stylesheets.rb +++ b/lib/sass/discourse_stylesheets.rb @@ -13,7 +13,7 @@ class DiscourseStylesheets @lock.synchronize do builder.compile unless File.exists?(builder.stylesheet_fullpath) builder.ensure_digestless_file - %[].html_safe + %[].html_safe end end diff --git a/spec/models/site_customization_spec.rb b/spec/models/site_customization_spec.rb index 657462c3225..cce7e562766 100644 --- a/spec/models/site_customization_spec.rb +++ b/spec/models/site_customization_spec.rb @@ -68,7 +68,7 @@ describe SiteCustomization do context '#custom_stylesheet' do it 'should allow me to lookup a filename containing my preview stylesheet' do SiteCustomization.custom_stylesheet(customization.key).should == - "" + "" end it "should return blank link tag for mobile if mobile_stylesheet is blank" do @@ -77,7 +77,7 @@ describe SiteCustomization do it "should return link tag for mobile custom stylesheet" do SiteCustomization.custom_stylesheet(customization_with_mobile.key, :mobile).should == - "" + "" end end