styleguide_rails 0.1.3 → 0.2.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.
- data/lib/generators/styleguide/templates/index.html.erb +14 -3
- data/lib/generators/styleguide/templates/styleguide.css +43 -20
- data/lib/generators/styleguide/templates/styleguide.js +37 -1
- data/lib/generators/styleguide/templates/styleguide_controller.rb +3 -3
- data/lib/styleguide_rails/version.rb +1 -1
- metadata +9 -3
| @@ -1,9 +1,20 @@ | |
| 1 1 | 
             
            <nav>
         | 
| 2 2 | 
             
              <ul>
         | 
| 3 3 | 
             
                <li><a>Widgets</a>
         | 
| 4 | 
            -
             | 
| 5 | 
            -
             | 
| 6 | 
            -
             | 
| 4 | 
            +
                  <ul>
         | 
| 5 | 
            +
                    <%= render :partial => 'widget_link', :collection => @widgets, :as => :widget %>
         | 
| 6 | 
            +
                  </ul>
         | 
| 7 | 
            +
                <li><a>Width</a>
         | 
| 8 | 
            +
                  <ul id='width-options'>
         | 
| 9 | 
            +
                    <li class='width-option' data-width='320px'>320</li>
         | 
| 10 | 
            +
                    <li class='width-option' data-width='480px'>480</li>
         | 
| 11 | 
            +
                    <li class='width-option' data-width='748px'>748</li>
         | 
| 12 | 
            +
                    <li class='width-option' data-width='960px'>960</li>
         | 
| 13 | 
            +
                    <li class='width-option' data-width='1024px'>1024</li>
         | 
| 14 | 
            +
                    <li class='width-option' data-width='1280px'>1280</li>
         | 
| 15 | 
            +
                    <li class='width-option' data-width='640px'>iPhone</li>
         | 
| 16 | 
            +
                    <li class='width-option' data-width='100%'>Full</li>
         | 
| 17 | 
            +
                  </ul>
         | 
| 7 18 | 
             
                </li>
         | 
| 8 19 | 
             
              </ul>
         | 
| 9 20 | 
             
            </nav>
         | 
| @@ -17,12 +17,6 @@ | |
| 17 17 | 
             
              width: 100%;
         | 
| 18 18 | 
             
              line-height: 32px;
         | 
| 19 19 | 
             
            }
         | 
| 20 | 
            -
            #styleguide_rails > nav > ul ul {
         | 
| 21 | 
            -
              display: none;
         | 
| 22 | 
            -
            }
         | 
| 23 | 
            -
            #styleguide_rails > nav > ul > li:hover > ul {
         | 
| 24 | 
            -
              display: block;
         | 
| 25 | 
            -
            }
         | 
| 26 20 | 
             
            #styleguide_rails > nav ul {
         | 
| 27 21 | 
             
              background: #efefef;
         | 
| 28 22 | 
             
              background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);
         | 
| @@ -37,39 +31,49 @@ | |
| 37 31 | 
             
            }
         | 
| 38 32 | 
             
            #styleguide_rails > nav > ul > li {
         | 
| 39 33 | 
             
              float: left;
         | 
| 34 | 
            +
              cursor: pointer;
         | 
| 40 35 | 
             
            }
         | 
| 41 | 
            -
            #styleguide_rails > nav > ul  | 
| 42 | 
            -
               | 
| 43 | 
            -
              background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
         | 
| 44 | 
            -
              background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
         | 
| 45 | 
            -
              background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
         | 
| 36 | 
            +
            #styleguide_rails > nav > ul a {
         | 
| 37 | 
            +
              text-decoration: none;
         | 
| 46 38 | 
             
            }
         | 
| 47 | 
            -
            #styleguide_rails > nav > ul > li:hover | 
| 39 | 
            +
            #styleguide_rails > nav > ul > li:hover,
         | 
| 40 | 
            +
            #styleguide_rails > nav > ul > li.open {
         | 
