atlas_assets 0.4.1 → 0.4.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (29) hide show
  1. data/Gemfile +1 -0
  2. data/Gemfile.lock +7 -2
  3. data/atlas_assets.gemspec +1 -1
  4. data/docs/_layouts/default.html +3 -2
  5. data/docs/_posts/2013-10-28-dropdown.md +50 -0
  6. data/lib/assets/images/chosen-sprite.png +0 -0
  7. data/lib/assets/images/chosen-sprite@2x.png +0 -0
  8. data/lib/assets/javascripts/atlas_assets.js +15 -9
  9. data/lib/assets/javascripts/collections/dropdown_collection.coffee +2 -0
  10. data/lib/assets/javascripts/{backbone.js → libraries/backbone.js} +0 -0
  11. data/lib/assets/javascripts/{bootstrap.js → libraries/bootstrap.js} +0 -0
  12. data/lib/assets/javascripts/libraries/chosen.jquery.js +2 -0
  13. data/lib/assets/javascripts/{jquery.js → libraries/jquery.js} +0 -0
  14. data/lib/assets/javascripts/{jquery_ujs.js → libraries/jquery_ujs.js} +0 -0
  15. data/lib/assets/javascripts/{keypress.js → libraries/keypress.js} +0 -0
  16. data/lib/assets/javascripts/{pusher.js → libraries/pusher.js} +0 -0
  17. data/lib/assets/javascripts/{string.js → libraries/string.js} +0 -0
  18. data/lib/assets/javascripts/{underscore.js → libraries/underscore.js} +0 -0
  19. data/lib/assets/javascripts/models/dropdown.coffee +5 -0
  20. data/lib/assets/javascripts/templates/dropdown.hbs +8 -0
  21. data/lib/assets/javascripts/views/dropdown_view.coffee +46 -0
  22. data/lib/assets/stylesheets/atlas_assets/_chosen.scss +388 -0
  23. data/lib/assets/stylesheets/atlas_assets/_fonts.scss +6 -1
  24. data/lib/assets/stylesheets/atlas_assets/_variables.scss +2 -1
  25. data/lib/assets/stylesheets/atlas_assets/dropdown.scss +16 -0
  26. data/lib/assets/stylesheets/atlas_assets.scss +4 -1
  27. data/lib/atlas_assets/version.rb +1 -1
  28. metadata +21 -12
  29. data/docs/ignore/atlas_assets.css +0 -9159
