Permalink
Browse files

Added some tests

  • Loading branch information...
1 parent 8f8231a commit b87cf26ede2342cc388ce7d87912fa08c1667abf @kizu kizu committed with slang800 May 25, 2012
View
27 test/cases/linear-gradient.css
@@ -48,3 +48,30 @@ body {
background: -o-linear-gradient(top, #fff 0, #000 100%), #fff;
background: linear-gradient(top, #fff 0, #000 100%), #fff;
}
+body {
+ -webkit-border-image: -webkit-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
+ -moz-border-image: -moz-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
+ -o-border-image: -o-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
+ border-image: linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
+}
+body {
+ cursor: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ cursor: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ cursor: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ cursor: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ cursor: linear-gradient(40deg, #f00 0%, #0f0 100%);
+}
+body {
+ list-style: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style: linear-gradient(40deg, #f00 0%, #0f0 100%);
+}
+body {
+ list-style-image: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style-image: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style-image: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style-image: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
+ list-style-image: linear-gradient(40deg, #f00 0%, #0f0 100%);
+}
View
14 test/cases/linear-gradient.styl
@@ -24,3 +24,17 @@ body
body
background: linear-gradient(top, white, black), white
+
+body
+ border-image: linear-gradient(top, #fff, #000) 20% stretch stretch;
+
+gradient-var = linear-gradient(40deg, red, lime)
+
+body
+ cursor: gradient-var
+
+body
+ list-style: gradient-var
+
+body
+ list-style-image: gradient-var
View
28 test/cases/multiple-gradients.css
@@ -0,0 +1,28 @@
+.test1 {
+ background: -webkit-linear-gradient(top, #fff 0%, #000 100%), -webkit-linear-gradient(bottom, #000 0%, #fff 100%);
+ background: -moz-linear-gradient(top, #fff 0%, #000 100%), -moz-linear-gradient(bottom, #000 0%, #fff 100%);
+ background: -o-linear-gradient(top, #fff 0%, #000 100%), -o-linear-gradient(bottom, #000 0%, #fff 100%);
+ background: -ms-linear-gradient(top, #fff 0%, #000 100%), -ms-linear-gradient(bottom, #000 0%, #fff 100%);
+ background: linear-gradient(top, #fff 0%, #000 100%), linear-gradient(bottom, #000 0%, #fff 100%);
+}
+.test2 {
+ background: #fff -webkit-linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, -webkit-linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
+ background: #fff -moz-linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, -moz-linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
+ background: #fff -o-linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, -o-linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
+ background: #fff -ms-linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, -ms-linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
+ background: #fff linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
+}
+.test3 {
+ background-image: -webkit-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -webkit-linear-gradient(bottom, #000 0%, #fff 100%);
+ background-image: -moz-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -moz-linear-gradient(bottom, #000 0%, #fff 100%);
+ background-image: -o-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -o-linear-gradient(bottom, #000 0%, #fff 100%);
+ background-image: -ms-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -ms-linear-gradient(bottom, #000 0%, #fff 100%);
+ background-image: linear-gradient(top, #fff 0%, #000 100%), url("a.png"), linear-gradient(bottom, #000 0%, #fff 100%);
+}
+.test4 {
+ background: -webkit-linear-gradient(bottom, #000 0%, #fff 100%), -webkit-linear-gradient(top, #fff 0%, #000 100%);
+ background: -moz-linear-gradient(bottom, #000 0%, #fff 100%), -moz-linear-gradient(top, #fff 0%, #000 100%);
+ background: -o-linear-gradient(bottom, #000 0%, #fff 100%), -o-linear-gradient(top, #fff 0%, #000 100%);
+ background: -ms-linear-gradient(bottom, #000 0%, #fff 100%), -ms-linear-gradient(top, #fff 0%, #000 100%);
+ background: linear-gradient(bottom, #000 0%, #fff 100%), linear-gradient(top, #fff 0%, #000 100%);
+}
View
23 test/cases/multiple-gradients.styl
@@ -0,0 +1,23 @@
+
+@import 'nib/vendor'
+@import 'nib/gradients'
+
+.test1
+ background: linear-gradient(top, white, black),
+ linear-gradient(bottom, black, white)
+
+.test2
+ background: #fff \
+ linear-gradient(top, black, white) 0 0 no-repeat,
+ linear-gradient(bottom, black, white) 10px bottom repeat-y
+
+.test3
+ background-image: linear-gradient(top, white, black),
+ url(a.png),
+ linear-gradient(bottom, black, white)
+
+gradient1 = linear-gradient(top, white, black)
+gradient2 = linear-gradient(bottom, black, white)
+
+.test4
+ background: gradient2, gradient1
View
1 test/cases/vendor.styl
@@ -1,5 +1,6 @@
@import 'nib/vendor'
+@import 'nib/gradients'
vendor-prefixes = webkit moz official

0 comments on commit b87cf26

Please sign in to comment.