sul_styles 0.3.0 → 0.4.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (37) hide show
  1. checksums.yaml +4 -4
  2. data/.fontcustom-manifest.json +46 -2
  3. data/Capfile +9 -0
  4. data/README.md +30 -3
  5. data/Rakefile +18 -1
  6. data/app/assets/fonts/sul-icons.eot +0 -0
  7. data/app/assets/fonts/sul-icons.svg +117 -35
  8. data/app/assets/fonts/sul-icons.ttf +0 -0
  9. data/app/assets/fonts/sul-icons.woff +0 -0
  10. data/app/assets/stylesheets/_sul-icons-rails.scss +22 -0
  11. data/app/assets/stylesheets/_sul-icons.scss +33 -0
  12. data/app/assets/stylesheets/styleguide/styleguide.scss +4 -1
  13. data/app/assets/stylesheets/sul-icons/_helpers.scss +15 -0
  14. data/app/assets/stylesheets/sul-icons/build.scss +2 -0
  15. data/app/assets/stylesheets/sul-styles.scss +0 -2
  16. data/app/controllers/sul_styles/style_guide_controller.rb +1 -13
  17. data/app/views/layouts/styleguide.html.erb +2 -2
  18. data/app/views/sul_styles/style_guide/colors.html.erb +5 -5
  19. data/app/views/sul_styles/style_guide/icons.html.erb +1 -1
  20. data/config/deploy/development.rb +6 -0
  21. data/config/deploy/production.rb +6 -0
  22. data/config/deploy/staging.rb +6 -0
  23. data/config/deploy.rb +21 -0
  24. data/dist/0.3.0/sul-icons.css +222 -0
  25. data/dist/0.3.0/sul-icons.eot +0 -0
  26. data/dist/0.3.0/sul-icons.min.css +1 -0
  27. data/dist/0.3.0/sul-icons.svg +321 -0
  28. data/dist/0.3.0/sul-icons.ttf +0 -0
  29. data/dist/0.3.0/sul-icons.woff +0 -0
  30. data/docs/styleguide/sul-icons-preview.html +168 -3
  31. data/lib/capistrano/tasks/deploy.rake +9 -0
  32. data/lib/sul_styles/colors.rb +76 -0
  33. data/lib/sul_styles/version.rb +1 -1
  34. data/lib/sul_styles.rb +1 -0
  35. data/lib/tasks/find_colors.rake +16 -0
  36. data/sul_styles.gemspec +2 -0
  37. metadata +46 -2
data/docs/styleguide/sul-icons-preview.html CHANGED
@@ -160,10 +160,12 @@
160
160
  [data-icon]:before { content: attr(data-icon); }
161
161
 
162
162
  [data-icon]:before,
163
- .sul-i-arrow-left-3:before,
163
+ .sul-i-arrow-down-8:before,
164
+ .sul-i-arrow-left-3:before,
164
165
  .sul-i-arrow-left-8:before,
165
166
  .sul-i-arrow-right-3:before,
166
167
  .sul-i-arrow-right-8:before,
168
+ .sul-i-arrow-up-8:before,
167
169
  .sul-i-book-open-4:before,
168
170
  .sul-i-bookmark-all-1:before,
169
171
  .sul-i-books-library:before,
@@ -175,7 +177,16 @@
175
177
  .sul-i-download-3:before,
176
178
  .sul-i-email:before,
177
179
  .sul-i-expand-1:before,
180
+ .sul-i-file-acrobat:before,
181
+ .sul-i-file-code-1:before,
182
+ .sul-i-file-excel:before,
178
183
  .sul-i-file-music-1:before,
184
+ .sul-i-file-picture:before,
185
+ .sul-i-file-powerpoint:before,
186
+ .sul-i-file-text-document:before,
187
+ .sul-i-file-video-3:before,
188
+ .sul-i-file-words:before,
189
+ .sul-i-file-zipped:before,
179
190
  .sul-i-graph-bar-2:before,
180
191
  .sul-i-infomation-circle:before,
