Mercurial > hg > mpiwgzen_wide

comparison sass-extensions/zen-grids/templates/unit-tests/sass/zen-grid-flow-item.scss @ 0:a3750d724105 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
initital
author Dirk Wintergruen <dwinter@mpiwg-berlin.mpg.de>
date Tue, 02 Jun 2015 09:16:36 +0200
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:a3750d724105
1 /**
2 * @file
3 * Test zen-grid-flow-item()
4 */
5
6 @import "zen";
7
8 #test-zen-grid-flow-item {
9 /* Test zen-grid-flow-item(1) without setting $column-count */
10 @include zen-grid-flow-item(1);
11
12 /* Test zen-grid-flow-item(1, 4) with 20px gutter */
13 @include zen-grid-flow-item(1, 4);
14
15 /* Test zen-grid-flow-item(1, 4) with 15px gutter */
16 $zen-gutter-width: 15px;
17 @include zen-grid-flow-item(1, 4);
18 $zen-gutter-width: 20px;
19
20 /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter and $zen-grid-width: 1000px */
21 $zen-column-count: 5;
22 $zen-grid-width: 1000px;
23 @include zen-grid-flow-item(1);
24 $zen-column-count: 1;
25 $zen-grid-width: 100%;
26
27 /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px, $alpha-gutter: true and $omega-gutter: false */
28 $zen-column-count: 5;
29 $zen-grid-width: 1000px;
30 @include zen-grid-flow-item(1, $alpha-gutter: true, $omega-gutter: false);
31 $zen-column-count: 1;
32 $zen-grid-width: 100%;
33
34 /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px and $omega-gutter: false */
35 $zen-column-count: 5;
36 $zen-grid-width: 1000px;
37 @include zen-grid-flow-item(1, $omega-gutter: false);
38 $zen-column-count: 1;
39 $zen-grid-width: 100%;
40
41 /* Test zen-grid-flow-item(1, 4) with 15px gutter and $zen-float-direction: right */
42 $zen-gutter-width: 15px;
43 $zen-float-direction: right;
44 @include zen-grid-flow-item(1, 4);
45 $zen-gutter-width: 20px;
46 $zen-float-direction: left;
47
48 /* Test zen-grid-flow-item(1, 4) with 15px gutter and $alpha-gutter: true */
49 $zen-gutter-width: 15px;
50 @include zen-grid-flow-item(1, 4, $alpha-gutter: true);
51 $zen-gutter-width: 20px;
52
53 /* Test zen-grid-flow-item(1, 4) with 15px gutter and $omega-gutter: false */
54 $zen-gutter-width: 15px;
55 @include zen-grid-flow-item(1, 4, $omega-gutter: false);
56 $zen-gutter-width: 20px;
57
58 /* Test zen-grid-flow-item(3, 4) with 20px gutter and $alpha-gutter: true */
59 @include zen-grid-flow-item(3, 4, $alpha-gutter: true);
60
61 /* Test zen-grid-flow-item(3, 4) with 20px gutter and $omega-gutter: false */
62 @include zen-grid-flow-item(3, 4, $omega-gutter: false);
63
64 /* Test zen-grid-flow-item(1, 4) with 15px gutter, $zen-float-direction: right and $alpha-gutter: true */
65 $zen-gutter-width: 15px;
66 $zen-float-direction: right;
67 @include zen-grid-flow-item(1, 4, $alpha-gutter: true);
68 $zen-gutter-width: 20px;
69 $zen-float-direction: left;
70
71 /* Test zen-grid-flow-item(1, 4) with $zen-box-sizing: content-box and 10% gutter */
72 $zen-gutter-width: 10%;
73 $zen-box-sizing: content-box;
74 @include zen-grid-flow-item(1, 4);
75 $zen-gutter-width: 20px;
76 $zen-box-sizing: border-box;
77
78 /* Test zen-grid-flow-item(1, 4) with $zen-auto-include-flow-item-base: false */
79 $zen-auto-include-flow-item-base: false;
80 @include zen-grid-flow-item(1, 4);
81 }