@@ -0,0 +1,388 @@
1
+ @import "atlas_assets/_variables";
2
+
3
+ /* @group Base */
4
+ .chosen-container {
5
+ position: relative;
6
+ display: inline-block;
7
+ vertical-align: middle;
8
+ font-size: 13px;
9
+ zoom: 1;
10
+ *display: inline;
11
+ -webkit-user-select: none;
12
+ -moz-user-select: none;
13
+ user-select: none;
14
+ min-width: 200px;
15
+ }
16
+ .chosen-container .chosen-drop {
17
+ position: absolute;
18
+ top: 100%;
19
+ left: -9999px;
20
+ z-index: 1010;
21
+ -webkit-box-sizing: border-box;
22
+ -moz-box-sizing: border-box;
23
+ box-sizing: border-box;
24
+ width: 100%;
25
+ border: 1px solid $defaultBorderColor;
26
+ border-top: 0;
27
+ background: $defaultBackgroundColor;
28
+ }
29
+
30
+ .chosen-container.chosen-with-drop .chosen-drop {
31
+ left: 0;
32
+ }
33
+
34
+ .chosen-container a {
35
+ cursor: pointer;
36
+ }
37
+
38
+ /* @end */
39
+ /* @group Single Chosen */
40
+ .chosen-container-single .chosen-single {
41
+ position: relative;
42
+ display: block;
43
+ overflow: hidden;
44
+ padding: 0 0 0 8px;
45
+ height: 23px;
46
+ border: 1px solid $defaultBorderColor;
47
+ background-color: $defaultBackgroundColor;
48
+ background-clip: padding-box;
49
+ color: $defaultFontColor;
50
+ text-decoration: none;
51
+ white-space: nowrap;
52
+ line-height: 24px;
53
+ }
54
+ .chosen-container-single .chosen-default {
55
+ color: $medium_gray;
56
+ }
57
+ .chosen-container-single .chosen-single span {
58
+ display: block;
59
+ overflow: hidden;
60
+ margin-right: 26px;
61
+ text-overflow: ellipsis;
62
+ white-space: nowrap;
63
+ }
64
+ .chosen-container-single .chosen-single-with-deselect span {
65
+ margin-right: 38px;
66
+ }
67
+ .chosen-container-single .chosen-single abbr {
68
+ position: absolute;
69
+ top: 6px;
70
+ right: 26px;
71
+ display: block;
72
+ width: 12px;
73
+ height: 12px;
74
+ background: image-url('chosen-sprite.png') -42px 1px no-repeat;
75
+ font-size: 1px;
76
+ }
77
+ .chosen-container-single .chosen-single abbr:hover {
78
+ background-position: -42px -10px;
79
+ }
80
+ .chosen-container-single.chosen-disabled .chosen-single abbr:hover {
81
+ background-position: -42px -10px;
82
+ }
83
+ .chosen-container-single .chosen-single div {
84
+ position: absolute;
85
+ top: 0;
86
+ right: 0;
87
+ display: block;
88
+ width: 18px;
89
+ height: 100%;
90
+ }
91
+ .chosen-container-single .chosen-single div b {
92
+ display: block;
93
+ width: 100%;
94
+ height: 100%;
95
+ background: image-url('chosen-sprite.png') no-repeat 0px 2px;
96
+ }
97
+ .chosen-container-single .chosen-search {
98
+ position: relative;
99
+ z-index: 1010;
100
+ margin: 0;
101
+ padding: 3px 4px;
102
+ white-space: nowrap;
103
+ }
104
+ .chosen-container-single .chosen-search input[type="text"] {
105
+ -webkit-box-sizing: border-box;
106
+ -moz-box-sizing: border-box;
107
+ box-sizing: border-box;
108
+ margin: 1px 0;
109
+ padding: 4px 20px 4px 5px;
110
+ width: 100%;
111
+ height: auto;
112
+ outline: 0;
113
+ border: 1px solid $defaultBorderColor;
114
+ background: white image-url('chosen-sprite.png') no-repeat 100% -20px;
115
+ font-size: 1em;
116
+ font-family: $sansFontFamily;
117
+ line-height: normal;
118
+ border-radius: 0;
119
+ }
120
+ .chosen-container-single .chosen-drop {
121
+ margin-top: -1px;
122
+ border-radius: 0 0 4px 4px;
123
+ background-clip: padding-box;
124
+ }
125
+ .chosen-container-single.chosen-container-single-nosearch .chosen-search {
126
+ position: absolute;
127
+ left: -9999px;
128
+ }
129
+
130
+ /* @end */
131
+ /* @group Results */
132
+ .chosen-container .chosen-results {
133
+ position: relative;
134
+ overflow-x: hidden;
135
+ overflow-y: auto;
136
+ margin: 0 4px 4px 0;
137
+ padding: 0 0 0 4px;
138
+ max-height: 240px;
139
+ -webkit-overflow-scrolling: touch;
140
+ }
141
+ .chosen-container .chosen-results li {
142
+ display: none;
143
+ margin: 0;
144
+ padding: 5px 6px;
145
+ list-style: none;
146
+ line-height: 15px;
147
+ }
148
+ .chosen-container .chosen-results li.active-result {
149
+ display: list-item;
150
+ cursor: pointer;
151
+ }
152
+ .chosen-container .chosen-results li.disabled-result {
153
+ display: list-item;
154
+ color: $gray;
155
+ cursor: default;
156
+ }
157
+ .chosen-container .chosen-results li.highlighted {
158
+ background-color: $blue;
159
+ color: $white;
160
+ }
161
+ .chosen-container .chosen-results li.no-results {
162
+ display: list-item;
163
+ background: $lightest_gray;
164
+ }
165
+ .chosen-container .chosen-results li.group-result {
166
+ display: list-item;
167
+ font-weight: bold;
168
+ cursor: default;
169
+ }
170
+ .chosen-container .chosen-results li.group-option {
171
+ padding-left: 15px;
172
+ }
173
+ .chosen-container .chosen-results li em {
174
+ font-style: normal;
175
+ text-decoration: underline;
176
+ }
177
+
178
+ /* @end */
179
+ /* @group Multi Chosen */
180
+ .chosen-container-multi .chosen-choices {
181
+ position: relative;
182
+ overflow: hidden;
183
+ -webkit-box-sizing: border-box;
184
+ -moz-box-sizing: border-box;
185
+ box-sizing: border-box;
186
+ margin: 0;
187
+ padding: 0;
188
+ width: 100%;
189
+ height: auto !important;
190
+ height: 1%;
191
+ border: 1px solid $defaultBorderColor;
192
+ background-color: $lightest_gray;
193
+ cursor: text;
194
+ }
195
+ .chosen-container-multi .chosen-choices li {
196
+ float: left;
197
+ list-style: none;
198
+ }
199
+ .chosen-container-multi .chosen-choices li.search-field {
200
+ margin: 0;
201
+ padding: 0;
202
+ white-space: nowrap;
203
+ }
204
+ .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
205
+ margin: 1px 0;
206
+ padding: 5px;
207
+ height: 15px;
208
+ outline: 0;
209
+ border: 0 !important;
210
+ background: transparent !important;
211
+ color: $medium_gray;
212
+ font-size: 100%;
213
+ font-family: $sansFontFamily;
214
+ line-height: normal;
215
+ border-radius: 0;
216
+ }
217
+ .chosen-container-multi .chosen-choices li.search-field .default {
218
+ color: $medium_gray;
219
+ }
220
+ .chosen-container-multi .chosen-choices li.search-choice {
221
+ position: relative;
222
+ margin: 3px 0 3px 5px;
223
+ padding: 3px 20px 3px 5px;
224
+ border: 1px solid $defaultBorderColor;
225
+ border-radius: 3px;
226
+ background-color: $lighter_gray;
227
+ background-clip: padding-box;
228
+ color: $darker_gray;
229
+ line-height: 13px;
230
+ cursor: default;
231
+ }
232
+ .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
233
+ position: absolute;
234
+ top: 4px;
235
+ right: 3px;
236
+ display: block;
237
+ width: 12px;
238
+ height: 12px;
239
+ background: image-url('chosen-sprite.png') -42px 1px no-repeat;
240
+ font-size: 1px;
241
+ }
242
+ .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover {
243
+ background-position: -42px -10px;
244
+ }
245
+ .chosen-container-multi .chosen-choices li.search-choice-disabled {
246
+ padding-right: 5px;
247
+ border: 1px solid $defaultBorderColor;
248
+ background-color: $lighter_gray;
249
+ color: $medium_gray;
250
+ }
251
+ .chosen-container-multi .chosen-choices li.search-choice-focus {
252
+ background: $gray;
253
+ }
254
+ .chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close {
255
+ background-position: -42px -10px;
256
+ }
257
+ .chosen-container-multi .chosen-results {
258
+ margin: 0;
259
+ padding: 0;
260
+ }
261
+ .chosen-container-multi .chosen-drop .result-selected {
262
+ display: list-item;
263
+ color: $mid_gray;
264
+ cursor: default;
265
+ }
266
+
267
+ /* @end */
268
+ /* @group Active */
269
+ .chosen-container-active .chosen-single {
270
+ border: 1px solid $defaultLinkColor;
271
+ }
272
+ .chosen-container-active.chosen-with-drop .chosen-single {
273
+ border: 1px solid $defaultBorderColor;
274
+ -moz-border-radius-bottomright: 0;
275
+ border-bottom-right-radius: 0;
276
+ -moz-border-radius-bottomleft: 0;
277
+ border-bottom-left-radius: 0;
278
+ }
279
+ .chosen-container-active.chosen-with-drop .chosen-single div {
280
+ border-left: none;
281
+ background: transparent;
282
+ }
283
+ .chosen-container-active.chosen-with-drop .chosen-single div b {
284
+ background-position: -18px 2px;
285
+ }
286
+ .chosen-container-active .chosen-choices {
287
+ border: 1px solid $defaultLinkColor;
288
+ }
289
+ .chosen-container-active .chosen-choices li.search-field input[type="text"] {
290
+ color: $darkest_gray !important;
291
+ }
292
+
293
+ /* @end */
294
+ /* @group Disabled Support */
295
+ .chosen-disabled {
296
+ opacity: 0.5 !important;
297
+ cursor: default;
298
+ }
299
+ .chosen-disabled .chosen-single {
300
+ cursor: default;
301
+ }
302
+ .chosen-disabled .chosen-choices .search-choice .search-choice-close {
303
+ cursor: default;
304
+ }
305
+
306
+ /* @end */
307
+ /* @group Right to Left */
308
+ .chosen-rtl {
309
+ text-align: right;
310
+ }
311
+ .chosen-rtl .chosen-single {
312
+ overflow: visible;
313
+ padding: 0 8px 0 0;
314
+ }
315
+ .chosen-rtl .chosen-single span {
316
+ margin-right: 0;
317
+ margin-left: 26px;
318
+ direction: rtl;
319
+ }
320
+ .chosen-rtl .chosen-single-with-deselect span {
321
+ margin-left: 38px;
322
+ }
323
+ .chosen-rtl .chosen-single div {
324
+ right: auto;
325
+ left: 3px;
326
+ }
327
+ .chosen-rtl .chosen-single abbr {
328
+ right: auto;
329
+ left: 26px;
330
+ }
331
+ .chosen-rtl .chosen-choices li {
332
+ float: right;
333
+ }
334
+ .chosen-rtl .chosen-choices li.search-field input[type="text"] {
335
+ direction: rtl;
336
+ }
337
+ .chosen-rtl .chosen-choices li.search-choice {
338
+ margin: 3px 5px 3px 0;
339
+ padding: 3px 5px 3px 19px;
340
+ }
341
+ .chosen-rtl .chosen-choices li.search-choice .search-choice-close {
342
+ right: auto;
343
+ left: 4px;
344
+ }
345
+ .chosen-rtl.chosen-container-single-nosearch .chosen-search,
346
+ .chosen-rtl .chosen-drop {
347
+ left: 9999px;
348
+ }
349
+ .chosen-rtl.chosen-container-single .chosen-results {
350
+ margin: 0 0 4px 4px;
351
+ padding: 0 4px 0 0;
352
+ }
353
+ .chosen-rtl .chosen-results li.group-option {
354
+ padding-right: 15px;
355
+ padding-left: 0;
356
+ }
357
+ .chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div {
358
+ border-right: none;
359
+ }
360
+ .chosen-rtl .chosen-search input[type="text"] {
361
+ padding: 4px 5px 4px 20px;
362
+ background: white image-url('chosen-sprite.png') no-repeat -30px -20px;
363
+ background: image-url('chosen-sprite.png') no-repeat -30px -20px;
364
+ direction: rtl;
365
+ }
366
+ .chosen-rtl.chosen-container-single .chosen-single div b {
367
+ background-position: 6px 2px;
368
+ }
369
+ .chosen-rtl.chosen-container-single.chosen-with-drop .chosen-single div b {
370
+ background-position: -12px 2px;
371
+ }
372
+
373
+ /* @end */
374
+ /* @group Retina compatibility */
375
+ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 144dpi) {
376
+ .chosen-rtl .chosen-search input[type="text"],
377
+ .chosen-container-single .chosen-single abbr,
378
+ .chosen-container-single .chosen-single div b,
379
+ .chosen-container-single .chosen-search input[type="text"],
380
+ .chosen-container-multi .chosen-choices .search-choice .search-choice-close,
381
+ .chosen-container .chosen-results-scroll-down span,
382
+ .chosen-container .chosen-results-scroll-up span {
383
+ background-image: image-url('chosen-sprite@2x.png') !important;
384
+ background-size: 52px 37px !important;
385
+ background-repeat: no-repeat !important;
386
+ }
387
+ }
388
+ /* @end */
@@ -1,6 +1,11 @@
1
1
  /* Import Lato font
2
2
  ---------------------------------------------------------------------------- */