181
192
  .sul-i-key-2:before,
@@ -223,10 +234,12 @@
223
234
  font-smoothing: antialiased;
224
235
  }
225
236
 
226
- .sul-i-arrow-left-3:before { content: "\f108"; }
237
+ .sul-i-arrow-down-8:before { content: "\f13e"; }
238
+ .sul-i-arrow-left-3:before { content: "\f108"; }
227
239
  .sul-i-arrow-left-8:before { content: "\f109"; }
228
240
  .sul-i-arrow-right-3:before { content: "\f10a"; }
229
241
  .sul-i-arrow-right-8:before { content: "\f10b"; }
242
+ .sul-i-arrow-up-8:before { content: "\f13f"; }
230
243
  .sul-i-book-open-4:before { content: "\f10c"; }
231
244
  .sul-i-bookmark-all-1:before { content: "\f10d"; }
232
245
  .sul-i-books-library:before { content: "\f10e"; }
@@ -238,7 +251,16 @@
238
251
  .sul-i-download-3:before { content: "\f106"; }
239
252
  .sul-i-email:before { content: "\f114"; }
240
253
  .sul-i-expand-1:before { content: "\f115"; }
254
+ .sul-i-file-acrobat:before { content: "\f13a"; }
255
+ .sul-i-file-code-1:before { content: "\f137"; }
256
+ .sul-i-file-excel:before { content: "\f13b"; }
241
257
  .sul-i-file-music-1:before { content: "\f116"; }
258
+ .sul-i-file-picture:before { content: "\f136"; }
259
+ .sul-i-file-powerpoint:before { content: "\f13d"; }
260
+ .sul-i-file-text-document:before { content: "\f139"; }
261
+ .sul-i-file-video-3:before { content: "\f138"; }
262
+ .sul-i-file-words:before { content: "\f13c"; }
263
+ .sul-i-file-zipped:before { content: "\f134"; }
242
264
  .sul-i-graph-bar-2:before { content: "\f117"; }
243
265
  .sul-i-infomation-circle:before { content: "\f104"; }
244
266
  .sul-i-key-2:before { content: "\f118"; }
@@ -287,11 +309,24 @@
287
309
  <body class="characters-off">
288
310
  <div id="page" class="container">
289
311
  <header>
290
- <h1>sul-icons contains 49 glyphs:</h1>
312
+ <h1>sul-icons contains 60 glyphs:</h1>
291
313
  <a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>
292
314
  </header>
293
315
 
294
316
 
317
+ <div class="glyph">
318
+ <div class="preview-glyphs">
319
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-arrow-down-8" class="sul-i-arrow-down-8"></i></span>
320
+ </div>
321
+ <div class="preview-scale">
322
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
323
+ </div>
324
+ <div class="usage">
325
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-arrow-down-8" />
326
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13e;" />
327
+ </div>
328
+ </div>
329
+
295
330
  <div class="glyph">
296
331
  <div class="preview-glyphs">
297
332
  <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-arrow-left-3" class="sul-i-arrow-left-3"></i></span>
@@ -344,6 +379,19 @@
344
379
  </div>
345
380
  </div>
346
381
 
382
+ <div class="glyph">
383
+ <div class="preview-glyphs">
384
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-arrow-up-8" class="sul-i-arrow-up-8"></i></span>
385
+ </div>
386
+ <div class="preview-scale">
387
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
388
+ </div>
389
+ <div class="usage">
390
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-arrow-up-8" />
391
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13f;" />
392
+ </div>
393
+ </div>
394
+
347
395
  <div class="glyph">
348
396
  <div class="preview-glyphs">
349
397
  <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-book-open-4" class="sul-i-book-open-4"></i></span>
@@ -487,6 +535,45 @@
487
535
  </div>
488
536
  </div>
489
537
 