| 41 | 
            +
              background: #545454;
         | 
| 42 | 
            +
            }
         | 
| 43 | 
            +
            #styleguide_rails > nav > ul > li:hover > a,
         | 
| 44 | 
            +
            #styleguide_rails > nav > ul > li.open > a {
         | 
| 48 45 | 
             
              color: #fff;
         | 
| 49 46 | 
             
            }
         | 
| 50 | 
            -
            #styleguide_rails > nav > ul > li a {
         | 
| 47 | 
            +
            #styleguide_rails > nav > ul > li > a {
         | 
| 51 48 | 
             
              display: block;
         | 
| 52 49 | 
             
              padding: 0 10px;
         | 
| 53 50 | 
             
              color: #757575;
         | 
| 54 | 
            -
              text-decoration: none;
         | 
| 55 51 | 
             
            }
         | 
| 56 52 | 
             
            #styleguide_rails > nav > ul ul {
         | 
| 57 | 
            -
               | 
| 53 | 
            +
              display: none;
         | 
| 54 | 
            +
              background: #757575;
         | 
| 58 55 | 
             
              padding: 0;
         | 
| 59 56 | 
             
              position: absolute;
         | 
| 60 57 | 
             
              top: 100%;
         | 
| 58 | 
            +
              z-index: 100;
         | 
| 61 59 | 
             
            }
         | 
| 62 60 | 
             
            #styleguide_rails > nav > ul ul > li {
         | 
| 63 61 | 
             
              float: none;
         | 
| 64 | 
            -
               | 
| 65 | 
            -
              border- | 
| 62 | 
            +
              padding: 0 10px;
         | 
| 63 | 
            +
              border-top: 1px solid #7c7c7c;
         | 
| 64 | 
            +
              border-bottom: 1px solid #545454;
         | 
| 66 65 | 
             
              position: relative;
         | 
| 66 | 
            +
              color: #fff;
         | 
| 67 67 | 
             
            }
         | 
| 68 | 
            -
            #styleguide_rails > nav > ul ul > li  | 
| 68 | 
            +
            #styleguide_rails > nav > ul ul > li a {
         | 
| 69 69 | 
             
              color: #fff;
         | 
| 70 70 | 
             
            }
         | 
| 71 | 
            -
            #styleguide_rails > nav > ul ul > li | 
| 72 | 
            -
             | 
| 71 | 
            +
            #styleguide_rails > nav > ul ul > li:hover,
         | 
| 72 | 
            +
            #styleguide_rails > nav > ul ul > li.selected {
         | 
| 73 | 
            +
              background: #545454;
         | 
| 74 | 
            +
            }
         | 
| 75 | 
            +
            #styleguide_rails > nav > #width-options {
         | 
| 76 | 
            +
              display: none;
         | 
| 73 77 | 
             
            }
         | 
| 74 78 | 
             
            #styleguide_rails > dl {
         | 
| 75 79 | 
             
              padding: 0 10px;
         | 
| @@ -88,6 +92,10 @@ | |
| 88 92 | 
             
              margin: 0;
         | 
| 89 93 | 
             
            }
         | 
| 90 94 | 
             
            #styleguide_rails > dl > dd.preview {
         | 
| 95 | 
            +
              margin: 0 auto;
         | 
| 96 | 
            +
              border: 1px solid white;
         | 
| 97 | 
            +
            }
         | 
| 98 | 
            +
            #styleguide_rails > dl > dd.preview:hover {
         | 
| 91 99 | 
             
              border-bottom: 1px dashed #CCC;
         | 
| 92 100 | 
             
              border-left: 1px dashed #CCC;
         | 
| 93 101 | 
             
              border-right: 1px dashed #CCC;
         | 
| @@ -97,12 +105,27 @@ | |
| 97 105 | 
             
              font-style: italic;
         | 
| 98 106 | 
             
              color: #ddd;
         | 
