griddyup 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: adfb7b03ab36506621ea7ae5b338d9a5e9099e1c
4
+ data.tar.gz: 0e82e342dde2f9afb3d0a189e110695bad29598d
5
+ SHA512:
6
+ metadata.gz: 4a69491efe3bc5abc4d331840c6dcb00ccf0d730cf21128eae3396f6fb321f8572c2639a82a4a25848ee884c9eeac9f78b0e8d6a8cf31fa6d2f60541931907a5
7
+ data.tar.gz: 6918240bddf8aed0cedc87d83dea70d951086e82c097aa20a082bace174df5d59df5e7081d1ce1f6b2603f0efa7c411040909d335474c3ac50e2a1c828a838a2
data/MIT-LICENSE ADDED
@@ -0,0 +1,20 @@
1
+ Copyright 2017 hawry
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining
4
+ a copy of this software and associated documentation files (the
5
+ "Software"), to deal in the Software without restriction, including
6
+ without limitation the rights to use, copy, modify, merge, publish,
7
+ distribute, sublicense, and/or sell copies of the Software, and to
8
+ permit persons to whom the Software is furnished to do so, subject to
9
+ the following conditions:
10
+
11
+ The above copyright notice and this permission notice shall be
12
+ included in all copies or substantial portions of the Software.
13
+
14
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
15
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
16
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
17
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
18
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
19
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
20
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,35 @@
1
+ # Griddyup
2
+ Short description and motivation.
3
+
4
+ ## Usage
5
+ How to use my plugin.
6
+
7
+ ## Installation
8
+ Add this line to your application's Gemfile:
9
+
10
+ ```ruby
11
+ gem 'griddyup'
12
+ ```
13
+
14
+ And then execute:
15
+ ```bash
16
+ $ bundle
17
+ ```
18
+
19
+ Or install it yourself as:
20
+ ```bash
21
+ $ gem install griddyup
22
+ ```
23
+
24
+ Add this line to your application.css:
25
+ ```
26
+ *= require griddyup //Add this line
27
+ *= require_tree .
28
+ *= require_self
29
+ ```
30
+
31
+ ## Contributing
32
+ Contribution directions go here.
33
+
34
+ ## License
35
+ The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
data/Rakefile ADDED
@@ -0,0 +1,33 @@
1
+ begin
2
+ require 'bundler/setup'
3
+ rescue LoadError
4
+ puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
5
+ end
6
+
7
+ require 'rdoc/task'
8
+
9
+ RDoc::Task.new(:rdoc) do |rdoc|
10
+ rdoc.rdoc_dir = 'rdoc'
11
+ rdoc.title = 'Griddyup'
12
+ rdoc.options << '--line-numbers'
13
+ rdoc.rdoc_files.include('README.md')
14
+ rdoc.rdoc_files.include('lib/**/*.rb')
15
+ end
16
+
17
+
18
+
19
+
20
+
21
+
22
+ require 'bundler/gem_tasks'
23
+
24
+ require 'rake/testtask'
25
+
26
+ Rake::TestTask.new(:test) do |t|
27
+ t.libs << 'test'
28
+ t.pattern = 'test/**/*_test.rb'
29
+ t.verbose = false
30
+ end
31
+
32
+
33
+ task default: :test
@@ -0,0 +1 @@
1
+ var GriddyUp = {};
@@ -0,0 +1,314 @@
1
+ // Place all the styles related to the grid controller here.
2
+ // They will automatically be included in application.css.
3
+ // You can use Sass (SCSS) here: http://sass-lang.com/
4
+
5
+ @import "normalize/normalize";
6
+
7
+ $DEBUG_MODE: "false"; //enables the use of "random-color-x"
8
+
9
+
10
+ @function to-rem($px,$b: $font-base-size) {
11
+ @return #{$px/$b}rem;
12
+ }
13
+ @function to-em($px,$b: $font-base-size) {
14
+ @return #{$px/$b}em;
15
+ }
16
+
17
+
18
+ $max-columns: 8;
19
+
20
+ $primary-color: #1976D2;
21
+ $primary-color-light: #63a4ff;
22
+ $primary-color-dark: #004ba0;
23
+
24
+ $secondary-color: #37474F;
25
+ $secondary-color-light: #62727b;
26
+ $secondary-color-dark: #102027;
27
+
28
+ $primary-color-text: #fff;
29
+ $primary-color-light-text: #000;
30
+ $primary-color-dark-text: #fff;
31
+
32
+ $secondary-color-text: #fff;
33
+ $secondary-color-light-text:#fff;
34
+ $secondary-color-dark-text:#fff;
35
+
36
+ .color-primary {
37
+ background-color: $primary-color;
38
+ color: $primary-color-text;
39
+ &.light {
40
+ background-color: $primary-color-light;
41
+ color: $primary-color-light-text;
42
+ }
43
+ &.dark {
44
+ background-color: $primary-color-dark;
45
+ color: $primary-color-dark-text;
46
+ }
47
+ }
48
+
49
+ .color-secondary {
50
+ background-color: $secondary-color;
51
+ color: $secondary-color-text;
52
+ &.light {
53
+ background-color: $secondary-color-light;
54
+ color: $secondary-color-light-text;
55
+ }
56
+ &.dark {
57
+ background-color: $secondary-color-dark;
58
+ color: $secondary-color-dark-text;
59
+ }
60
+ }
61
+
62
+ $font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
63
+ $font-family-serif: Georgia, "Times New Roman", Times, serif;
64
+ $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
65
+ $font-family-base: $font-family-sans-serif;
66
+
67
+ $font-size-base: 14px;
68
+ $font-size-large: ceil(($font-size-base * 1.25)); // ~18px
69
+ $font-size-small: ceil(($font-size-base * 0.85)); // ~12px
70
+
71
+ $font-size-h1: floor(($font-size-base * 2.6)); // ~36px
72
+ $font-size-h2: floor(($font-size-base * 2.15)); // ~30px
73
+ $font-size-h3: ceil(($font-size-base * 1.7)); // ~24px
74
+ $font-size-h4: ceil(($font-size-base * 1.25)); // ~18px
75
+ $font-size-h5: $font-size-base;
76
+ $font-size-h6: ceil(($font-size-base * 0.85)); // ~12px
77
+
78
+ $font-size-h-list: $font-size-h1 $font-size-h2 $font-size-h3 $font-size-h4 $font-size-h5 $font-size-h6;
79
+
80
+ $line-height-base: 1.428571429; // 20/14
81
+ $line-height-computed: floor(($font-size-base * $line-height-base)); // ~20px
82
+
83
+ $headings-font-family: inherit;
84
+ $headings-font-weight: 500;
85
+ $headings-line-height: 1.1;
86
+ $headings-color: inherit;
87
+
88
+ //Breakpoints
89
+ $bp-small: (0,40em);
90
+ $bp-medium: (40.00001em,64em);
91
+ $bp-large: (64.00001em,90em);
92
+ $bp-xlarge: (90.00001, 500000em);
93
+
94
+ $row-width-small: 64em;
95
+ $row-width-medium: $row-width-small;
96
+ $row-width-large: $row-width-medium;
97
+ $row-width-xlarge: 80em;
98
+
99
+ //Specific breakpoints
100
+ $bp-small-up: "only screen";
101
+ $bp-small-only: "only screen and (max-width: #{nth($bp-small,2)})";
102
+ $bp-small-down: "only screen and (max-width:#{nth($bp-small,2)})";
103
+
104
+ $bp-medium-up: "only screen and (min-width: #{nth($bp-medium,1)})";
105
+ $bp-medium-only: "only screen and (min-width: #{nth($bp-medium,1)}) and (max-width:#{nth($bp-medium,2)})";
106
+ $bp-medium-down: "only screen and (max-width:#{nth($bp-medium,2)})";
107
+
108
+ $bp-large-up: "only screen and (min-width: #{nth($bp-large,1)})";
109
+ $bp-large-only: "only screen and (min-width: #{nth($bp-large,1)}) and (max-width:#{nth($bp-large,2)})";
110
+ $bp-large-down: "only screen and (max-width:#{nth($bp-large,2)})";
111
+
112
+ $bp-xlarge-up: "only screen and (min-width: #{nth($bp-xlarge,1)})";
113
+ $bp-xlarge-only: "only screen and (min-width: #{nth($bp-xlarge,1)}) and (max-width:#{nth($bp-xlarge,2)})";
114
+ $bp-xlarge-down: "only screen";
115
+
116
+ * {
117
+ box-sizing: border-box;
118
+ }
119
+
120
+ html,body {
121
+ height:100%;
122
+ }
123
+
124
+ body {
125
+ font-size: $font-size-base;
126
+ }
127
+
128
+ .font-large {
129
+ font-size: $font-size-large;
130
+ }
131
+ .font-small {
132
+ font-size: $font-size-small;
133
+ }
134
+
135
+ @for $i from 1 through 6 {
136
+ h#{$i} {
137
+ font-family: $headings-font-family;
138
+ font-weight: $headings-font-weight;
139
+ line-height: $headings-line-height;
140
+ color:$headings-color;
141
+ font-size: nth($font-size-h-list,$i);
142
+ }
143
+ }
144
+
145
+ .site-container {
146
+ height:100%;
147
+ display:grid;
148
+ grid-template-areas:
149
+ "h"
150
+ "m"
151
+ "f";
152
+ grid-template-rows: 1fr 12fr 1fr;
153
+ }
154
+
155
+ .site-container-aside {
156
+ height:100%;
157
+ display:grid;
158
+ grid-template-areas:
159
+ "h h"
160
+ "m a"
161
+ "f f";
162
+ grid-template-rows: 1fr 10fr 1fr;
163
+ grid-template-columns: 8fr 4fr;
164
+ &-reverse {
165
+ @extend .site-container-aside;
166
+ grid-template-areas:
167
+ "h h"
168
+ "a m"
169
+ "f f";
170
+ grid-template-columns: 4fr 8fr;
171
+ }
172
+ }
173
+ random-color-3
174
+ nav {
175
+ display:grid;
176
+ grid-template-columns: repeat($max-columns,1fr);
177
+ grid-auto-flow:column;
178
+ grid-area: h;
179
+ }
180
+
181
+ footer {
182
+ display: grid;
183
+ grid-area: f;
184
+ &.fixed {
185
+ grid-template-columns: 1fr 80em 1fr;
186
+ grid-auto-flow: row;
187
+ & .row {
188
+ grid-column-start: 2;
189
+ max-width: 80em;
190
+ }
191
+ }
192
+ }
193
+
194
+ main {
195
+ grid-area: m;
196
+ display:inline-grid;
197
+ align-content: flex-start;
198
+ grid-template-rows: fit-content(0px);
199
+ grid-row-gap: 0.4rem;
200
+ &.fixed {
201
+ grid-template-columns: 1fr 80em 1fr;
202
+ grid-auto-flow: row;
203
+ & .row {
204
+ grid-column-start: 2;
205
+ max-width: 80em;
206
+ }
207
+ }
208
+ }
209
+
210
+ aside {
211
+ grid-area: a;
212
+ }
213
+
214
+ .row {
215
+ display:grid;
216
+ grid-template-columns: repeat($max-columns,1fr);
217
+ grid-gap: 0.4rem;
218
+ }
219
+
220
+ @for $i from 1 through $max-columns {
221
+ .random-color-#{$i} {
222
+ $alpha: random(100)/100;
223
+ $red: random(256)-1;
224
+ $green: random(256)-1;
225
+ $blue: random(256)-1;
226
+ $color: unquote("rgb(#{$red}, #{$green}, #{$blue})");
227
+ @if $DEBUG_MODE == 'true' {
228
+ background-color:$color;
229
+ }
230
+ }
231
+ }
232
+
233
+ @mixin columns($size) {
234
+ @for $i from 1 through $max-columns {
235
+ .#{$size}-col-#{$i} {
236
+ grid-column: span $i;
237
+ }
238
+ }
239
+ }
240
+
241
+ @mixin hide($size) {
242
+ @for $i from 1 through $max-columns {
243
+ .#{$size}-hide {
244
+ display:none;
245
+ }
246
+ }
247
+ }
248
+
249
+ @mixin show($size) {
250
+ @for $i from 1 through $max-columns {
251
+ $show-small: none;
252
+ $show-medium: none;
253
+ $show-large: none;
254
+ $show-xlarge: none;
255
+
256
+ @if $size=="s" {
257
+ $show-small: inherit;
258
+ }
259
+ @if $size=="m" {
260
+ $show-medium: inherit;
261
+ }
262
+ @if $size=="l" {
263
+ $show-large: inherit;
264
+ }
265
+ @if $size=="l" {
266
+ $show-xlarge: inherit;
267
+ }
268
+ .s-only {
269
+ display:$show-small;
270
+ }
271
+ .m-only {
272
+ display:$show-medium;
273
+ }
274
+ .l-only {
275
+ display:$show-large;
276
+ }
277
+ .xl-only {
278
+ display:$show-xlarge;
279
+ }
280
+ }
281
+ }
282
+
283
+ @for $i from 1 through $max-columns {
284
+ .col-#{$i} {
285
+ grid-column: span $i;
286
+ }
287
+ }
288
+
289
+ @media #{$bp-small-only} {
290
+ @include hide("s");
291
+ }
292
+
293
+ @media #{$bp-medium-only} {
294
+ @include hide("m");
295
+ }
296
+
297
+ @media #{$bp-large-up} { //change to bp-large-only if xlarge should be used
298
+ @include hide("l");
299
+ }
300
+
301
+ @media #{$bp-small-up} {
302
+ @include columns("s");
303
+ @include show("s");
304
+ }
305
+
306
+ @media #{$bp-medium-up} {
307
+ @include columns("m");
308
+ @include show("m");
309
+ }
310
+
311
+ @media #{$bp-large-up} {
312
+ @include columns("l");
313
+ @include show("l");
314
+ }
@@ -0,0 +1,647 @@
1
+ /*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
2
+
3
+ @import 'variables';
4
+ @import 'vertical-rhythm';
5
+
6
+ // If we've customized any font variables, we'll need extra properties.
7
+ @if $base-line-height != 24px
8
+ or $base-unit != 'em'
9
+ or $h2-font-size != 1.5 * $base-font-size
10
+ or $h3-font-size != 1.17 * $base-font-size
11
+ or $h4-font-size != 1 * $base-font-size
12
+ or $h5-font-size != 0.83 * $base-font-size
13
+ or $h6-font-size != 0.67 * $base-font-size
14
+ or $indent-amount != 40px {
15
+ $normalize-vertical-rhythm: true !global;
16
+ }
17
+
18
+ /* Document
19
+ ========================================================================== */
20
+
21
+ /**
22
+ * 1. Correct the line height in all browsers.
23
+ * 2. Prevent adjustments of font size after orientation changes in
24
+ * IE on Windows Phone and in iOS.
25
+ */
26
+
27
+ html {
28
+ @if $base-font-family {
29
+ /* Change the default font family in all browsers (opinionated). */
30
+ font-family: $base-font-family;
31
+ }
32
+ @if $base-font-size != 16px or $normalize-vertical-rhythm {
33
+ // Correct old browser bug that prevented accessible resizing of text
34
+ // when root font-size is set with px or em.
35
+ font-size: ($base-font-size / 16px) * 100%;
36
+ }
37
+ @if $normalize-vertical-rhythm {
38
+ // Establish a vertical rhythm unit using $base-font-size and
39
+ // $base-line-height variables.
40
+ line-height: ($base-line-height / $base-font-size) * 1em; /* 1 */
41
+ }
42
+ @else {
43
+ line-height: 1.15; /* 1 */
44
+ }
45
+ -ms-text-size-adjust: 100%; /* 2 */
46
+ -webkit-text-size-adjust: 100%; /* 2 */
47
+ }
48
+
49
+ /* Sections
50
+ ========================================================================== */
51
+
52
+ /**
53
+ * Remove the margin in all browsers (opinionated).
54
+ */
55
+
56
+ body {
57
+ margin: 0;
58
+ }
59
+
60
+ /**
61
+ * Add the correct display in IE 9-.
62
+ */
63
+
64
+ article,
65
+ aside,
66
+ footer,
67
+ header,
68
+ nav,
69
+ section {
70
+ display: block;
71
+ }
72
+
73
+ /**
74
+ * Correct the font size and margin on `h1` elements within `section` and
75
+ * `article` contexts in Chrome, Firefox, and Safari.
76
+ */
77
+
78
+ h1 {
79
+ @include normalize-font-size($h1-font-size);
80
+ @if $normalize-vertical-rhythm {
81
+ @include normalize-line-height($h1-font-size);
82
+ }
83
+
84
+ @if $normalize-vertical-rhythm {
85
+ /* Set 1 unit of vertical rhythm on the top and bottom margins. */
86
+ @include normalize-margin(1 0, $h1-font-size);
87
+ }
88
+ @else {
89
+ margin: 0.67em 0;
90
+ }
91
+ }
92
+
93
+ @if $normalize-vertical-rhythm {
94
+ h2 {
95
+ @include normalize-font-size($h2-font-size);
96
+ @include normalize-line-height($h2-font-size);
97
+ @include normalize-margin(1 0, $h2-font-size);
98
+ }
99
+
100
+ h3 {
101
+ @include normalize-font-size($h3-font-size);
102
+ @include normalize-line-height($h3-font-size);
103
+ @include normalize-margin(1 0, $h3-font-size);
104
+ }
105
+
106
+ h4 {
107
+ @include normalize-font-size($h4-font-size);
108
+ @include normalize-line-height($h4-font-size);
109
+ @include normalize-margin(1 0, $h4-font-size);
110
+ }
111
+
112
+ h5 {
113
+ @include normalize-font-size($h5-font-size);
114
+ @include normalize-line-height($h5-font-size);
115
+ @include normalize-margin(1 0, $h5-font-size);
116
+ }
117
+
118
+ h6 {
119
+ @include normalize-font-size($h6-font-size);
120
+ @include normalize-line-height($h6-font-size);
121
+ @include normalize-margin(1 0, $h6-font-size);
122
+ }
123
+ }
124
+
125
+ /* Grouping content
126
+ ========================================================================== */
127
+
128
+ @if $normalize-vertical-rhythm {
129
+ /**
130
+ * Set 1 unit of vertical rhythm on the top and bottom margin.
131
+ */
132
+
133
+ blockquote {
134
+ @include normalize-margin(1 $indent-amount);
135
+ }
136
+
137
+ dl,
138
+ ol,
139
+ ul {
140
+ @include normalize-margin(1 0);
141
+ }
142
+
143
+ /**
144
+ * Turn off margins on nested lists.
145
+ */
146
+
147
+ ol,
148
+ ul {
149
+ ol,
150
+ ul {
151
+ margin: 0;
152
+ }
153
+ }
154
+
155
+ dd {
156
+ margin: 0 0 0 $indent-amount;
157
+ }
158
+
159
+ ol,
160
+ ul {
161
+ padding: 0 0 0 $indent-amount;
162
+ }
163
+ }
164
+
165
+ /**
166
+ * Add the correct display in IE 9-.
167
+ */
168
+
169
+ figcaption,
170
+ figure {
171
+ display: block;
172
+ }
173
+
174
+ /**
175
+ * Add the correct margin in IE 8.
176
+ */
177
+
178
+ figure {
179
+ @if $normalize-vertical-rhythm {
180
+ @include normalize-margin(1 $indent-amount);
181
+ }
182
+ @else {
183
+ margin: 1em $indent-amount;
184
+ }
185
+ }
186
+
187
+ /**
188
+ * 1. Add the correct box sizing in Firefox.
189
+ * 2. Show the overflow in Edge and IE.
190
+ */
191
+
192
+ hr {
193
+ box-sizing: content-box; /* 1 */
194
+ height: 0; /* 1 */
195
+ overflow: visible; /* 2 */
196
+ }
197
+
198
+ /**
199
+ * Add the correct display in IE.
200
+ */
201
+
202
+ main {
203
+ display: block;
204
+ }
205
+
206
+ @if $normalize-vertical-rhythm {
207
+ /**
208
+ * Set 1 unit of vertical rhythm on the top and bottom margin.
209
+ */
210
+
211
+ p,
212
+ pre {
213
+ @include normalize-margin(1 0);
214
+ }
215
+ }
216
+
217
+ /**
218
+ * 1. Correct the inheritance and scaling of font size in all browsers.
219
+ * 2. Correct the odd `em` font sizing in all browsers.
220
+ */
221
+
222
+ %monospace {
223
+ font-family: monospace, monospace; /* 1 */
224
+ font-size: 1em; /* 2 */
225
+ }
226
+
227
+ pre {
228
+ @extend %monospace;
229
+ }
230
+
231
+ /* Links
232
+ ========================================================================== */
233
+
234
+ /**
235
+ * 1. Remove the gray background on active links in IE 10.
236
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
237
+ */
238
+
239
+ a {
240
+ background-color: transparent; /* 1 */
241
+ -webkit-text-decoration-skip: objects; /* 2 */
242
+ }
243
+
244
+ /* Text-level semantics
245
+ ========================================================================== */
246
+
247
+ /**
248
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
249
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
250
+ */
251
+
252
+ abbr[title] {
253
+ border-bottom: none; /* 1 */
254
+ text-decoration: underline; /* 2 */
255
+ text-decoration: underline dotted; /* 2 */
256
+ }
257
+
258
+ /**
259
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
260
+ */
261
+
262
+ b,
263
+ strong {
264
+ font-weight: inherit;
265
+ }
266
+
267
+ /**
268
+ * Add the correct font weight in Chrome, Edge, and Safari.
269
+ */
270
+
271
+ b,
272
+ strong {
273
+ font-weight: bolder;
274
+ }
275
+
276
+ code,
277
+ kbd,
278
+ samp {
279
+ @extend %monospace;
280
+ }
281
+
282
+ /**
283
+ * Add the correct font style in Android 4.3-.
284
+ */
285
+
286
+ dfn {
287
+ font-style: italic;
288
+ }
289
+
290
+ /**
291
+ * Add the correct background and color in IE 9-.
292
+ */
293
+
294
+ mark {
295
+ background-color: #ff0;
296
+ color: #000;
297
+ }
298
+
299
+ /**
300
+ * Add the correct font size in all browsers.
301
+ */
302
+
303
+ small {
304
+ font-size: 80%;
305
+ }
306
+
307
+ /**
308
+ * Prevent `sub` and `sup` elements from affecting the line height in
309
+ * all browsers.
310
+ */
311
+
312
+ sub,
313
+ sup {
314
+ font-size: 75%;
315
+ line-height: 0;
316
+ position: relative;
317
+ vertical-align: baseline;
318
+ }
319
+
320
+ sub {
321
+ bottom: -0.25em;
322
+ }
323
+
324
+ sup {
325
+ top: -0.5em;
326
+ }
327
+
328
+ /* Embedded content
329
+ ========================================================================== */
330
+
331
+ /**
332
+ * Add the correct display in IE 9-.
333
+ */
334
+
335
+ audio,
336
+ video {
337
+ display: inline-block;
338
+ }
339
+
340
+ /**
341
+ * Add the correct display in iOS 4-7.
342
+ */
343
+
344
+ audio:not([controls]) {
345
+ display: none;
346
+ height: 0;
347
+ }
348
+
349
+ /**
350
+ * Remove the border on images inside links in IE 10-.
351
+ */
352
+
353
+ img {
354
+ border-style: none;
355
+ }
356
+
357
+ /**
358
+ * Hide the overflow in IE.
359
+ */
360
+
361
+ svg:not(:root) {
362
+ overflow: hidden;
363
+ }
364
+
365
+ /* Forms
366
+ ========================================================================== */
367
+
368
+ /**
369
+ * Known issues:
370
+ * - `select`:
371
+ * By default, Chrome on OS X and Safari on OS X allow very limited styling of
372
+ * select, unless a border property is set. The default font weight on
373
+ * optgroup elements cannot safely be changed in Chrome on OSX and Safari on
374
+ * OS X.
375
+ * - `[type="checkbox"]`:
376
+ * It is recommended that you do not style checkbox and radio inputs as
377
+ * Firefox's implementation does not respect box-sizing, padding, or width.
378
+ * - `[type="number"]`:
379
+ * Certain font size values applied to number inputs cause the cursor style of
380
+ * the decrement button to change from `default` to `text`.
381
+ * - `[type="search"]`:
382
+ * The search input is not fully stylable by default. In Chrome and Safari on
383
+ * OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
384
+ * Chrome and Safari on Windows you can't control `border` properly. It will
385
+ * apply `border-width` but will only show a border color (which cannot be
386
+ * controlled) for the outer 1px of that border. Applying
387
+ * `-webkit-appearance: textfield` addresses these issues without removing the
388
+ * benefits of search inputs (e.g. showing past searches). Safari (but not
389
+ * Chrome) will clip the cancel button on when it has padding (and `textfield`
390
+ * appearance).
391
+ * - `::placeholder`:
392
+ * In Edge, placeholders will disappear on `relative` or `absolute` positioned
393
+ * `<input>` elements if you use `opacity` less than `1` due to a
394
+ * [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
395
+ */
396
+
397
+ /**
398
+ * 1. Change the font styles in all browsers (opinionated).
399
+ * 2. Remove the margin in Firefox and Safari.
400
+ */
401
+
402
+ button,
403
+ input,
404
+ optgroup,
405
+ select,
406
+ textarea {
407
+ @if $normalize-vertical-rhythm {
408
+ @include normalize-line-height($base-font-size); /* 1 */
409
+ }
410
+ @else {
411
+ line-height: 1.15; /* 1 */
412
+ }
413
+ font-family: if($base-font-family, $base-font-family, sans-serif); /* 1 */
414
+ font-size: 100%; /* 1 */
415
+ margin: 0; /* 2 */
416
+ }
417
+
418
+ /**
419
+ * Show the overflow in IE.
420
+ */
421
+
422
+ button {
423
+ overflow: visible;
424
+ }
425
+
426
+ /**
427
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
428
+ * 1. Remove the inheritance of text transform in Firefox.
429
+ */
430
+
431
+ button,
432
+ select { /* 1 */
433
+ text-transform: none;
434
+ }
435
+
436
+ /**
437
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
438
+ * controls in Android 4.
439
+ * 2. Correct the inability to style clickable types in iOS and Safari.
440
+ */
441
+
442
+ button,
443
+ html [type="button"], /* 1 */
444
+ [type="reset"],
445
+ [type="submit"] {
446
+ -webkit-appearance: button; /* 2 */
447
+ }
448
+
449
+ button,
450
+ [type="button"],
451
+ [type="reset"],
452
+ [type="submit"] {
453
+
454
+ /**
455
+ * Remove the inner border and padding in Firefox.
456
+ */
457
+
458
+ &::-moz-focus-inner {
459
+ border-style: none;
460
+ padding: 0;
461
+ }
462
+
463
+ /**
464
+ * Restore the focus styles unset by the previous rule.
465
+ */
466
+
467
+ &:-moz-focusring {
468
+ outline: 1px dotted ButtonText;
469
+ }
470
+ }
471
+
472
+ /**
473
+ * Show the overflow in Edge.
474
+ */
475
+
476
+ input {
477
+ overflow: visible;
478
+ }
479
+
480
+ /**
481
+ * 1. Add the correct box sizing in IE 10-.
482
+ * 2. Remove the padding in IE 10-.
483
+ */
484
+
485
+ [type="checkbox"],
486
+ [type="radio"] {
487
+ box-sizing: border-box; /* 1 */
488
+ padding: 0; /* 2 */
489
+ }
490
+
491
+ /**
492
+ * Correct the cursor style of increment and decrement buttons in Chrome.
493
+ */
494
+
495
+ [type="number"]::-webkit-inner-spin-button,
496
+ [type="number"]::-webkit-outer-spin-button {
497
+ height: auto;
498
+ }
499
+
500
+ /**
501
+ * 1. Correct the odd appearance in Chrome and Safari.
502
+ * 2. Correct the outline style in Safari.
503
+ */
504
+
505
+ [type="search"] {
506
+ -webkit-appearance: textfield; /* 1 */
507
+ outline-offset: -2px; /* 2 */
508
+
509
+ /**
510
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
511
+ */
512
+
513
+ &::-webkit-search-cancel-button,
514
+ &::-webkit-search-decoration {
515
+ -webkit-appearance: none;
516
+ }
517
+ }
518
+
519
+ /**
520
+ * 1. Correct the inability to style clickable types in iOS and Safari.
521
+ * 2. Change font properties to `inherit` in Safari.
522
+ */
523
+
524
+ ::-webkit-file-upload-button {
525
+ -webkit-appearance: button; /* 1 */
526
+ font: inherit; /* 2 */
527
+ }
528
+
529
+ /**
530
+ * Correct the padding in Firefox.
531
+ */
532
+
533
+ fieldset {
534
+ padding: 0.35em 0.75em 0.625em;
535
+ }
536
+
537
+ /**
538
+ * 1. Correct the text wrapping in Edge and IE.
539
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
540
+ * 3. Remove the padding so developers are not caught out when they zero out
541
+ * `fieldset` elements in all browsers.
542
+ */
543
+
544
+ legend {
545
+ box-sizing: border-box; /* 1 */
546
+ display: table; /* 1 */
547
+ max-width: 100%; /* 1 */
548
+ padding: 0; /* 3 */
549
+ color: inherit; /* 2 */
550
+ white-space: normal; /* 1 */
551
+ }
552
+
553
+ /**
554
+ * 1. Add the correct display in IE 9-.
555
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
556
+ */
557
+
558
+ progress {
559
+ display: inline-block; /* 1 */
560
+ vertical-align: baseline; /* 2 */
561
+ }
562
+
563
+ /**
564
+ * Remove the default vertical scrollbar in IE.
565
+ */
566
+
567
+ textarea {
568
+ overflow: auto;
569
+ }
570
+
571
+ /* Interactive
572
+ ========================================================================== */
573
+
574
+ /*
575
+ * Add the correct display in Edge, IE, and Firefox.
576
+ */
577
+
578
+ details {
579
+ display: block;
580
+ }
581
+
582
+ /*
583
+ * Add the correct display in all browsers.
584
+ */
585
+
586
+ summary {
587
+ display: list-item;
588
+ }
589
+
590
+
591
+ /*
592
+ * Add the correct display in IE 9-.
593
+ */
594
+
595
+ menu {
596
+ display: block;
597
+
598
+ @if $normalize-vertical-rhythm {
599
+ /*
600
+ * 1. Set 1 unit of vertical rhythm on the top and bottom margin.
601
+ * 2. Set consistent space for the list style image.
602
+ */
603
+
604
+ @include normalize-margin(1 0); /* 1 */
605
+ padding: 0 0 0 $indent-amount; /* 2 */
606
+
607
+ /**
608
+ * Turn off margins on nested lists.
609
+ */
610
+
611
+ menu &,
612
+ ol &,
613
+ ul & {
614
+ margin: 0;
615
+ }
616
+ }
617
+ }
618
+
619
+ /* Scripting
620
+ ========================================================================== */
621
+
622
+ /**
623
+ * Add the correct display in IE 9-.
624
+ */
625
+
626
+ canvas {
627
+ display: inline-block;
628
+ }
629
+
630
+ /**
631
+ * Add the correct display in IE.
632
+ */
633
+
634
+ template {
635
+ display: none;
636
+ }
637
+
638
+ /* Hidden
639
+ ========================================================================== */
640
+
641
+ /**
642
+ * Add the correct display in IE 10-.
643
+ */
644
+
645
+ [hidden] {
646
+ display: none;
647
+ }
@@ -0,0 +1,36 @@
1
+ //
2
+ // Variables
3
+ //
4
+ // If you have an initialization partial (or equivalent), you should move these
5
+ // lines to that file. NOTE: Edit the lines to remove "!default".
6
+
7
+ // The font size set on the root html element.
8
+ $base-font-size: 16px !default;
9
+
10
+ // The base line height determines the basic unit of vertical rhythm.
11
+ $base-line-height: 24px !default;
12
+
13
+ // The length unit in which to output vertical rhythm values.
14
+ // Supported values: px, em, rem.
15
+ $base-unit: 'em' !default;
16
+
17
+ // The default font family.
18
+ $base-font-family: null !default;
19
+
20
+ // The font sizes for h1-h6.
21
+ $h1-font-size: 2 * $base-font-size !default;
22
+ $h2-font-size: 1.5 * $base-font-size !default;
23
+ $h3-font-size: 1.17 * $base-font-size !default;
24
+ $h4-font-size: 1 * $base-font-size !default;
25
+ $h5-font-size: 0.83 * $base-font-size !default;
26
+ $h6-font-size: 0.67 * $base-font-size !default;
27
+
28
+ // The amount lists and blockquotes are indented.
29
+ $indent-amount: 40px !default;
30
+
31
+ // The following variable controls whether normalize-scss will output
32
+ // font-sizes, line-heights and block-level top/bottom margins that form a basic
33
+ // vertical rhythm on the page, which differs from the original Normalize.css.
34
+ // However, changing any of the variables above will cause
35
+ // $normalize-vertical-rhythm to be automatically set to true.
36
+ $normalize-vertical-rhythm: false !default;
@@ -0,0 +1,61 @@
1
+ //
2
+ // Vertical Rhythm
3
+ //
4
+ // This is the minimal amount of code needed to create vertical rhythm in our
5
+ // CSS. If you are looking for a robust solution, look at the excellent Typey
6
+ // library. @see https://github.com/jptaranto/typey
7
+
8
+ @function normalize-rhythm($value, $relative-to: $base-font-size, $unit: $base-unit) {
9
+ @if unit($value) != px {
10
+ @error "The normalize vertical-rhythm module only supports px inputs. The typey library is better.";
11
+ }
12
+ @if $unit == rem {
13
+ @return ($value / $base-font-size) * 1rem;
14
+ }
15
+ @else if $unit == em {
16
+ @return ($value / $relative-to) * 1em;
17
+ }
18
+ @else { // $unit == px
19
+ @return $value;
20
+ }
21
+ }
22
+
23
+ @mixin normalize-font-size($value, $relative-to: $base-font-size) {
24
+ @if unit($value) != 'px' {
25
+ @error "normalize-font-size() only supports px inputs. The typey library is better.";
26
+ }
27
+ font-size: normalize-rhythm($value, $relative-to);
28
+ }
29
+
30
+ @mixin normalize-rhythm($property, $values, $relative-to: $base-font-size) {
31
+ $value-list: $values;
32
+ $sep: space;
33
+ @if type-of($values) == 'list' {
34
+ $sep: list-separator($values);
35
+ }
36
+ @else {
37
+ $value-list: append((), $values);
38
+ }
39
+
40
+ $normalized-values: ();
41
+ @each $value in $value-list {
42
+ @if unitless($value) and $value != 0 {
43
+ $value: $value * normalize-rhythm($base-line-height, $relative-to);
44
+ }
45
+ $normalized-values: append($normalized-values, $value, $sep);
46
+ }
47
+ #{$property}: $normalized-values;
48
+ }
49
+
50
+ @mixin normalize-margin($values, $relative-to: $base-font-size) {
51
+ @include normalize-rhythm(margin, $values, $relative-to);
52
+ }
53
+
54
+ @mixin normalize-line-height($font-size, $min-line-padding: 2px) {
55
+ $lines: ceil($font-size / $base-line-height);
56
+ // If lines are cramped include some extra leading.
57
+ @if ($lines * $base-line-height - $font-size) < ($min-line-padding * 2) {
58
+ $lines: $lines + 1;
59
+ }
60
+ @include normalize-rhythm(line-height, $lines, $font-size);
61
+ }
@@ -0,0 +1,4 @@
1
+ module Griddyup
2
+ class Engine < ::Rails::Engine
3
+ end
4
+ end
@@ -0,0 +1,3 @@
1
+ module Griddyup
2
+ VERSION = '0.0.2'
3
+ end
data/lib/griddyup.rb ADDED
@@ -0,0 +1,6 @@
1
+ require 'griddyup/engine'
2
+
3
+ module Griddyup
4
+ # Your code goes here...
5
+
6
+ end
@@ -0,0 +1,4 @@
1
+ # desc "Explaining what the task does"
2
+ # task :griddyup do
3
+ # # Task goes here
4
+ # end
metadata ADDED
@@ -0,0 +1,98 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: griddyup
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.2
5
+ platform: ruby
6
+ authors:
7
+ - hawry
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2017-08-09 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: rails
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: 5.1.3
20
+ type: :runtime
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: 5.1.3
27
+ - !ruby/object:Gem::Dependency
28
+ name: normalize-scss
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: 7.0.0
34
+ type: :runtime
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: 7.0.0
41
+ - !ruby/object:Gem::Dependency
42
+ name: sass-rails
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: '5.0'
48
+ type: :runtime
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: '5.0'
55
+ description: Griddyup is a CSS-grid tool for (a bit) faster prototyping
56
+ email:
57
+ - hawry@hawry.net
58
+ executables: []
59
+ extensions: []
60
+ extra_rdoc_files: []
61
+ files:
62
+ - MIT-LICENSE
63
+ - README.md
64
+ - Rakefile
65
+ - app/assets/javascripts/griddyup.js
66
+ - app/assets/stylesheets/griddyup.scss
67
+ - app/assets/stylesheets/normalize/_normalize.scss
68
+ - app/assets/stylesheets/normalize/_variables.scss
69
+ - app/assets/stylesheets/normalize/_vertical-rhythm.scss
70
+ - lib/griddyup.rb
71
+ - lib/griddyup/engine.rb
72
+ - lib/griddyup/version.rb
73
+ - lib/tasks/griddyup_tasks.rake
74
+ homepage: https://github.com/hawry/griddyup
75
+ licenses:
76
+ - MIT
77
+ metadata: {}
78
+ post_install_message:
79
+ rdoc_options: []
80
+ require_paths:
81
+ - lib
82
+ required_ruby_version: !ruby/object:Gem::Requirement
83
+ requirements:
84
+ - - ">="
85
+ - !ruby/object:Gem::Version
86
+ version: '0'
87
+ required_rubygems_version: !ruby/object:Gem::Requirement
88
+ requirements:
89
+ - - ">="
90
+ - !ruby/object:Gem::Version
91
+ version: '0'
92
+ requirements: []
93
+ rubyforge_project:
94
+ rubygems_version: 2.6.12
95
+ signing_key:
96
+ specification_version: 4
97
+ summary: Griddyup is a CSS-Grid tool
98
+ test_files: []