538
+ <div class="glyph">
539
+ <div class="preview-glyphs">
540
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-acrobat" class="sul-i-file-acrobat"></i></span>
541
+ </div>
542
+ <div class="preview-scale">
543
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
544
+ </div>
545
+ <div class="usage">
546
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-acrobat" />
547
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13a;" />
548
+ </div>
549
+ </div>
550
+
551
+ <div class="glyph">
552
+ <div class="preview-glyphs">
553
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-code-1" class="sul-i-file-code-1"></i></span>
554
+ </div>
555
+ <div class="preview-scale">
556
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
557
+ </div>
558
+ <div class="usage">
559
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-code-1" />
560
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf137;" />
561
+ </div>
562
+ </div>
563
+
564
+ <div class="glyph">
565
+ <div class="preview-glyphs">
566
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-excel" class="sul-i-file-excel"></i></span>
567
+ </div>
568
+ <div class="preview-scale">
569
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
570
+ </div>
571
+ <div class="usage">
572
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-excel" />
573
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13b;" />
574
+ </div>
575
+ </div>
576
+
490
577
  <div class="glyph">
491
578
  <div class="preview-glyphs">
492
579
  <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-music-1" class="sul-i-file-music-1"></i></span>
@@ -500,6 +587,84 @@
500
587
  </div>
501
588
  </div>
502
589
 
590
+ <div class="glyph">
591
+ <div class="preview-glyphs">
592
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-picture" class="sul-i-file-picture"></i></span>
593
+ </div>
594
+ <div class="preview-scale">
595
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
596
+ </div>
597
+ <div class="usage">
598
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-picture" />
599
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf136;" />
600
+ </div>
601
+ </div>
602
+
603
+ <div class="glyph">
604
+ <div class="preview-glyphs">
605
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-powerpoint" class="sul-i-file-powerpoint"></i></span>
606
+ </div>
607
+ <div class="preview-scale">
608
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
609
+ </div>
610
+ <div class="usage">
611
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-powerpoint" />
612
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13d;" />
613
+ </div>
614
+ </div>
615
+
616
+ <div class="glyph">
617
+ <div class="preview-glyphs">
618
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-text-document" class="sul-i-file-text-document"></i></span>
619
+ </div>
620
+ <div class="preview-scale">
621
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
622
+ </div>
623
+ <div class="usage">
624
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-text-document" />
625
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf139;" />
626
+ </div>
627
+ </div>
628
+
629
+ <div class="glyph">
630
+ <div class="preview-glyphs">
631
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-video-3" class="sul-i-file-video-3"></i></span>
632
+ </div>
633
+ <div class="preview-scale">
634
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
635
+ </div>
636
+ <div class="usage">
637
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-video-3" />
638
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf138;" />
639
+ </div>
640
+ </div>
641
+
642
+ <div class="glyph">
643
+ <div class="preview-glyphs">
644
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-words" class="sul-i-file-words"></i></span>
645
+ </div>
646
+ <div class="preview-scale">
647
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
648
+ </div>
649
+ <div class="usage">
650
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-words" />
651
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf13c;" />
652
+ </div>
653
+ </div>
654
+
655
+ <div class="glyph">
656
+ <div class="preview-glyphs">
657
+ <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-file-zipped" class="sul-i-file-zipped"></i></span>
658
+ </div>
659
+ <div class="preview-scale">
660
+ <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
661
+ </div>
662
+ <div class="usage">
663
+ <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".sul-i-file-zipped" />
664
+ <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf134;" />
665
+ </div>
666
+ </div>
667
+
503
668
  <div class="glyph">
504
669
  <div class="preview-glyphs">
505
670
  <span class="step size-12"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="sul-i-graph-bar-2" class="sul-i-graph-bar-2"></i></span>