| 99 107 | 
             
              margin-top: 0.5em;
         | 
| 108 | 
            +
              cursor: pointer;
         | 
| 109 | 
            +
            }
         | 
| 110 | 
            +
            #styleguide_rails > dl > dd > div.location:after {
         | 
| 111 | 
            +
              font-style: normal;
         | 
| 112 | 
            +
              content: '\25B2';
         | 
| 113 | 
            +
              padding-left: 5px;
         | 
| 114 | 
            +
            }
         | 
| 115 | 
            +
            #styleguide_rails > dl > dd > div.location.show-code:after {
         | 
| 116 | 
            +
              content: '\25BC';
         | 
| 100 117 | 
             
            }
         | 
| 101 118 | 
             
            #styleguide_rails a[name] {
         | 
| 102 119 | 
             
              display: block;
         | 
| 103 120 | 
             
              padding-top: 42px;
         | 
| 104 121 | 
             
            }
         | 
| 105 122 |  | 
| 123 | 
            +
            pre[class*="language-"] {
         | 
| 124 | 
            +
              display: none;
         | 
| 125 | 
            +
            }
         | 
| 126 | 
            +
            div.show-code + pre[class*="language-"] {
         | 
| 127 | 
            +
              display: block;
         | 
| 128 | 
            +
            }
         | 
| 106 129 |  | 
| 107 130 | 
             
            /**
         | 
| 108 131 | 
             
             * prism.js default theme for JavaScript, CSS and HTML
         | 
| @@ -396,4 +396,40 @@ Prism.hooks.add('wrap', function(env) { | |
| 396 396 | 
             
              if (env.type === 'entity') {
         | 
| 397 397 | 
             
                env.attributes['title'] = env.content.replace(/&/, '&');
         | 
| 398 398 | 
             
              }
         | 
| 399 | 
            -
            }) | 
| 399 | 
            +
            });
         | 
| 400 | 
            +
             | 
| 401 | 
            +
            (function() {
         | 
| 402 | 
            +
              var activateMenus = function () {
         | 
| 403 | 
            +
                $('#styleguide_rails > nav > ul > li').click(function () {
         | 
| 404 | 
            +
                  $('#styleguide_rails > nav > ul > li').not(this).find('ul').hide();
         | 
| 405 | 
            +
                  $('#styleguide_rails > nav > ul > li').not(this).removeClass('open');
         | 
| 406 | 
            +
                  $(this).find('ul').toggle();
         | 
| 407 | 
            +
                  $(this).toggleClass('open');
         | 
| 408 | 
            +
                });
         | 
| 409 | 
            +
             | 
| 410 | 
            +
                $('#styleguide_rails > dl').click(function () {
         | 
| 411 | 
            +
                  $('#styleguide_rails > nav > ul > li > ul').hide();
         | 
| 412 | 
            +
                  $('#styleguide_rails > nav > ul > li').removeClass('open');
         | 
| 413 | 
            +
                });
         | 
| 414 | 
            +
              };
         | 
| 415 | 
            +
             | 
| 416 | 
            +
              var bindWidthPickers = function () {
         | 
| 417 | 
            +
                $('li[data-width]').click(function () {
         | 
| 418 | 
            +
                  $('dd.preview').css('width', $(this).data('width'));
         | 
| 419 | 
            +
                  $(this).siblings().removeClass('selected');
         | 
| 420 | 
            +
                  $(this).addClass('selected');
         | 
| 421 | 
            +
                });
         | 
| 422 | 
            +
              };
         | 
| 423 | 
            +
             | 
| 424 | 
            +
              var activateCodeShowing = function () {
         | 
| 425 | 
            +
                $('div.location').click(function () {
         | 
| 426 | 
            +
                  $(this).toggleClass('show-code');
         | 
| 427 | 
            +
                });
         | 
| 428 | 
            +
              };
         | 
| 429 | 
            +
             | 
| 430 | 
            +
              $(function () {
         | 
| 431 | 
            +
                activateMenus();
         | 
| 432 | 
            +
                bindWidthPickers();
         | 
| 433 | 
            +
                activateCodeShowing();
         | 
| 434 | 
            +
              });
         | 
| 435 | 
            +
            })();
         | 
| @@ -7,9 +7,9 @@ class StyleguideController < ApplicationController | |
| 7 7 | 
             
                @widgets = widget_files.reduce([]) do |widgets, filename|
         | 
| 8 8 | 
             
                  lang = filename.match(/haml$/) ? 'haml' : 'markup'
         | 
| 9 9 |  | 
| 10 | 
            -
                  name = File.basename(filename)
         | 
| 11 | 
            -
                              | 
| 12 | 
            -
                              | 
| 10 | 
            +
                  name = File.basename(filename).
         | 
| 11 | 
            +
                             sub(/.html.*/, '').
         | 
