tachyonscss-rails 4.9.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (69) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.md +33 -0
  3. data/README.md +42 -0
  4. data/Rakefile +43 -0
  5. data/app/assets/stylesheets/scss/_aspect-ratios.scss +142 -0
  6. data/app/assets/stylesheets/scss/_background-position.scss +133 -0
  7. data/app/assets/stylesheets/scss/_background-size.scss +41 -0
  8. data/app/assets/stylesheets/scss/_border-colors.scss +93 -0
  9. data/app/assets/stylesheets/scss/_border-radius.scss +134 -0
  10. data/app/assets/stylesheets/scss/_border-style.scss +55 -0
  11. data/app/assets/stylesheets/scss/_border-widths.scss +81 -0
  12. data/app/assets/stylesheets/scss/_borders.scss +65 -0
  13. data/app/assets/stylesheets/scss/_box-shadow.scss +48 -0
  14. data/app/assets/stylesheets/scss/_box-sizing.scss +49 -0
  15. data/app/assets/stylesheets/scss/_clears.scss +47 -0
  16. data/app/assets/stylesheets/scss/_code.scss +18 -0
  17. data/app/assets/stylesheets/scss/_coordinates.scss +153 -0
  18. data/app/assets/stylesheets/scss/_debug-children.scss +21 -0
  19. data/app/assets/stylesheets/scss/_debug-grid.scss +33 -0
  20. data/app/assets/stylesheets/scss/_debug.scss +127 -0
  21. data/app/assets/stylesheets/scss/_debug_children.scss +18 -0
  22. data/app/assets/stylesheets/scss/_display.scss +111 -0
  23. data/app/assets/stylesheets/scss/_flexbox.scss +257 -0
  24. data/app/assets/stylesheets/scss/_floats.scss +56 -0
  25. data/app/assets/stylesheets/scss/_font-family.scss +99 -0
  26. data/app/assets/stylesheets/scss/_font-style.scss +36 -0
  27. data/app/assets/stylesheets/scss/_font-weight.scss +87 -0
  28. data/app/assets/stylesheets/scss/_forms.scss +23 -0
  29. data/app/assets/stylesheets/scss/_gradients.scss +29 -0
  30. data/app/assets/stylesheets/scss/_heights.scss +131 -0
  31. data/app/assets/stylesheets/scss/_hovers.scss +166 -0
  32. data/app/assets/stylesheets/scss/_images.scss +18 -0
  33. data/app/assets/stylesheets/scss/_letter-spacing.scss +40 -0
  34. data/app/assets/stylesheets/scss/_line-height.scss +41 -0
  35. data/app/assets/stylesheets/scss/_links.scss +34 -0
  36. data/app/assets/stylesheets/scss/_lists.scss +15 -0
  37. data/app/assets/stylesheets/scss/_max-widths.scss +105 -0
  38. data/app/assets/stylesheets/scss/_module-template.scss +29 -0
  39. data/app/assets/stylesheets/scss/_negative-margins.scss +205 -0
  40. data/app/assets/stylesheets/scss/_nested.scss +63 -0
  41. data/app/assets/stylesheets/scss/_normalize.scss +454 -0
  42. data/app/assets/stylesheets/scss/_opacity.scss +27 -0
  43. data/app/assets/stylesheets/scss/_outlines.scss +39 -0
  44. data/app/assets/stylesheets/scss/_overflow.scss +82 -0
  45. data/app/assets/stylesheets/scss/_position.scss +44 -0
  46. data/app/assets/stylesheets/scss/_rotations.scss +50 -0
  47. data/app/assets/stylesheets/scss/_skins-pseudo.scss +243 -0
  48. data/app/assets/stylesheets/scss/_skins.scss +143 -0
  49. data/app/assets/stylesheets/scss/_spacing.scss +947 -0
  50. data/app/assets/stylesheets/scss/_styles.scss +15 -0
  51. data/app/assets/stylesheets/scss/_tables.scss +42 -0
  52. data/app/assets/stylesheets/scss/_text-align.scss +53 -0
  53. data/app/assets/stylesheets/scss/_text-decoration.scss +42 -0
  54. data/app/assets/stylesheets/scss/_text-transform.scss +53 -0
  55. data/app/assets/stylesheets/scss/_type-scale.scss +102 -0
  56. data/app/assets/stylesheets/scss/_typography.scss +129 -0
  57. data/app/assets/stylesheets/scss/_utilities.scss +57 -0
  58. data/app/assets/stylesheets/scss/_variables.scss +143 -0
  59. data/app/assets/stylesheets/scss/_vertical-align.scss +43 -0
  60. data/app/assets/stylesheets/scss/_visibility.scss +58 -0
  61. data/app/assets/stylesheets/scss/_white-space.scss +41 -0
  62. data/app/assets/stylesheets/scss/_widths.scss +150 -0
  63. data/app/assets/stylesheets/scss/_word-break.scss +43 -0
  64. data/app/assets/stylesheets/scss/_z-index.scss +60 -0
  65. data/app/assets/stylesheets/tachyons.scss +94 -0
  66. data/lib/tachyonscss-rails/engine.rb +11 -0
  67. data/lib/tachyonscss-rails/version.rb +3 -0
  68. data/lib/tachyonscss-rails.rb +5 -0
  69. metadata +113 -0