data/lib/capistrano/tasks/deploy.rake ADDED
@@ -0,0 +1,9 @@
1
+ # Clears default Capistrano deploy tasks
2
+ Rake::Task['deploy'].clear
3
+
4
+ # Overwrites the default Capistrano deploy task to do file uploading
5
+ task :deploy do
6
+ on roles(:all) do
7
+ upload! './dist/.', fetch(:deploy_to), recursive: true
8
+ end
9
+ end
data/lib/sul_styles/colors.rb ADDED
@@ -0,0 +1,76 @@
1
+ module SULStyles
2
+ ###
3
+ # SULStyles::Colors class provides the ability to parse a CSS
4
+ # stylesheet to get all of the colors assigned to variables.
5
+ ###
6
+ class Colors
7
+ def all
8
+ @all ||= color_files.map do |file|
9
+ self.class.parse_colors(file)
10
+ end
11
+ end
12
+
13
+ def colors
14
+ all.each_with_object({}) do |file, hash|
15
+ file.colors.each do |color_data|
16
+ hash[color_data.value] = color_data.variable
17
+ end
18
+ end
19
+ end
20
+
21
+ class << self
22
+ def parse_colors(file_name)
23
+ file = File.read(file_name)
24
+ CssFile.new(
25
+ title: file.match(%r{(?<=\/\*\n)(.*)(?=\*\/)}m).to_s.strip,
26
+ colors: file.scan(/^\$.*;$/).map do |c|
27
+ color_data = c.split(':')
28
+ ColorData.new(
29
+ variable: color_data.first, value: color_data.last.strip
30
+ )
31
+ end
32
+ )
33
+ end
34
+ end
35
+
36
+ private
37
+
38
+ def color_files
39
+ [primary_colors_file, web_colors_file]
40
+ end
41
+
42
+ def primary_colors_file
43
+ "#{stylesheets_directory}/sul-styles/su_primary_colors.scss"
44
+ end
45
+
46
+ def web_colors_file
47
+ "#{stylesheets_directory}/sul-styles/su_web_colors.scss"
48
+ end
49
+
50
+ def stylesheets_directory
51
+ "#{SulStyles::Engine.root}/app/assets/stylesheets"
52
+ end
53
+
54
+ ###
55
+ # Utility class to model a CSS file that has a title and an array of colors
56
+ ###
57
+ class CssFile
58
+ attr_reader :title, :colors
59
+ def initialize(title:, colors:)
60
+ @title = title
61
+ @colors = colors
62
+ end
63
+ end
64
+
65
+ ###
66
+ # Utility class to model a css variable and its value
67
+ ###
68
+ class ColorData
69
+ attr_reader :variable, :value
70
+ def initialize(variable:, value:)
71
+ @variable = variable
72
+ @value = value.gsub(/;$/, '')
73
+ end
74
+ end
75
+ end
76
+ end
data/lib/sul_styles/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module SulStyles
2
- VERSION = "0.3.0"
2
+ VERSION = "0.4.0"
3
3
  end
data/lib/sul_styles.rb CHANGED
@@ -1,4 +1,5 @@
1
1
  require 'sul_styles/engine'
2
+ require 'sul_styles/colors'
2
3
 
3
4
  module SulStyles
4
5
  end
