github-migration/compass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Upgrade some examples that were generating deprecation warnings.

Browse Source
This commit is contained in:
Chris Eppstein 2011-01-03 10:30:01 -08:00
parent 136954561f
commit 7b5aabd21a
6 changed files with 47 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
examples/blueprint_plugins/src/link_icons.scss
View File

@ -10,4 +10,4 @@ body {
// Not all links have a url structure that can be detected,
// So you can set them explicitly yourself like so:
a#this-is-a-pdf-link {
@include link-icon(unquote("pdf.png")); } }
@include link-icon("pdf.png"); } }

2
examples/blueprint_semantic/src/screen.scss
View File

@ -9,7 +9,7 @@ body.blueprint {
.container {
@include container; }
.showgrid {
background: inline_image(unquote("grid.png")); }
background: inline_image("grid.png"); }
hr {
@include colruler; }
hr.space {

2
examples/compass/src/sticky_footer.scss
View File

@ -1,7 +1,7 @@
@import "compass/reset";
@import "compass/layout";
@include sticky-footer(72px, unquote("#layout"), unquote("#layout_footer"), unquote("#footer"));
@include sticky-footer(72px, "#layout", "#layout_footer", "#footer");
#header {
background: #999999;

2
examples/compass/src/utilities.scss
View File

@ -57,7 +57,7 @@ h2 {
ul.comma-delimited {
@include comma-delimited-list; }
ol.pretty {
@include pretty-bullets(unquote("blue_arrow.gif"), 5px, 7px, 18px); } }
@include pretty-bullets("blue_arrow.gif", 5px, 7px, 18px); } }
#tables {
@include column(16);

60
examples/css3/src/gradients.scss
View File

