Skip to content
This repository
Browse code

Added some tests

  • Loading branch information...
commit b87cf26ede2342cc388ce7d87912fa08c1667abf 1 parent 8f8231a
Roman Komarov kizu authored slang800 committed
27 test/cases/linear-gradient.css
@@ -48,3 +48,30 @@ body {
48 48 background: -o-linear-gradient(top, #fff 0, #000 100%), #fff;
49 49 background: linear-gradient(top, #fff 0, #000 100%), #fff;
50 50 }
  51 +body {
  52 + -webkit-border-image: -webkit-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
  53 + -moz-border-image: -moz-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
  54 + -o-border-image: -o-linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
  55 + border-image: linear-gradient(top, #fff 0%, #000 100%) 20% stretch stretch;
  56 +}
  57 +body {
  58 + cursor: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
  59 + cursor: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
  60 + cursor: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
  61 + cursor: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
  62 + cursor: linear-gradient(40deg, #f00 0%, #0f0 100%);
  63 +}
  64 +body {
  65 + list-style: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
  66 + list-style: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
  67 + list-style: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
  68 + list-style: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
  69 + list-style: linear-gradient(40deg, #f00 0%, #0f0 100%);
  70 +}
  71 +body {
  72 + list-style-image: -webkit-linear-gradient(40deg, #f00 0%, #0f0 100%);
  73 + list-style-image: -moz-linear-gradient(40deg, #f00 0%, #0f0 100%);
  74 + list-style-image: -ms-linear-gradient(40deg, #f00 0%, #0f0 100%);
  75 + list-style-image: -o-linear-gradient(40deg, #f00 0%, #0f0 100%);
  76 + list-style-image: linear-gradient(40deg, #f00 0%, #0f0 100%);
  77 +}
14 test/cases/linear-gradient.styl
@@ -24,3 +24,17 @@ body
24 24
25 25 body
26 26 background: linear-gradient(top, white, black), white
  27 +
  28 +body
  29 + border-image: linear-gradient(top, #fff, #000) 20% stretch stretch;
  30 +
  31 +gradient-var = linear-gradient(40deg, red, lime)
  32 +
  33 +body
  34 + cursor: gradient-var
  35 +
  36 +body
  37 + list-style: gradient-var
  38 +
  39 +body
  40 + list-style-image: gradient-var
28 test/cases/multiple-gradients.css
... ... @@ -0,0 +1,28 @@
  1 +.test1 {
  2 + background: -webkit-linear-gradient(top, #fff 0%, #000 100%), -webkit-linear-gradient(bottom, #000 0%, #fff 100%);
  3 + background: -moz-linear-gradient(top, #fff 0%, #000 100%), -moz-linear-gradient(bottom, #000 0%, #fff 100%);
  4 + background: -o-linear-gradient(top, #fff 0%, #000 100%), -o-linear-gradient(bottom, #000 0%, #fff 100%);
  5 + background: -ms-linear-gradient(top, #fff 0%, #000 100%), -ms-linear-gradient(bottom, #000 0%, #fff 100%);
  6 + background: linear-gradient(top, #fff 0%, #000 100%), linear-gradient(bottom, #000 0%, #fff 100%);
  7 +}
  8 +.test2 {
  9 + 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;
  10 + 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;
  11 + 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;
  12 + 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;
  13 + background: #fff linear-gradient(top, #000 0%, #fff 100%) 0 0 no-repeat, linear-gradient(bottom, #000 0%, #fff 100%) 10px bottom repeat-y;
  14 +}
  15 +.test3 {
  16 + background-image: -webkit-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -webkit-linear-gradient(bottom, #000 0%, #fff 100%);
  17 + background-image: -moz-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -moz-linear-gradient(bottom, #000 0%, #fff 100%);
  18 + background-image: -o-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -o-linear-gradient(bottom, #000 0%, #fff 100%);
  19 + background-image: -ms-linear-gradient(top, #fff 0%, #000 100%), url("a.png"), -ms-linear-gradient(bottom, #000 0%, #fff 100%);
  20 + background-image: linear-gradient(top, #fff 0%, #000 100%), url("a.png"), linear-gradient(bottom, #000 0%, #fff 100%);
  21 +}
  22 +.test4 {
  23 + background: -webkit-linear-gradient(bottom, #000 0%, #fff 100%), -webkit-linear-gradient(top, #fff 0%, #000 100%);
  24 + background: -moz-linear-gradient(bottom, #000 0%, #fff 100%), -moz-linear-gradient(top, #fff 0%, #000 100%);
  25 + background: -o-linear-gradient(bottom, #000 0%, #fff 100%), -o-linear-gradient(top, #fff 0%, #000 100%);
  26 + background: -ms-linear-gradient(bottom, #000 0%, #fff 100%), -ms-linear-gradient(top, #fff 0%, #000 100%);
  27 + background: linear-gradient(bottom, #000 0%, #fff 100%), linear-gradient(top, #fff 0%, #000 100%);
  28 +}
23 test/cases/multiple-gradients.styl
... ... @@ -0,0 +1,23 @@
  1 +
  2 +@import 'nib/vendor'
  3 +@import 'nib/gradients'
  4 +
  5 +.test1
  6 + background: linear-gradient(top, white, black),
  7 + linear-gradient(bottom, black, white)
  8 +
  9 +.test2
  10 + background: #fff \
  11 + linear-gradient(top, black, white) 0 0 no-repeat,
  12 + linear-gradient(bottom, black, white) 10px bottom repeat-y
  13 +
  14 +.test3
  15 + background-image: linear-gradient(top, white, black),
  16 + url(a.png),
  17 + linear-gradient(bottom, black, white)
  18 +
  19 +gradient1 = linear-gradient(top, white, black)
  20 +gradient2 = linear-gradient(bottom, black, white)
  21 +
  22 +.test4
  23 + background: gradient2, gradient1
1  test/cases/vendor.styl
... ... @@ -1,5 +1,6 @@
1 1
2 2 @import 'nib/vendor'
  3 +@import 'nib/gradients'
3 4
4 5 vendor-prefixes = webkit moz official
5 6

0 comments on commit b87cf26

Please sign in to comment.
Something went wrong with that request. Please try again.