data/lib/tasks/find_colors.rake ADDED
@@ -0,0 +1,16 @@
1
+ namespace :sul_styles do
2
+ desc 'Check scss files in app/assets/stylesheets for SUL Styles provided colors'
3
+ task :check_local_colors do
4
+ gem_colors = SULStyles::Colors.new.colors
5
+ Dir.glob('app/assets/stylesheets/**/*.scss').each do |file_name|
6
+ file = File.read(file_name)
7
+ file.scan(/(#\S{6}|#\S{3}).*;$/).each do |colors|
8
+ colors.each do |color|
9
+ if gem_colors[color]
10
+ puts "The color #{color} is present in #{file_name}. This color is provided by SUL Styles under the variable #{gem_colors[color]}."
11
+ end
12
+ end
13
+ end
14
+ end
15
+ end
16
+ end
data/sul_styles.gemspec CHANGED
@@ -24,4 +24,6 @@ Gem::Specification.new do |spec|
24
24
  spec.add_development_dependency 'engine_cart', '~> 0.7.0'
25
25
  spec.add_development_dependency 'rspec-rails', '~> 3.0'
26
26
  spec.add_development_dependency 'capybara', '~> 2.4.4'
27
+ spec.add_development_dependency 'capistrano', '~> 3.4.0'
28
+ spec.add_development_dependency 'lyberteam-capistrano-devel'
27
29
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: sul_styles
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.3.0
4
+ version: 0.4.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jack Reed
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2015-08-06 00:00:00.000000000 Z
11
+ date: 2015-08-20 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -94,6 +94,34 @@ dependencies:
94
94
  - - "~>"
95
95
  - !ruby/object:Gem::Version
96
96
  version: 2.4.4
97
+ - !ruby/object:Gem::Dependency
98
+ name: capistrano
99
+ requirement: !ruby/object:Gem::Requirement
100
+ requirements:
101
+ - - "~>"
102
+ - !ruby/object:Gem::Version
103
+ version: 3.4.0
104
+ type: :development
105
+ prerelease: false
106
+ version_requirements: !ruby/object:Gem::Requirement
107
+ requirements:
108
+ - - "~>"
109
+ - !ruby/object:Gem::Version
110
+ version: 3.4.0
111
+ - !ruby/object:Gem::Dependency
112
+ name: lyberteam-capistrano-devel
113
+ requirement: !ruby/object:Gem::Requirement
114
+ requirements:
115
+ - - ">="
116
+ - !ruby/object:Gem::Version
117
+ version: '0'
118
+ type: :development
119
+ prerelease: false
120
+ version_requirements: !ruby/object:Gem::Requirement
121
+ requirements:
122
+ - - ">="
123
+ - !ruby/object:Gem::Version
124
+ version: '0'
97
125
  description:
98
126
  email:
99
127
  - pjreed@stanford.edu
@@ -105,6 +133,7 @@ files:
105
133
  - ".gitignore"
106
134
  - ".rspec"
107
135
  - ".travis.yml"
136
+ - Capfile
108
137
  - Gemfile
109
138
  - LICENSE
110
139
  - README.md
@@ -118,6 +147,8 @@ files:
118
147
  - app/assets/stylesheets/_sul-icons.scss
119
148
  - app/assets/stylesheets/styleguide.scss
120
149
  - app/assets/stylesheets/styleguide/styleguide.scss
150
+ - app/assets/stylesheets/sul-icons/_helpers.scss
151
+ - app/assets/stylesheets/sul-icons/build.scss
121
152
  - app/assets/stylesheets/sul-styles.scss
122
153
  - app/assets/stylesheets/sul-styles/su_primary_colors.scss
123
154
  - app/assets/stylesheets/sul-styles/su_web_colors.scss
@@ -127,15 +158,28 @@ files:
127
158
  - app/views/sul_styles/style_guide/icons.html.erb
128
159
  - app/views/sul_styles/style_guide/index.html.erb
129
160
  - bin/rails
161
+ - config/deploy.rb
162
+ - config/deploy/development.rb
163
+ - config/deploy/production.rb
164
+ - config/deploy/staging.rb
130
165
  - config/locales/sul_styles.en.yml
131
166
  - config/routes.rb
167
+ - dist/0.3.0/sul-icons.css
168
+ - dist/0.3.0/sul-icons.eot
169
+ - dist/0.3.0/sul-icons.min.css
170
+ - dist/0.3.0/sul-icons.svg
171
+ - dist/0.3.0/sul-icons.ttf
172
+ - dist/0.3.0/sul-icons.woff
132
173
  - docs/styleguide/sul-icons-preview.html
133
174
  - fontcustom.yml
134
175
  - icon_svgs/.keep
176
+ - lib/capistrano/tasks/deploy.rake
135
177
  - lib/generators/sul_styles/install_generator.rb
136
178
  - lib/sul_styles.rb
179
+ - lib/sul_styles/colors.rb
137
180
  - lib/sul_styles/engine.rb
138
181
  - lib/sul_styles/version.rb
182
+ - lib/tasks/find_colors.rake
139
183
  - sul_styles.gemspec
140
184
  homepage: https://github.com/sul-dlss/sul_styles
141
185
  licenses: []