tachyonscss-rails 4.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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
+ }