| 12 | 
            +
                             sub(/^_/, '')
         | 
| 13 13 |  | 
| 14 14 | 
             
                  widgets << { :name       => name,
         | 
| 15 15 | 
             
                               :filename   => filename,
         | 
    
        metadata
    CHANGED
    
    | @@ -1,7 +1,7 @@ | |
| 1 1 | 
             
            --- !ruby/object:Gem::Specification
         | 
| 2 2 | 
             
            name: styleguide_rails
         | 
| 3 3 | 
             
            version: !ruby/object:Gem::Version
         | 
| 4 | 
            -
              version: 0. | 
| 4 | 
            +
              version: 0.2.0
         | 
| 5 5 | 
             
              prerelease: 
         | 
| 6 6 | 
             
            platform: ruby
         | 
| 7 7 | 
             
            authors:
         | 
| @@ -10,7 +10,7 @@ authors: | |
| 10 10 | 
             
            autorequire: 
         | 
| 11 11 | 
             
            bindir: bin
         | 
| 12 12 | 
             
            cert_chain: []
         | 
| 13 | 
            -
            date: 2013- | 
| 13 | 
            +
            date: 2013-04-26 00:00:00.000000000 Z
         | 
| 14 14 | 
             
            dependencies:
         | 
| 15 15 | 
             
            - !ruby/object:Gem::Dependency
         | 
| 16 16 | 
             
              name: rails
         | 
| @@ -67,15 +67,21 @@ required_ruby_version: !ruby/object:Gem::Requirement | |
| 67 67 | 
             
              - - ! '>='
         | 
| 68 68 | 
             
                - !ruby/object:Gem::Version
         | 
| 69 69 | 
             
                  version: '0'
         | 
| 70 | 
            +
                  segments:
         | 
| 71 | 
            +
                  - 0
         | 
| 72 | 
            +
                  hash: 1160601883018097668
         | 
| 70 73 | 
             
            required_rubygems_version: !ruby/object:Gem::Requirement
         | 
| 71 74 | 
             
              none: false
         | 
| 72 75 | 
             
              requirements:
         | 
| 73 76 | 
             
              - - ! '>='
         | 
| 74 77 | 
             
                - !ruby/object:Gem::Version
         | 
| 75 78 | 
             
                  version: '0'
         | 
| 79 | 
            +
                  segments:
         | 
| 80 | 
            +
                  - 0
         | 
| 81 | 
            +
                  hash: 1160601883018097668
         | 
| 76 82 | 
             
            requirements: []
         | 
| 77 83 | 
             
            rubyforge_project: 
         | 
| 78 | 
            -
            rubygems_version: 1.8. | 
| 84 | 
            +
            rubygems_version: 1.8.25
         | 
| 79 85 | 
             
            signing_key: 
         | 
| 80 86 | 
             
            specification_version: 3
         | 
| 81 87 | 
             
            summary: Generates a controller, route, and views for your styleguide
         |