@ -11,76 +11,76 @@ thead th {
@include text-shadow(white); }
th.linear {
@include linear-gradient(color-stops(white, red 50%, yellow 75%, lime)); }
@include background-image(linear-gradient(white, red 50%, yellow 75%, lime)); }
th.radial {
@include radial-gradient(color-stops(white, red 20px, yellow 30px, lime 40px)); }
@include background-image(radial-gradient(white, red 20px, yellow 30px, lime 40px)); }
tr.default {
td.linear {
@include linear-gradient(color-stops(#cc0000, #0000cc)); }
@include background-image(linear-gradient(#cc0000, #0000cc)); }
td.radial {
@include radial-gradient(color-stops(#cc0000, #0000cc)); }
@include background-image(radial-gradient(#cc0000, #0000cc)); }
td.linear-code:before {
content: "+linear-gradient(color-stops(#c00, #00c))"; }
content: "+background-image(linear-gradient(#c00, #00c))"; }
td.radial-code:before {
content: "+radial-gradient(color-stops(#c00, #00c))"; } }
content: "+background-image(radial-gradient(#c00, #00c))"; } }
tr.top-left {
td.linear {
@include linear-gradient(color-stops(#cc0000, #0000cc), unquote("top left")); }
@include background-image(linear-gradient(top left, #cc0000, #0000cc)); }
td.radial {
@include radial-gradient(color-stops(#cc0000, #0000cc), unquote("top left")); }
@include background-image(radial-gradient(top left, #cc0000, #0000cc)); }
td.linear-code:before {
content: '+linear-gradient(color-stops(#c00, #00c), "top left")'; }
content: '+background-image(linear-gradient(top left, #c00, #00c))'; }
td.radial-code:before {
content: '+radial-gradient(color-stops(#c00, #00c), "top left")'; } }
content: '+background-image(radial-gradient(top left, #c00, #00c))'; } }
tr.bottom-right {
td.linear {
@include linear-gradient(color-stops(#cc0000, #0000cc), unquote("bottom right")); }
@include background-image(linear-gradient(bottom right, #cc0000, #0000cc)); }
td.radial {
@include radial-gradient(color-stops(#cc0000, #0000cc), unquote("bottom right")); }
@include background-image(radial-gradient(bottom right, #cc0000, #0000cc)); }
td.linear-code:before {
content: '+linear-gradient(color-stops(#c00, #00c), "bottom right")'; }
content: '+background-image(linear-gradient(bottom right, #c00, #00c))'; }
td.radial-code:before {
content: '+radial-gradient(color-stops(#c00, #00c), "bottom right")'; } }
content: '+background-image(radial-gradient(bottom right, #c00, #00c))'; } }
tr.three-color {
td.linear {
@include linear-gradient(color-stops(#cc0000, white, #0000cc)); }
@include background-image(linear-gradient(#cc0000, white, #0000cc)); }
td.radial {
@include radial-gradient(color-stops(#cc0000, white, #0000cc 50px)); }
@include background-image(radial-gradient(#cc0000, white, #0000cc 50px)); }
td.linear-code:before {
content: "+linear-gradient(color-stops(#c00, #fff, #00c))"; }
content: "+background-image(linear-gradient(#c00, #fff, #00c))"; }
td.radial-code:before {
content: "+radial-gradient(color-stops(#c00, #fff, #00c 50px))"; } }
content: "+background-image(radial-gradient(#c00, #fff, #00c 50px))"; } }
tr.four-color {
td.linear {
@include linear-gradient(color-stops(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc)); }
@include background-image(linear-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc)); }
td.radial {
@include radial-gradient(color-stops(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc 50px)); }
@include background-image(radial-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc 50px)); }
td.linear-code:before {
content: "+linear-gradient(color-stops(#c00, #0c0 25%, #0cc 75%, #00c))"; }
content: "+background-image(linear-gradient(#c00, #0c0 25%, #0cc 75%, #00c))"; }
td.radial-code:before {
content: "+radial-gradient(color-stops(#c00, #0c0 25%, #0cc 75%, #00c 50px))"; } }
content: "+background-image(radial-gradient(#c00, #0c0 25%, #0cc 75%, #00c 50px))"; } }
tr.filled-in {
td.linear {
@include linear-gradient(color-stops(#cc0000 33%, #0000cc 66%)); }
@include background-image(linear-gradient(#cc0000 33%, #0000cc 66%)); }
td.radial {
@include radial-gradient(color-stops(#cc0000 25px, #0000cc 75px)); }
@include background-image(radial-gradient(#cc0000 25px, #0000cc 75px)); }
td.linear-code:before {
content: "+linear-gradient(color-stops(#c00 33%, #00c 66%))"; }
content: "+background-image(linear-gradient(#c00 33%, #00c 66%))"; }
td.radial-code:before {
content: "+radial-gradient(color-stops(#c00 25px, #00c 75px))"; } }
content: "+background-image(radial-gradient(#c00 25px, #00c 75px))"; } }
tr.with-bg {
td.linear {
@include linear-gradient(color-stops(#cc0000 33%, #0000cc 66%), top, image-url("button_bg.png")); }
@include background-image(image-url("button_bg.png"), linear-gradient(top, #c00 33%, #00c 66%)); }
td.radial {
@include radial-gradient(color-stops(#cc0000 25px, #0000cc 75px), center center, image-url("button_bg.png")); }
@include background-image(image-url("button_bg.png"), radial-gradient(center center, #c00 25px, #00c 75px)); }
td.linear-code:before {
content: "+linear-gradient(color-stops(#cc0000 33%, #0000cc 66%), top, image-url(\"button_bg.png\"))"; }
content: "+background-image(image-url(\"button_bg.png\"), linear-gradient(top, #c00 33%, #00c 66%))"; }
td.radial-code:before {
content: "+radial-gradient(color-stops(#cc0000 25px, #0000cc 75px), center center, image-url(\"button_bg.png\"))"; } }
content: "+background-image(image-url(\"button_bg.png\"), radial-gradient(center center, #c00 25px, #00c 75px))"; } }

32
examples/css3/src/main.scss
View File

@ -26,14 +26,14 @@ h1 {
min-width: $min_width;
border: 4px solid #{$border_color};
@include border-radius(0.667em);
@include box-shadow(darken($border_color, 40), 5px, 5px, 2px);
@include single-box-shadow(darken($border_color, 40), 5px, 5px, 2px);
margin-bottom: 1em;
h2 {
margin: 0.5em 0 1em;
text-align: center; } }
.inset {
@include box-shadow(darken($border_color, 40), 5px, 5px, 2px, 3px, inset);
@include single-box-shadow(darken($border_color, 40), 5px, 5px, 2px, 3px, inset);
}
.gutter {
@ -44,7 +44,7 @@ h1 {
content: " "; }
.example {
@include linear-gradient(color_stops(white, #cccccc));
@include background-image(linear-gradient(white, #cccccc));
pre {
padding: 1em;
margin: 1em;
@ -76,39 +76,33 @@ h1 {
#gradients {
.horizontal {
@include linear-gradient(color_stops(#d92626, #2626d9), left); }
@include background-image(left, linear-gradient(#d92626, #2626d9)); }
.vertical {
@include linear-gradient(color_stops(#d92626, #2626d9)); }
@include background-image(linear-gradient(#d92626, #2626d9)); }
.diagonal {
@include linear-gradient(color_stops(#d92626, #2626d9), unquote("right top")); }
@include background-image(linear-gradient(right top, #d92626, #2626d9)); }
.radial {
/* +radial-gradient(color_stops(#d92626 0, #2626d9 1)) */
@include radial-gradient(color_stops(#d92626 10px, #2626d9 150px));
@include background-image(radial-gradient(#d92626 10px, #2626d9 150px));
// +radial-gradient("center center, 10, center center, 100", #d92626, #2626d9)
// background-image: -moz-radial-gradient(20px center, circle, #d92626 10px, #2626d9 100px)
// background-color: #2626d9
}
.radial-1 {
// A default radial gradient:
/* +radial-gradient(color_stops(#ddd, #aaa)) */
@include radial-gradient(color_stops(#dddddd, #aaaaaa)); }
@include background-image(radial-gradient(#dddddd, #aaaaaa)); }
.radial-2 {
// A centered gradient
/* +radial-gradient(color_stops(#ddd, #aaa)) */
@include radial-gradient(color_stops(#dddddd, #aaaaaa)); }
@include background-image(radial-gradient(#dddddd, #aaaaaa)); }
.radial-3 {
// A centered radial gradient at the top
/* +radial-gradient(color_stops(#ddd, #aaa), "top center") */
@include radial-gradient(color_stops(#dddddd, #aaaaaa), unquote("top center")); }
@include background-image(radial-gradient(top center, #dddddd, #aaaaaa)); }
.radial-4 {
// A centered radial gradient with fixed color stops
/* +radial-gradient(color_stops(#ddd 20px, #aaa 50px)) */
@include radial-gradient(color_stops(#dddddd 20px, #aaaaaa 50px)); }
@include background-image(radial-gradient(#dddddd 20px, #aaaaaa 50px)); }
.radial-5 {
// A centered gradient with several color stops
/* +radial-gradient(color_stops(#ddd 20%, #aaa 50%, #c00)) */
@include radial-gradient(color_stops(#dddddd 20px, #aaaaaa 50%, #cc0000 200px)); }
@include background-image(radial-gradient(#dddddd 20px, #aaaaaa 50%, #cc0000 200px)); }
.radial-6 {
// A centered gradient with color stops
/* +radial-gradient(color_stops(#0c0, #ddd 20%, #aaa 50%, #00c)) */
@include radial-gradient(color_stops(#00cc00 0px, #dddddd 20px, #aaaaaa 50px, #0000cc 100px)); } }
@include background-image(radial-gradient(#00cc00 0px, #dddddd 20px, #aaaaaa 50px, #0000cc 100px)); } }