@@ -0,0 +1,127 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+
9
+ body { outline: 1px solid #2980B9!important; }
10
+ article { outline: 1px solid #3498DB!important; }
11
+ nav { outline: 1px solid #0088C3!important; }
12
+ aside { outline: 1px solid #33A0CE!important; }
13
+ section { outline: 1px solid #66B8DA!important; }
14
+ header { outline: 1px solid #99CFE7!important; }
15
+ footer { outline: 1px solid #CCE7F3!important; }
16
+ h1 { outline: 1px solid #162544!important; }
17
+ h2 { outline: 1px solid #314E6E!important; }
18
+ h3 { outline: 1px solid #3E5E85!important; }
19
+ h4 { outline: 1px solid #449BAF!important; }
20
+ h5 { outline: 1px solid #C7D1CB!important; }
21
+ h6 { outline: 1px solid #4371D0!important; }
22
+ main { outline: 1px solid #2F4F90!important; }
23
+ address { outline: 1px solid #1A2C51!important; }
24
+ div { outline: 1px solid #036CDB!important; }
25
+
26
+
27
+ p { outline: 1px solid #AC050B!important; }
28
+ hr { outline: 1px solid #FF063F!important; }
29
+ pre { outline: 1px solid #850440!important; }
30
+ blockquote { outline: 1px solid #F1B8E7!important; }
31
+ ol { outline: 1px solid #FF050C!important; }
32
+ ul { outline: 1px solid #D90416!important; }
33
+ li { outline: 1px solid #D90416!important; }
34
+ dl { outline: 1px solid #FD3427!important; }
35
+ dt { outline: 1px solid #FF0043!important; }
36
+ dd { outline: 1px solid #E80174!important; }
37
+ figure { outline: 1px solid #FF00BB!important; }
38
+ figcaption { outline: 1px solid #BF0032!important; }
39
+
40
+
41
+
42
+ table { outline: 1px solid #00CC99!important; }
43
+ caption { outline: 1px solid #37FFC4!important; }
44
+ thead { outline: 1px solid #98DACA!important; }
45
+ tbody { outline: 1px solid #64A7A0!important; }
46
+ tfoot { outline: 1px solid #22746B!important; }
47
+ tr { outline: 1px solid #86C0B2!important; }
48
+ th { outline: 1px solid #A1E7D6!important; }
49
+ td { outline: 1px solid #3F5A54!important; }
50
+ col { outline: 1px solid #6C9A8F!important; }
51
+ colgroup { outline: 1px solid #6C9A9D!important; }
52
+
53
+
54
+ button { outline: 1px solid #DA8301!important; }
55
+ datalist { outline: 1px solid #C06000!important; }
56
+ fieldset { outline: 1px solid #D95100!important; }
57
+ form { outline: 1px solid #D23600!important; }
58
+ input { outline: 1px solid #FCA600!important; }
59
+ keygen { outline: 1px solid #B31E00!important; }
60
+ label { outline: 1px solid #EE8900!important; }
61
+ legend { outline: 1px solid #DE6D00!important; }
62
+ meter { outline: 1px solid #E8630C!important; }
63
+ optgroup { outline: 1px solid #B33600!important; }
64
+ option { outline: 1px solid #FF8A00!important; }
65
+ output { outline: 1px solid #FF9619!important; }
66
+ progress { outline: 1px solid #E57C00!important; }
67
+ select { outline: 1px solid #E26E0F!important; }
68
+ textarea { outline: 1px solid #CC5400!important; }
69
+
70
+
71
+
72
+ details { outline: 1px solid #33848F!important; }
73
+ summary { outline: 1px solid #60A1A6!important; }
74
+ command { outline: 1px solid #438DA1!important; }
75
+ menu { outline: 1px solid #449DA6!important; }
76
+
77
+
78
+
79
+ del { outline: 1px solid #BF0000!important; }
80
+ ins { outline: 1px solid #400000!important; }
81
+
82
+
83
+
84
+ img { outline: 1px solid #22746B!important; }
85
+ iframe { outline: 1px solid #64A7A0!important; }
86
+ embed { outline: 1px solid #98DACA!important; }
87
+ object { outline: 1px solid #00CC99!important; }
88
+ param { outline: 1px solid #37FFC4!important; }
89
+ video { outline: 1px solid #6EE866!important; }
90
+ audio { outline: 1px solid #027353!important; }
91
+ source { outline: 1px solid #012426!important; }
92
+ canvas { outline: 1px solid #A2F570!important; }
93
+ track { outline: 1px solid #59A600!important; }
94
+ map { outline: 1px solid #7BE500!important; }
95
+ area { outline: 1px solid #305900!important; }
96
+
97
+
98
+
99
+ a { outline: 1px solid #FF62AB!important; }
100
+ em { outline: 1px solid #800B41!important; }
101
+ strong { outline: 1px solid #FF1583!important; }
102
+ i { outline: 1px solid #803156!important; }
103
+ b { outline: 1px solid #CC1169!important; }
104
+ u { outline: 1px solid #FF0430!important; }
105
+ s { outline: 1px solid #F805E3!important; }
106
+ small { outline: 1px solid #D107B2!important; }
107
+ abbr { outline: 1px solid #4A0263!important; }
108
+ q { outline: 1px solid #240018!important; }
109
+ cite { outline: 1px solid #64003C!important; }
110
+ dfn { outline: 1px solid #B4005A!important; }
111
+ sub { outline: 1px solid #DBA0C8!important; }
112
+ sup { outline: 1px solid #CC0256!important; }
113
+ time { outline: 1px solid #D6606D!important; }
114
+ code { outline: 1px solid #E04251!important; }
115
+ kbd { outline: 1px solid #5E001F!important; }
116
+ samp { outline: 1px solid #9C0033!important; }
117
+ var { outline: 1px solid #D90047!important; }
118
+ mark { outline: 1px solid #FF0053!important; }
119
+ bdi { outline: 1px solid #BF3668!important; }
120
+ bdo { outline: 1px solid #6F1400!important; }
121
+ ruby { outline: 1px solid #FF7B93!important; }
122
+ rt { outline: 1px solid #FF2F54!important; }
123
+ rp { outline: 1px solid #803E49!important; }
124
+ span { outline: 1px solid #CC2643!important; }
125
+ br { outline: 1px solid #DB687D!important; }
126
+ wbr { outline: 1px solid #DB175B!important; }
127
+
@@ -0,0 +1,18 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ DEBUG CHILDREN
11
+
12
+ Just add the debug class to any element to see outlines on its
13
+ children.
14
+
15
+ */
16
+
17
+ .debug * { outline: 1px solid gold; }
18
+
@@ -0,0 +1,111 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ DISPLAY
11
+ Docs: http://tachyons.io/docs/layout/display
12
+
13
+ Base:
14
+ d = display
15
+
16
+ Modifiers:
17
+ n = none
18
+ b = block
19
+ ib = inline-block
20
+ it = inline-table
21
+ t = table
22
+ tc = table-cell
23
+ tr = table-row
24
+ tcol = table-column
25
+ tcolg = table-column-group
26
+
27
+ Media Query Extensions:
28
+ -ns = not-small
29
+ -m = medium
30
+ -l = large
31
+
32
+ */
33
+
34
+ .dn { display: none; }
35
+ .di { display: inline; }
36
+ .db { display: block; }
37
+ .dib { display: inline-block; }
38
+ .dit { display: inline-table; }
39
+ .dt { display: table; }
40
+ .dtc { display: table-cell; }
41
+ .dt-row { display: table-row; }
42
+ .dt-row-group { display: table-row-group; }
43
+ .dt-column { display: table-column; }
44
+ .dt-column-group { display: table-column-group; }
45
+
46
+ /*
47
+ This will set table to full width and then
48
+ all cells will be equal width
49
+ */
50
+ .dt--fixed {
51
+ table-layout: fixed;
52
+ width: 100%;
53
+ }
54
+
55
+ @media #{$breakpoint-not-small} {
56
+ .dn-ns { display: none; }
57
+ .di-ns { display: inline; }
58
+ .db-ns { display: block; }
59
+ .dib-ns { display: inline-block; }
60
+ .dit-ns { display: inline-table; }
61
+ .dt-ns { display: table; }
62
+ .dtc-ns { display: table-cell; }
63
+ .dt-row-ns { display: table-row; }
64
+ .dt-row-group-ns { display: table-row-group; }
65
+ .dt-column-ns { display: table-column; }
66
+ .dt-column-group-ns { display: table-column-group; }
67
+
68
+ .dt--fixed-ns {
69
+ table-layout: fixed;
70
+ width: 100%;
71
+ }
72
+ }
73
+
74
+ @media #{$breakpoint-medium} {
75
+ .dn-m { display: none; }
76
+ .di-m { display: inline; }
77
+ .db-m { display: block; }
78
+ .dib-m { display: inline-block; }
79
+ .dit-m { display: inline-table; }
80
+ .dt-m { display: table; }
81
+ .dtc-m { display: table-cell; }
82
+ .dt-row-m { display: table-row; }
83
+ .dt-row-group-m { display: table-row-group; }
84
+ .dt-column-m { display: table-column; }
85
+ .dt-column-group-m { display: table-column-group; }
86
+
87
+ .dt--fixed-m {
88
+ table-layout: fixed;
89
+ width: 100%;
90
+ }
91
+ }
92
+
93
+ @media #{$breakpoint-large} {
94
+ .dn-l { display: none; }
95
+ .di-l { display: inline; }
96
+ .db-l { display: block; }
97
+ .dib-l { display: inline-block; }
98
+ .dit-l { display: inline-table; }
99
+ .dt-l { display: table; }
100
+ .dtc-l { display: table-cell; }
101
+ .dt-row-l { display: table-row; }
102
+ .dt-row-group-l { display: table-row-group; }
103
+ .dt-column-l { display: table-column; }
104
+ .dt-column-group-l { display: table-column-group; }
105
+
106
+ .dt--fixed-l {
107
+ table-layout: fixed;
108
+ width: 100%;
109
+ }
110
+ }
111
+
@@ -0,0 +1,257 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ FLEXBOX
11
+
12
+ Media Query Extensions:
13
+ -ns = not-small
14
+ -m = medium
15
+ -l = large
16
+
17
+ */
18
+
19
+ .flex { display: flex; }
20
+ .inline-flex { display: inline-flex; }
21
+
22
+ /* 1. Fix for Chrome 44 bug.
23
+ * https://code.google.com/p/chromium/issues/detail?id=506893 */
24
+ .flex-auto {
25
+ flex: 1 1 auto;
26
+ min-width: 0; /* 1 */
27
+ min-height: 0; /* 1 */
28
+ }
29
+
30
+ .flex-none { flex: none; }
31
+
32
+ .flex-column { flex-direction: column; }
33
+ .flex-row { flex-direction: row; }
34
+ .flex-wrap { flex-wrap: wrap; }
35
+ .flex-nowrap { flex-wrap: nowrap; }
36
+ .flex-wrap-reverse { flex-wrap: wrap-reverse; }
37
+ .flex-column-reverse { flex-direction: column-reverse; }
38
+ .flex-row-reverse { flex-direction: row-reverse; }
39
+
40
+ .items-start { align-items: flex-start; }
41
+ .items-end { align-items: flex-end; }
42
+ .items-center { align-items: center; }
43
+ .items-baseline { align-items: baseline; }
44
+ .items-stretch { align-items: stretch; }
45
+
46
+ .self-start { align-self: flex-start; }
47
+ .self-end { align-self: flex-end; }
48
+ .self-center { align-self: center; }
49
+ .self-baseline { align-self: baseline; }
50
+ .self-stretch { align-self: stretch; }
51
+
52
+ .justify-start { justify-content: flex-start; }
53
+ .justify-end { justify-content: flex-end; }
54
+ .justify-center { justify-content: center; }
55
+ .justify-between { justify-content: space-between; }
56
+ .justify-around { justify-content: space-around; }
57
+
58
+ .content-start { align-content: flex-start; }
59
+ .content-end { align-content: flex-end; }
60
+ .content-center { align-content: center; }
61
+ .content-between { align-content: space-between; }
62
+ .content-around { align-content: space-around; }
63
+ .content-stretch { align-content: stretch; }
64
+
65
+ .order-0 { order: 0; }
66
+ .order-1 { order: 1; }
67
+ .order-2 { order: 2; }
68
+ .order-3 { order: 3; }
69
+ .order-4 { order: 4; }
70
+ .order-5 { order: 5; }
71
+ .order-6 { order: 6; }
72
+ .order-7 { order: 7; }
73
+ .order-8 { order: 8; }
74
+ .order-last { order: 99999; }
75
+
76
+ .flex-grow-0 { flex-grow: 0; }
77
+ .flex-grow-1 { flex-grow: 1; }
78
+
79
+ .flex-shrink-0 { flex-shrink: 0; }
80
+ .flex-shrink-1 { flex-shrink: 1; }
81
+
82
+ @media #{$breakpoint-not-small} {
83
+ .flex-ns { display: flex; }
84
+ .inline-flex-ns { display: inline-flex; }
85
+ .flex-auto-ns {
86
+ flex: 1 1 auto;
87
+ min-width: 0; /* 1 */
88
+ min-height: 0; /* 1 */
89
+ }
90
+ .flex-none-ns { flex: none; }
91
+ .flex-column-ns { flex-direction: column; }
92
+ .flex-row-ns { flex-direction: row; }
93
+ .flex-wrap-ns { flex-wrap: wrap; }
94
+ .flex-nowrap-ns { flex-wrap: nowrap; }
95
+ .flex-wrap-reverse-ns { flex-wrap: wrap-reverse; }
96
+ .flex-column-reverse-ns { flex-direction: column-reverse; }
97
+ .flex-row-reverse-ns { flex-direction: row-reverse; }
98
+ .items-start-ns { align-items: flex-start; }
99
+ .items-end-ns { align-items: flex-end; }
100
+ .items-center-ns { align-items: center; }
101
+ .items-baseline-ns { align-items: baseline; }
102
+ .items-stretch-ns { align-items: stretch; }
103
+
104
+ .self-start-ns { align-self: flex-start; }
105
+ .self-end-ns { align-self: flex-end; }
106
+ .self-center-ns { align-self: center; }
107
+ .self-baseline-ns { align-self: baseline; }
108
+ .self-stretch-ns { align-self: stretch; }
109
+
110
+ .justify-start-ns { justify-content: flex-start; }
111
+ .justify-end-ns { justify-content: flex-end; }
112
+ .justify-center-ns { justify-content: center; }
113
+ .justify-between-ns { justify-content: space-between; }
114
+ .justify-around-ns { justify-content: space-around; }
115
+
116
+ .content-start-ns { align-content: flex-start; }
117
+ .content-end-ns { align-content: flex-end; }
118
+ .content-center-ns { align-content: center; }
119
+ .content-between-ns { align-content: space-between; }
120
+ .content-around-ns { align-content: space-around; }
121
+ .content-stretch-ns { align-content: stretch; }
122
+
123
+ .order-0-ns { order: 0; }
124
+ .order-1-ns { order: 1; }
125
+ .order-2-ns { order: 2; }
126
+ .order-3-ns { order: 3; }
127
+ .order-4-ns { order: 4; }
128
+ .order-5-ns { order: 5; }
129
+ .order-6-ns { order: 6; }
130
+ .order-7-ns { order: 7; }
131
+ .order-8-ns { order: 8; }
132
+ .order-last-ns { order: 99999; }
133
+
134
+ .flex-grow-0-ns { flex-grow: 0; }
135
+ .flex-grow-1-ns { flex-grow: 1; }
136
+
137
+ .flex-shrink-0-ns { flex-shrink: 0; }
138
+ .flex-shrink-1-ns { flex-shrink: 1; }
139
+ }
140
+ @media #{$breakpoint-medium} {
141
+ .flex-m { display: flex; }
142
+ .inline-flex-m { display: inline-flex; }
143
+ .flex-auto-m {
144
+ flex: 1 1 auto;
145
+ min-width: 0; /* 1 */
146
+ min-height: 0; /* 1 */
147
+ }
148
+ .flex-none-m { flex: none; }
149
+ .flex-column-m { flex-direction: column; }
150
+ .flex-row-m { flex-direction: row; }
151
+ .flex-wrap-m { flex-wrap: wrap; }
152
+ .flex-nowrap-m { flex-wrap: nowrap; }
153
+ .flex-wrap-reverse-m { flex-wrap: wrap-reverse; }
154
+ .flex-column-reverse-m { flex-direction: column-reverse; }
155
+ .flex-row-reverse-m { flex-direction: row-reverse; }
156
+ .items-start-m { align-items: flex-start; }
157
+ .items-end-m { align-items: flex-end; }
158
+ .items-center-m { align-items: center; }
159
+ .items-baseline-m { align-items: baseline; }
160
+ .items-stretch-m { align-items: stretch; }
161
+
162
+ .self-start-m { align-self: flex-start; }
163
+ .self-end-m { align-self: flex-end; }
164
+ .self-center-m { align-self: center; }
165
+ .self-baseline-m { align-self: baseline; }
166
+ .self-stretch-m { align-self: stretch; }
167
+
168
+ .justify-start-m { justify-content: flex-start; }
169
+ .justify-end-m { justify-content: flex-end; }
170
+ .justify-center-m { justify-content: center; }
171
+ .justify-between-m { justify-content: space-between; }
172
+ .justify-around-m { justify-content: space-around; }
173
+
174
+ .content-start-m { align-content: flex-start; }
175
+ .content-end-m { align-content: flex-end; }
176
+ .content-center-m { align-content: center; }
177
+ .content-between-m { align-content: space-between; }
178
+ .content-around-m { align-content: space-around; }
179
+ .content-stretch-m { align-content: stretch; }
180
+
181
+ .order-0-m { order: 0; }
182
+ .order-1-m { order: 1; }
183
+ .order-2-m { order: 2; }
184
+ .order-3-m { order: 3; }
185
+ .order-4-m { order: 4; }
186
+ .order-5-m { order: 5; }
187
+ .order-6-m { order: 6; }
188
+ .order-7-m { order: 7; }
189
+ .order-8-m { order: 8; }
190
+ .order-last-m { order: 99999; }
191
+
192
+ .flex-grow-0-m { flex-grow: 0; }
193
+ .flex-grow-1-m { flex-grow: 1; }
194
+
195
+ .flex-shrink-0-m { flex-shrink: 0; }
196
+ .flex-shrink-1-m { flex-shrink: 1; }
197
+ }
198
+
199
+ @media #{$breakpoint-large} {
200
+ .flex-l { display: flex; }
201
+ .inline-flex-l { display: inline-flex; }
202
+ .flex-auto-l {
203
+ flex: 1 1 auto;
204
+ min-width: 0; /* 1 */
205
+ min-height: 0; /* 1 */
206
+ }
207
+ .flex-none-l { flex: none; }
208
+ .flex-column-l { flex-direction: column; }
209
+ .flex-row-l { flex-direction: row; }
210
+ .flex-wrap-l { flex-wrap: wrap; }
211
+ .flex-nowrap-l { flex-wrap: nowrap; }
212
+ .flex-wrap-reverse-l { flex-wrap: wrap-reverse; }
213
+ .flex-column-reverse-l { flex-direction: column-reverse; }
214
+ .flex-row-reverse-l { flex-direction: row-reverse; }
215
+
216
+ .items-start-l { align-items: flex-start; }
217
+ .items-end-l { align-items: flex-end; }
218
+ .items-center-l { align-items: center; }
219
+ .items-baseline-l { align-items: baseline; }
220
+ .items-stretch-l { align-items: stretch; }
221
+
222
+ .self-start-l { align-self: flex-start; }
223
+ .self-end-l { align-self: flex-end; }
224
+ .self-center-l { align-self: center; }
225
+ .self-baseline-l { align-self: baseline; }
226
+ .self-stretch-l { align-self: stretch; }
227
+
228
+ .justify-start-l { justify-content: flex-start; }
229
+ .justify-end-l { justify-content: flex-end; }
230
+ .justify-center-l { justify-content: center; }
231
+ .justify-between-l { justify-content: space-between; }
232
+ .justify-around-l { justify-content: space-around; }
233
+
234
+ .content-start-l { align-content: flex-start; }
235
+ .content-end-l { align-content: flex-end; }
236
+ .content-center-l { align-content: center; }
237
+ .content-between-l { align-content: space-between; }
238
+ .content-around-l { align-content: space-around; }
239
+ .content-stretch-l { align-content: stretch; }
240
+
241
+ .order-0-l { order: 0; }
242
+ .order-1-l { order: 1; }
243
+ .order-2-l { order: 2; }
244
+ .order-3-l { order: 3; }
245
+ .order-4-l { order: 4; }
246
+ .order-5-l { order: 5; }
247
+ .order-6-l { order: 6; }
248
+ .order-7-l { order: 7; }
249
+ .order-8-l { order: 8; }
250
+ .order-last-l { order: 99999; }
251
+
252
+ .flex-grow-0-l { flex-grow: 0; }
253
+ .flex-grow-1-l { flex-grow: 1; }
254
+
255
+ .flex-shrink-0-l { flex-shrink: 0; }
256
+ .flex-shrink-1-l { flex-shrink: 1; }
257
+ }
@@ -0,0 +1,56 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ FLOATS
11
+ http://tachyons.io/docs/layout/floats/
12
+
13
+ 1. Floated elements are automatically rendered as block level elements.
14
+ Setting floats to display inline will fix the double margin bug in
15
+ ie6. You know... just in case.
16
+
17
+ 2. Don't forget to clearfix your floats with .cf
18
+
19
+ Base:
20
+ f = float
21
+
22
+ Modifiers:
23
+ l = left
24
+ r = right
25
+ n = none
26
+
27
+ Media Query Extensions:
28
+ -ns = not-small
29
+ -m = medium
30
+ -l = large
31
+
32
+ */
33
+
34
+
35
+
36
+ .fl { float: left; _display: inline; }
37
+ .fr { float: right; _display: inline; }
38
+ .fn { float: none; }
39
+
40
+ @media #{$breakpoint-not-small} {
41
+ .fl-ns { float: left; _display: inline; }
42
+ .fr-ns { float: right; _display: inline; }
43
+ .fn-ns { float: none; }
44
+ }
45
+
46
+ @media #{$breakpoint-medium} {
47
+ .fl-m { float: left; _display: inline; }
48
+ .fr-m { float: right; _display: inline; }
49
+ .fn-m { float: none; }
50
+ }
51
+
52
+ @media #{$breakpoint-large} {
53
+ .fl-l { float: left; _display: inline; }
54
+ .fr-l { float: right; _display: inline; }
55
+ .fn-l { float: none; }
56
+ }
@@ -0,0 +1,99 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ FONT FAMILY GROUPS
11
+ Docs: http://tachyons.io/docs/typography/font-family/
12
+
13
+ */
14
+
15
+
16
+ .sans-serif {
17
+ font-family: $sans-serif;
18
+ }
19
+
20
+ .serif {
21
+ font-family: $serif;
22
+ }
23
+
24
+ .system-sans-serif {
25
+ font-family: sans-serif;
26
+ }
27
+
28
+ .system-serif {
29
+ font-family: serif;
30
+ }
31
+
32
+
33
+ /* Monospaced Typefaces (for code) */
34
+
35
+ /* From http://cssfontstack.com */
36
+ code, .code {
37
+ font-family: Consolas,
38
+ monaco,
39
+ monospace;
40
+ }
41
+
42
+ .courier {
43
+ font-family: 'Courier Next',
44
+ courier,
45
+ monospace;
46
+ }
47
+
48
+
49
+ /* Sans-Serif Typefaces */
50
+
51
+ .helvetica {
52
+ font-family: 'helvetica neue', helvetica,
53
+ sans-serif;
54
+ }
55
+
56
+ .avenir {
57
+ font-family: 'avenir next', avenir,
58
+ sans-serif;
59
+ }
60
+
61
+
62
+ /* Serif Typefaces */
63
+
64
+ .athelas {
65
+ font-family: athelas,
66
+ georgia,
67
+ serif;
68
+ }
69
+
70
+ .georgia {
71
+ font-family: georgia,
72
+ serif;
73
+ }
74
+
75
+ .times {
76
+ font-family: times,
77
+ serif;
78
+ }
79
+
80
+ .bodoni {
81
+ font-family: "Bodoni MT",
82
+ serif;
83
+ }
84
+
85
+ .calisto {
86
+ font-family: "Calisto MT",
87
+ serif;
88
+ }
89
+
90
+ .garamond {
91
+ font-family: garamond,
92
+ serif;
93
+ }
94
+
95
+ .baskerville {
96
+ font-family: baskerville,
97
+ serif;
98
+ }
99
+
@@ -0,0 +1,36 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ FONT STYLE
11
+ Docs: http://tachyons.io/docs/typography/font-style/
12
+
13
+ Media Query Extensions:
14
+ -ns = not-small
15
+ -m = medium
16
+ -l = large
17
+
18
+ */
19
+
20
+ .i { font-style: italic; }
21
+ .fs-normal { font-style: normal; }
22
+
23
+ @media #{$breakpoint-not-small} {
24
+ .i-ns { font-style: italic; }
25
+ .fs-normal-ns { font-style: normal; }
26
+ }
27
+
28
+ @media #{$breakpoint-medium} {
29
+ .i-m { font-style: italic; }
30
+ .fs-normal-m { font-style: normal; }
31
+ }
32
+
33
+ @media #{$breakpoint-large} {
34
+ .i-l { font-style: italic; }
35
+ .fs-normal-l { font-style: normal; }
36
+ }