diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js index d054d3b86..9f78827ff 100644 --- a/app/assets/javascripts/notes.js +++ b/app/assets/javascripts/notes.js @@ -3,7 +3,13 @@ Danbooru.Note = { create: function(id) { var $inner_border = $('
'); $inner_border.addClass("note-box-inner-border"); - $inner_border.css({opacity: 0.5}); + + $inner_border.css({ + opacity: 0.5, + "-ms-filter": "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)", + "filter": "alpha(opacity=50)", + zoom: 1 + }); var $note_box = $(''); $note_box.addClass("note-box"); diff --git a/app/assets/stylesheets/common/000_vars.css.scss b/app/assets/stylesheets/common/000_vars.css.scss index ab13b17a4..9b68cbf5b 100644 --- a/app/assets/stylesheets/common/000_vars.css.scss +++ b/app/assets/stylesheets/common/000_vars.css.scss @@ -9,4 +9,45 @@ $h2_size: 1.5em; $h3_size: 1.16667em; $h1_padding: 1.25em 0; $h2_padding: 1.45833em 0; -$h3_padding: 1.51785em 0; \ No newline at end of file +$h3_padding: 1.51785em 0; + +@mixin round-border($radius) { + -moz-border-radius: $radius; + -webkit-border-radius:; $radius; + -ms-border-radius:; $radius; + -o-border-radius:; $radius; + border-radius: $radius; +} + +@mixin box-shadow($x, $y, $blur, $color) { + -moz-box-shadow: $x $y $blur $color; + -webkit-box-shadow: $x $y $blur $color; + -ms-box-shadow: $x $y $blur $color; + -o-box-shadow: $x $y $blur $color; + box-shadow: $x $y $blur $color; +} + +@mixin text-shadow($x, $y, $blur, $color) { + -moz-text-shadow: $x $y $blur $color; + -webkit-text-shadow: $x $y $blur $color; + -ms-text-shadow: $x $y $blur $color; + -o-text-shadow: $x $y $blur $color; + text-shadow: $x $y $blur $color; +} + +@mixin transparency($value) { + opacity: $value; + -ms-filter: unqoute("progid:DXImageTransform.Microsoft.Alpha(Opacity=#{$value * 100})"); + filter: unquote("alpha(opacity=#{$value * 100})"); + zoom: 1; +} + +@mixin inline-block { + display: -moz-inline-box; + -moz-box-orient: vertical; + display: inline-block; + vertical-align: baseline; + zoom: 1; + *display: inline; + *vertical-align: auto; +} diff --git a/app/assets/stylesheets/common/020_base.css.scss b/app/assets/stylesheets/common/020_base.css.scss index b91761dc6..a429e4cff 100644 --- a/app/assets/stylesheets/common/020_base.css.scss +++ b/app/assets/stylesheets/common/020_base.css.scss @@ -79,28 +79,19 @@ img.wait { } input[type=text], input[type=password], input[type=url], textarea, button { -/* border: 1px solid #AAA;*/ font-size: 1em; -/* -moz-border-radius: 4px;*/ -/* -webkit-border-radius: 4px;*/ } input[type=submit] { padding: 1px 4px; -/* border: 1px solid #AAA;*/ -/* background-color: #EEE;*/ -/* -moz-border-radius: 4px;*/ -/* -webkit-border-radius: 4px;*/ font-size: 1em; cursor: pointer; } input:focus, textarea:focus { -/* background-color: #FFD;*/ } input[type=submit]:hover { -/* background-color: #F6F6F6;*/ } legend { diff --git a/app/assets/stylesheets/common/inline.css.scss b/app/assets/stylesheets/common/inline.css.scss index c2e8d69a5..3c2b0fbf1 100644 --- a/app/assets/stylesheets/common/inline.css.scss +++ b/app/assets/stylesheets/common/inline.css.scss @@ -28,10 +28,8 @@ span.key { border: 1px solid #333; padding: 1px 3px; color: white; - display: inline-block; width: 1em; text-align: center; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; + @include inline-block; + @include border-radius(3px); } diff --git a/app/assets/stylesheets/common/main_layout.css.scss b/app/assets/stylesheets/common/main_layout.css.scss index 65cdb9048..b8dba4473 100644 --- a/app/assets/stylesheets/common/main_layout.css.scss +++ b/app/assets/stylesheets/common/main_layout.css.scss @@ -57,7 +57,5 @@ div#more-links { width: 8em; line-height: 1.3em; padding: 0.2em 0.6em; - -moz-box-shadow: 2px 2px 2px #ccc; - -webkit-box-shadow: 2px 2px 2px #ccc; - box-shadow: 2px 2px 2px #ccc; + @include box-shadow(2px 2px 2px #ccc); } diff --git a/app/assets/stylesheets/mobile/posts.css.scss b/app/assets/stylesheets/mobile/posts.css.scss index f19ddecc8..bd7f06635 100644 --- a/app/assets/stylesheets/mobile/posts.css.scss +++ b/app/assets/stylesheets/mobile/posts.css.scss @@ -68,10 +68,10 @@ div.post-previews { article.post-preview { height: 188px; width: 188px; - display: inline-block; float: left; text-align: center; vertical-align: middle; + @include inline-block; } article.post-preview.blacklisted-active { @@ -106,8 +106,8 @@ div#tag-list { padding: 10px; li { - display: inline-block; margin: 2.5em 0.5em; + @include inline-block; a { background: #eee; @@ -115,9 +115,7 @@ div#tag-list { font-weight: bold; padding: 0.2em 0.5em; border: 1px solid #666; - -moz-border-radius: 0.5em; - -webkit-border-radius: 0.5em; - border-radius: 0.5em; + @include border-radius(0.5em); } } } diff --git a/app/assets/stylesheets/specific/comments.css.scss b/app/assets/stylesheets/specific/comments.css.scss index 0e9eff469..92f4e15e6 100644 --- a/app/assets/stylesheets/specific/comments.css.scss +++ b/app/assets/stylesheets/specific/comments.css.scss @@ -29,10 +29,16 @@ div.comments-for-post { } article.comment.below-threshold { + -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30); + filter: alpha(opacity=30); + zoom: 1; opacity: 0.3; } article.comment.below-threshold:hover { + -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); + filter: alpha(opacity=100); + zoom: 1; opacity: 1.0; } } diff --git a/app/assets/stylesheets/specific/pools.css.scss b/app/assets/stylesheets/specific/pools.css.scss index 1bc7fca0d..bed7d1adf 100644 --- a/app/assets/stylesheets/specific/pools.css.scss +++ b/app/assets/stylesheets/specific/pools.css.scss @@ -50,7 +50,7 @@ div#c-pool-orders { margin-bottom: 20px; width: 150px; padding: 10px; - display: inline-block; + @include inline-block; } li.ui-state-default { diff --git a/app/assets/stylesheets/specific/posts.css.scss b/app/assets/stylesheets/specific/posts.css.scss index 6cf7bae9d..d5fb295d4 100644 --- a/app/assets/stylesheets/specific/posts.css.scss +++ b/app/assets/stylesheets/specific/posts.css.scss @@ -9,10 +9,10 @@ article.post-preview { width: 150px; margin-right: 30px; margin-bottom: 30px; - display: inline-block; float: left; text-align: center; vertical-align: middle; + @include inline-block; } article.post-preview.blacklisted-active { @@ -108,10 +108,8 @@ div#c-posts { background: #EEE; padding: 0.5em; margin-bottom: 1em; - -moz-border-radius: 0.5em; - -webkit-border-radius: 0.5em; - border-radius: 0.5em; border: 1px solid #CCC; + @include border-radius(0.5em); p:last-child { margin-bottom: 0;