86 lines
3.3 KiB
SCSS
86 lines
3.3 KiB
SCSS
@import "compass/css3";
|
|
|
|
#gradient {
|
|
width: 200px;
|
|
height: 100px;
|
|
border: 1px solid #777777; }
|
|
|
|
thead th {
|
|
min-height: 50px;
|
|
min-width: 100px;
|
|
@include text-shadow(white); }
|
|
|
|
th.linear {
|
|
@include background-image(linear-gradient(white, red 50%, yellow 75%, lime)); }
|
|
|
|
th.radial {
|
|
@include background-image(radial-gradient(white, red 20px, yellow 30px, lime 40px)); }
|
|
|
|
tr.default {
|
|
td.linear {
|
|
@include background-image(linear-gradient(#cc0000, #0000cc)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(#cc0000, #0000cc)); }
|
|
td.linear-code:before {
|
|
content: "+background-image(linear-gradient(#c00, #00c))"; }
|
|
td.radial-code:before {
|
|
content: "+background-image(radial-gradient(#c00, #00c))"; } }
|
|
|
|
tr.top-left {
|
|
td.linear {
|
|
@include background-image(linear-gradient(top left, #cc0000, #0000cc)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(top left, #cc0000, #0000cc)); }
|
|
td.linear-code:before {
|
|
content: '+background-image(linear-gradient(top left, #c00, #00c))'; }
|
|
td.radial-code:before {
|
|
content: '+background-image(radial-gradient(top left, #c00, #00c))'; } }
|
|
|
|
tr.bottom-right {
|
|
td.linear {
|
|
@include background-image(linear-gradient(bottom right, #cc0000, #0000cc)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(bottom right, #cc0000, #0000cc)); }
|
|
td.linear-code:before {
|
|
content: '+background-image(linear-gradient(bottom right, #c00, #00c))'; }
|
|
td.radial-code:before {
|
|
content: '+background-image(radial-gradient(bottom right, #c00, #00c))'; } }
|
|
|
|
tr.three-color {
|
|
td.linear {
|
|
@include background-image(linear-gradient(#cc0000, white, #0000cc)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(#cc0000, white, #0000cc 50px)); }
|
|
td.linear-code:before {
|
|
content: "+background-image(linear-gradient(#c00, #fff, #00c))"; }
|
|
td.radial-code:before {
|
|
content: "+background-image(radial-gradient(#c00, #fff, #00c 50px))"; } }
|
|
|
|
tr.four-color {
|
|
td.linear {
|
|
@include background-image(linear-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(#cc0000, #00cc00 25%, #00cccc 75%, #0000cc 50px)); }
|
|
td.linear-code:before {
|
|
content: "+background-image(linear-gradient(#c00, #0c0 25%, #0cc 75%, #00c))"; }
|
|
td.radial-code:before {
|
|
content: "+background-image(radial-gradient(#c00, #0c0 25%, #0cc 75%, #00c 50px))"; } }
|
|
|
|
tr.filled-in {
|
|
td.linear {
|
|
@include background-image(linear-gradient(#cc0000 33%, #0000cc 66%)); }
|
|
td.radial {
|
|
@include background-image(radial-gradient(#cc0000 25px, #0000cc 75px)); }
|
|
td.linear-code:before {
|
|
content: "+background-image(linear-gradient(#c00 33%, #00c 66%))"; }
|
|
td.radial-code:before {
|
|
content: "+background-image(radial-gradient(#c00 25px, #00c 75px))"; } }
|
|
tr.with-bg {
|
|
td.linear {
|
|
@include background-image(image-url("button_bg.png"), linear-gradient(top, #c00 33%, #00c 66%)); }
|
|
td.radial {
|
|
@include background-image(image-url("button_bg.png"), radial-gradient(center center, #c00 25px, #00c 75px)); }
|
|
td.linear-code:before {
|
|
content: "+background-image(image-url(\"button_bg.png\"), linear-gradient(top, #c00 33%, #00c 66%))"; }
|
|
td.radial-code:before {
|
|
content: "+background-image(image-url(\"button_bg.png\"), radial-gradient(center center, #c00 25px, #00c 75px))"; } } |