added scss functions

This commit is contained in:
albert
2011-11-14 11:44:38 -05:00
parent 973b8e693a
commit 65f62e0245
9 changed files with 64 additions and 28 deletions

View File

@@ -3,7 +3,13 @@ Danbooru.Note = {
create: function(id) { create: function(id) {
var $inner_border = $('<div/>'); var $inner_border = $('<div/>');
$inner_border.addClass("note-box-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 = $('<div/>'); var $note_box = $('<div/>');
$note_box.addClass("note-box"); $note_box.addClass("note-box");

View File

@@ -9,4 +9,45 @@ $h2_size: 1.5em;
$h3_size: 1.16667em; $h3_size: 1.16667em;
$h1_padding: 1.25em 0; $h1_padding: 1.25em 0;
$h2_padding: 1.45833em 0; $h2_padding: 1.45833em 0;
$h3_padding: 1.51785em 0; $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;
}

View File

@@ -79,28 +79,19 @@ img.wait {
} }
input[type=text], input[type=password], input[type=url], textarea, button { input[type=text], input[type=password], input[type=url], textarea, button {
/* border: 1px solid #AAA;*/
font-size: 1em; font-size: 1em;
/* -moz-border-radius: 4px;*/
/* -webkit-border-radius: 4px;*/
} }
input[type=submit] { input[type=submit] {
padding: 1px 4px; padding: 1px 4px;
/* border: 1px solid #AAA;*/
/* background-color: #EEE;*/
/* -moz-border-radius: 4px;*/
/* -webkit-border-radius: 4px;*/
font-size: 1em; font-size: 1em;
cursor: pointer; cursor: pointer;
} }
input:focus, textarea:focus { input:focus, textarea:focus {
/* background-color: #FFD;*/
} }
input[type=submit]:hover { input[type=submit]:hover {
/* background-color: #F6F6F6;*/
} }
legend { legend {

View File

@@ -28,10 +28,8 @@ span.key {
border: 1px solid #333; border: 1px solid #333;
padding: 1px 3px; padding: 1px 3px;
color: white; color: white;
display: inline-block;
width: 1em; width: 1em;
text-align: center; text-align: center;
-moz-border-radius: 3px; @include inline-block;
-webkit-border-radius: 3px; @include border-radius(3px);
border-radius: 3px;
} }

View File

@@ -57,7 +57,5 @@ div#more-links {
width: 8em; width: 8em;
line-height: 1.3em; line-height: 1.3em;
padding: 0.2em 0.6em; padding: 0.2em 0.6em;
-moz-box-shadow: 2px 2px 2px #ccc; @include box-shadow(2px 2px 2px #ccc);
-webkit-box-shadow: 2px 2px 2px #ccc;
box-shadow: 2px 2px 2px #ccc;
} }

View File

@@ -68,10 +68,10 @@ div.post-previews {
article.post-preview { article.post-preview {
height: 188px; height: 188px;
width: 188px; width: 188px;
display: inline-block;
float: left; float: left;
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
@include inline-block;
} }
article.post-preview.blacklisted-active { article.post-preview.blacklisted-active {
@@ -106,8 +106,8 @@ div#tag-list {
padding: 10px; padding: 10px;
li { li {
display: inline-block;
margin: 2.5em 0.5em; margin: 2.5em 0.5em;
@include inline-block;
a { a {
background: #eee; background: #eee;
@@ -115,9 +115,7 @@ div#tag-list {
font-weight: bold; font-weight: bold;
padding: 0.2em 0.5em; padding: 0.2em 0.5em;
border: 1px solid #666; border: 1px solid #666;
-moz-border-radius: 0.5em; @include border-radius(0.5em);
-webkit-border-radius: 0.5em;
border-radius: 0.5em;
} }
} }
} }

View File

@@ -29,10 +29,16 @@ div.comments-for-post {
} }
article.comment.below-threshold { article.comment.below-threshold {
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
filter: alpha(opacity=30);
zoom: 1;
opacity: 0.3; opacity: 0.3;
} }
article.comment.below-threshold:hover { article.comment.below-threshold:hover {
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
filter: alpha(opacity=100);
zoom: 1;
opacity: 1.0; opacity: 1.0;
} }
} }

View File

@@ -50,7 +50,7 @@ div#c-pool-orders {
margin-bottom: 20px; margin-bottom: 20px;
width: 150px; width: 150px;
padding: 10px; padding: 10px;
display: inline-block; @include inline-block;
} }
li.ui-state-default { li.ui-state-default {

View File

@@ -9,10 +9,10 @@ article.post-preview {
width: 150px; width: 150px;
margin-right: 30px; margin-right: 30px;
margin-bottom: 30px; margin-bottom: 30px;
display: inline-block;
float: left; float: left;
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
@include inline-block;
} }
article.post-preview.blacklisted-active { article.post-preview.blacklisted-active {
@@ -108,10 +108,8 @@ div#c-posts {
background: #EEE; background: #EEE;
padding: 0.5em; padding: 0.5em;
margin-bottom: 1em; margin-bottom: 1em;
-moz-border-radius: 0.5em;
-webkit-border-radius: 0.5em;
border-radius: 0.5em;
border: 1px solid #CCC; border: 1px solid #CCC;
@include border-radius(0.5em);
p:last-child { p:last-child {
margin-bottom: 0; margin-bottom: 0;