adding border to poster expansion, changing media screen to media all, trying new notification style

This commit is contained in:
Kris Aubuchon 2014-07-24 12:21:22 -04:00
parent a34037b26c
commit 4a1ec20585
15 changed files with 42 additions and 34 deletions

View file

@ -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) {

View file

@ -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;

View file

@ -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
*/

View file

@ -1,4 +1,4 @@
@media only screen
@media all
and (min-device-width : 320px)
and (max-device-width : 540px) {
#reply-control {

View file

@ -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;
}

View file

@ -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
// --------------------------------------------------

View file

@ -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;

View file

@ -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 {

View file

@ -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;

View file

@ -290,7 +290,7 @@ button.dismiss-read {
/* Tablet (portrait) ----------- */
@media only screen
@media all
and (max-width : 850px) {
.nav-pills {

View file

@ -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 {

View file

@ -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 {

View file

@ -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 = "<link class=\"custom-css\" rel=\"stylesheet\" href=\"/#{CACHE_PATH}#{stylesheet_filename}?#{stylesheet_hash}\" type=\"text/css\" media=\"screen\">"
@stylesheet_link_tag = "<link class=\"custom-css\" rel=\"stylesheet\" href=\"/#{CACHE_PATH}#{stylesheet_filename}?#{stylesheet_hash}\" type=\"text/css\" media=\"all\">"
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 = "<link class=\"custom-css\" rel=\"stylesheet\" href=\"/#{CACHE_PATH}#{stylesheet_filename(:mobile)}?#{stylesheet_hash(:mobile)}\" type=\"text/css\" media=\"screen\">"
@mobile_stylesheet_link_tag = "<link class=\"custom-css\" rel=\"stylesheet\" href=\"/#{CACHE_PATH}#{stylesheet_filename(:mobile)}?#{stylesheet_hash(:mobile)}\" type=\"text/css\" media=\"all\">"
end
end

View file

@ -13,7 +13,7 @@ class DiscourseStylesheets
@lock.synchronize do
builder.compile unless File.exists?(builder.stylesheet_fullpath)
builder.ensure_digestless_file
%[<link href="#{Rails.env.production? ? builder.stylesheet_relpath : builder.stylesheet_relpath_no_digest + '?body=1'}" media="screen" rel="stylesheet" />].html_safe
%[<link href="#{Rails.env.production? ? builder.stylesheet_relpath : builder.stylesheet_relpath_no_digest + '?body=1'}" media="all" rel="stylesheet" />].html_safe
end
end

View file

@ -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 ==
"<link class=\"custom-css\" rel=\"stylesheet\" href=\"/uploads/stylesheet-cache/#{customization.key}.css?#{customization.stylesheet_hash}\" type=\"text/css\" media=\"screen\">"
"<link class=\"custom-css\" rel=\"stylesheet\" href=\"/uploads/stylesheet-cache/#{customization.key}.css?#{customization.stylesheet_hash}\" type=\"text/css\" media=\"all\">"
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 ==
"<link class=\"custom-css\" rel=\"stylesheet\" href=\"/uploads/stylesheet-cache/mobile_#{customization_with_mobile.key}.css?#{customization_with_mobile.stylesheet_hash(:mobile)}\" type=\"text/css\" media=\"screen\">"
"<link class=\"custom-css\" rel=\"stylesheet\" href=\"/uploads/stylesheet-cache/mobile_#{customization_with_mobile.key}.css?#{customization_with_mobile.stylesheet_hash(:mobile)}\" type=\"text/css\" media=\"all\">"
end
end