3
-
3
+ @font-face {
4
+ font-family: 'Lato';
5
+ font-style: normal;
6
+ font-weight: 400;
7
+ src: local('Lato Regular'), local('Lato-Regular'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/qIIYRU-oROkIk8vfvxw6QvesZW2xOQ-xsNqO47m55DA.woff) format('woff');
8
+ }
4
9
  @font-face {
5
10
  font-family: 'Lato';
6
11
  font-style: normal;
@@ -14,7 +14,7 @@ $blue_gray: #739EB9 !default;
14
14
  $light_blue: #568EB3 !default;
15
15
  $lighter_blue: #a9cadf !default;
16
16
  $lightest_blue: #e0eaed !default;
17
-
17
+
18
18
  $green: #91b35b !default;
19
19
  $light_green: #9FC06A !default;
20
20
  $darker_green: #75914A !default;
@@ -49,6 +49,7 @@ $monoFontFamily: Monaco, Menlo, Consolas, "Courier New", monospace !defau
49
49
  $defaultBorderColor: $light_gray;
50
50
  $defaultBackgroundColor: $lightest_gray;
51
51
  $defaultFontColor: $darker_gray;
52
+ $defaultLinkColor: $blue;
52
53
 
53
54
  $defaultBorderRadius: 3px;
54
55
  $defaultBorderRadiusMedium: 6px;
@@ -0,0 +1,16 @@
1
+ @import "atlas_assets/variables";
2
+
3
+ .dropdown {
4
+ display: inline-block;
5
+ padding: 10px 0;
6
+ position: relative;
7
+ font-size: 14px;
8
+
9
+ .helper {
10
+ color: $medium_gray;
11
+ }
12
+ }
13
+
14
+ .dropdown[class*="span"] {
15
+ margin-left: 0;
16
+ }
@@ -20,7 +20,10 @@
20
20
  @import "atlas_assets/modals";
21
21
  @import "atlas_assets/tabs";
22
22
  @import "atlas_assets/utilities";
23
+ @import "atlas_assets/chosen";
23
24
 
24
25
  @import "atlas_assets/responsive-utilities";
25
26
  @import "atlas_assets/responsive-768-979";
26
- @import "atlas_assets/responsive-767";
27
+ @import "atlas_assets/responsive-767";
28
+
29
+ @import "atlas_assets/dropdown";
@@ -1,5 +1,5 @@
1
1
  module Atlas
2
2
  module Assets
3
- VERSION = "0.4.1"
3
+ VERSION = "0.4.2"
4
4
  end
5
5
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: atlas_assets
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.4.1
4
+ version: 0.4.2
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -18,7 +18,7 @@ dependencies:
18
18
  requirements:
19
19
  - - ~>
20
20
  - !ruby/object:Gem::Version
21
- version: 0.12.1
21
+ version: 0.12.2
22
22
  type: :runtime
23
23
  prerelease: false
24
24
  version_requirements: !ruby/object:Gem::Requirement
@@ -26,7 +26,7 @@ dependencies:
26
26
  requirements:
27
27
  - - ~>
28
28
  - !ruby/object:Gem::Version
29
- version: 0.12.1
29
+ version: 0.12.2
30
30
  description: Public repository with assets and design guide for the Atlas platform
31
31
  email:
32
32
  - rune@runemadsen.com
@@ -61,8 +61,8 @@ files:
61
61
  - docs/_posts/2013-05-29-modals.md
62
62
  - docs/_posts/2013-05-30-tabs.md
63
63
  - docs/_posts/2013-09-12-logo.md
64
+ - docs/_posts/2013-10-28-dropdown.md
64
65
  - docs/glyphicons-license.txt
65
- - docs/ignore/atlas_assets.css
66
66
  - docs/index.html
67
67
  - lib/assets/fonts/fontawesome-webfont.eot
68
68
  - lib/assets/fonts/fontawesome-webfont.svg
@@ -72,6 +72,8 @@ files:
72
72
  - lib/assets/fonts/glyphicons-regular.svg
73
73
  - lib/assets/fonts/glyphicons-regular.ttf
74
74
  - lib/assets/fonts/glyphicons-regular.woff
75
+ - lib/assets/images/chosen-sprite.png
76
+ - lib/assets/images/chosen-sprite@2x.png
75
77
  - lib/assets/images/glyphicons-white.png
76
78
  - lib/assets/images/glyphicons-white.svg
77
79
  - lib/assets/images/glyphicons.png
@@ -80,19 +82,25 @@ files:
80
82
  - lib/assets/images/logo.svg
81
83
  - lib/assets/javascripts/atlas_assets.js
82
84
  - lib/assets/javascripts/atlas_assets_setup.js
83
- - lib/assets/javascripts/backbone.js
84
- - lib/assets/javascripts/bootstrap.js
85
- - lib/assets/javascripts/jquery.js
86
- - lib/assets/javascripts/jquery_ujs.js
87
- - lib/assets/javascripts/keypress.js
88
- - lib/assets/javascripts/pusher.js
89
- - lib/assets/javascripts/string.js
85
+ - lib/assets/javascripts/collections/dropdown_collection.coffee
86
+ - lib/assets/javascripts/libraries/backbone.js
87
+ - lib/assets/javascripts/libraries/bootstrap.js
88
+ - lib/assets/javascripts/libraries/chosen.jquery.js
89
+ - lib/assets/javascripts/libraries/jquery.js
90
+ - lib/assets/javascripts/libraries/jquery_ujs.js
91
+ - lib/assets/javascripts/libraries/keypress.js
92
+ - lib/assets/javascripts/libraries/pusher.js
93
+ - lib/assets/javascripts/libraries/string.js
94
+ - lib/assets/javascripts/libraries/underscore.js
95
+ - lib/assets/javascripts/models/dropdown.coffee
90
96
  - lib/assets/javascripts/tabs.js
91
- - lib/assets/javascripts/underscore.js
97
+ - lib/assets/javascripts/templates/dropdown.hbs
98
+ - lib/assets/javascripts/views/dropdown_view.coffee
92
99
  - lib/assets/stylesheets/atlas_assets.scss
93
100
  - lib/assets/stylesheets/atlas_assets/_boxes.scss
94
101
  - lib/assets/stylesheets/atlas_assets/_button-groups.scss
95
102
  - lib/assets/stylesheets/atlas_assets/_buttons.scss
103
+ - lib/assets/stylesheets/atlas_assets/_chosen.scss
96
104
  - lib/assets/stylesheets/atlas_assets/_code.scss
97
105
  - lib/assets/stylesheets/atlas_assets/_flash.scss
98
106
  - lib/assets/stylesheets/atlas_assets/_fontawesome.scss
@@ -114,6 +122,7 @@ files:
114
122
  - lib/assets/stylesheets/atlas_assets/_tabs.scss
115
123
  - lib/assets/stylesheets/atlas_assets/_utilities.scss
116
124
  - lib/assets/stylesheets/atlas_assets/_variables.scss
125
+ - lib/assets/stylesheets/atlas_assets/dropdown.scss
117
126
  - lib/atlas_assets.rb
118
127
  - lib/atlas_assets/engine.rb
119
128
  - lib/atlas_assets/version.rb