From 47892ce2f0712c97cfd85b31e14829d7500a86c7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 12:50:12 +0100 Subject: [PATCH 1/7] Tests: fix warning. `mountain_view/test/helpers/mountain_view/component_helper_test.rb:10: warning: ambiguous first argument; put parentheses or a space even after `/' operator` `/` can be a division or the start of a regex. --- test/helpers/mountain_view/component_helper_test.rb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/helpers/mountain_view/component_helper_test.rb b/test/helpers/mountain_view/component_helper_test.rb index 93e280d..014baa8 100644 --- a/test/helpers/mountain_view/component_helper_test.rb +++ b/test/helpers/mountain_view/component_helper_test.rb @@ -7,6 +7,6 @@ class MountainView::ComponentHelperTest < ActionView::TestCase expected = /Pepe/ assert_match expected, rendered - assert_match /href=\"\/products\/1\"/, rendered + assert_match(/href=\"\/products\/1\"/, rendered) end end From fd14c105aa3c047a8a45e1e8f0de5a963f928120 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 12:50:47 +0100 Subject: [PATCH 2/7] Tests: fix deprecation warning. `warning: Dir.exists? is a deprecated name, use Dir.exist? instead` --- app/assets/javascripts/mountain_view.js.erb | 2 +- app/assets/stylesheets/mountain_view.css.erb | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/mountain_view.js.erb b/app/assets/javascripts/mountain_view.js.erb index 574c1ab..ab8c1b6 100644 --- a/app/assets/javascripts/mountain_view.js.erb +++ b/app/assets/javascripts/mountain_view.js.erb @@ -1,4 +1,4 @@ -<% if Dir.exists?(MountainView.configuration.components_path) %> +<% if Dir.exist?(MountainView.configuration.components_path) %> <% depend_on MountainView.configuration.components_path.to_s %> <% Dir.glob(MountainView.configuration.components_path.join('*')).each do |component_dir| component = File.basename component_dir diff --git a/app/assets/stylesheets/mountain_view.css.erb b/app/assets/stylesheets/mountain_view.css.erb index 96a8cdb..0196364 100644 --- a/app/assets/stylesheets/mountain_view.css.erb +++ b/app/assets/stylesheets/mountain_view.css.erb @@ -1,7 +1,7 @@ <% MountainView.configuration.included_stylesheets.each do |included_stylesheet| %> <%= require_asset included_stylesheet %> <% end %> -<% if Dir.exists?(MountainView.configuration.components_path) %> +<% if Dir.exist?(MountainView.configuration.components_path) %> <% depend_on MountainView.configuration.components_path.to_s %> <% Dir.glob(MountainView.configuration.components_path.join('*')).each do |component_dir| component = File.basename component_dir From 435afde3b4961b158e4e9d63f15e8acd8a846990 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 12:51:28 +0100 Subject: [PATCH 3/7] Fix circular dependency warning: mountain_view/lib/mountain_view/engine.rb:2: warning: loading in progress, circular require considered harmful - mountain_view/lib/mountain_view.rb --- lib/mountain_view/engine.rb | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/mountain_view/engine.rb b/lib/mountain_view/engine.rb index e6cef3d..9b8f8e5 100644 --- a/lib/mountain_view/engine.rb +++ b/lib/mountain_view/engine.rb @@ -1,5 +1,4 @@ require "rails" -require "mountain_view" require "mountain_view/component" module MountainView From b7298e7ff49103d243df95d832fb81f63f6100f2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 13:17:26 +0100 Subject: [PATCH 4/7] Make Hound CI even happier. --- test/helpers/mountain_view/component_helper_test.rb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/helpers/mountain_view/component_helper_test.rb b/test/helpers/mountain_view/component_helper_test.rb index 014baa8..f9c7988 100644 --- a/test/helpers/mountain_view/component_helper_test.rb +++ b/test/helpers/mountain_view/component_helper_test.rb @@ -7,6 +7,6 @@ class MountainView::ComponentHelperTest < ActionView::TestCase expected = /Pepe/ assert_match expected, rendered - assert_match(/href=\"\/products\/1\"/, rendered) + assert_match %r(href=\"\/products\/1\"), rendered end end From 9f19f31a7fb4f575f894d70fc6223f7ba9b66707 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 14:02:14 +0100 Subject: [PATCH 5/7] + .travis.yml: add Ruby 2.3. + README: add information about supported Ruby versions. --- .travis.yml | 1 + README.md | 2 ++ 2 files changed, 3 insertions(+) diff --git a/.travis.yml b/.travis.yml index 51632bc..e1c15e8 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,6 +4,7 @@ rvm: - 2.0 - 2.1 - 2.2 + - 2.3 env: - "RAILS_VERSION=3.2.0" diff --git a/README.md b/README.md index 66a5f7c..5445fb1 100644 --- a/README.md +++ b/README.md @@ -26,6 +26,8 @@ Then execute: $ bundle +Mountain View supports Ruby 2.0+. + ## Usage Use the built-in generator to create a new component: From 645ead173a89afc255572f6e53a0d4a20bf81596 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 15:39:47 +0100 Subject: [PATCH 6/7] Don't build styleguide's CSS from component folder but use application.scss instead. + Move component stylesheets to app/assets/stylesheets instead. + remove CSS reset to better ensure the styleguide uses the exact same CSS as the app + add class to stylesheet body that can be modified in application.scss + change styleguide element naming convention from `mv-` to `mountainview-styleguide-` - should be safer and someone might have an `.mv-sidebar` in their app. --- .../stylesheets/mountain_view/styleguide.css | 69 +++++++++---------- app/views/layouts/mountain_view.html.erb | 35 +++++----- 2 files changed, 51 insertions(+), 53 deletions(-) diff --git a/app/assets/stylesheets/mountain_view/styleguide.css b/app/assets/stylesheets/mountain_view/styleguide.css index 768f797..c682fde 100644 --- a/app/assets/stylesheets/mountain_view/styleguide.css +++ b/app/assets/stylesheets/mountain_view/styleguide.css @@ -1,37 +1,32 @@ /* *= require_self -*= require mountain_view *= require mountain_view/prism */ -/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */ -html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0} - -body{ - font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; +.mountainview-styleguide-body { padding: 0; margin: 0; } /* HEADER */ -.mv-header{ +.mountainview-styleguide-header{ background: #777; padding: 20px; } -.mv-header__logo{ +.mountainview-styleguide-header__logo{ font-weight: bold; color: white; font-size: 20px; } -/* FlEX WRAPPER */ +/* FLEX WRAPPER */ -.mv-flex-wrapper{ +.mountainview-styleguide-flex-wrapper{ display: flex; } /* SIDEBAR */ -.mv-sidebar{ +.mountainview-styleguide-sidebar{ background: #F7F7F7; width: 18%; box-sizing: border-box; @@ -42,93 +37,93 @@ body{ min-height: 100vh; } -.mv-sidebar h3{ +.mountainview-styleguide-sidebar h3{ font-weight: bold; font-size: 16px; margin-bottom: 25px; color: #444; } -.mv-sidebar ul{ +.mountainview-styleguide-sidebar ul{ } -.mv-sidebar ul li{ +.mountainview-styleguide-sidebar ul li{ margin-bottom: 20px; } -.mv-sidebar ul li a{ +.mountainview-styleguide-sidebar ul li a{ color: #555; font-size: 14px; text-decoration: none; font-weight: 300; } -.mv-sidebar ul li a:hover{ +.mountainview-styleguide-sidebar ul li a:hover{ color: #000; } /* MAIN */ -.mv-main{ +.mountainview-styleguide-main{ box-sizing: border-box; width: 82%; float: left; padding: 30px 60px; } -.mv-main__header{ +.mountainview-styleguide-main__header{ margin-bottom: 40px; } -.mv-main__header h1{ +.mountainview-styleguide-main__header h1{ font-weight: 100; font-size: 55px; color: #333; } -.mv-main__description { +.mountainview-styleguide-main__description { } /* COMPONENT */ -.mv-component{ +.mountainview-styleguide-component{ margin-bottom: 150px; } -.mv-component__item{ +.mountainview-styleguide-component__item{ } -.mv-component__meta{ +.mountainview-styleguide-component__meta{ padding: 25px; margin-bottom: 20px; background: #F7F7F7; border: 1px solid #E4E4E4; } -.mv-component__meta p{ +.mountainview-styleguide-component__meta p{ color: #000; } -.mv-component__description{ +.mountainview-styleguide-component__description{ padding: 25px; background: #F7F7F7; border: 1px solid #E4E4E4; margin-top: 30px; } -.mv-component__description h2{ +.mountainview-styleguide-component__description h2{ font-weight: bold; margin-bottom: 20px; } -.mv-component__description__definition{ +.mountainview-styleguide-component__description__definition{ margin-bottom: 20px; } -.mv-component__description__definition code, -.mv-component__description__properties code { +.mountainview-styleguide-component__description__definition code, +.mountainview-styleguide-component__description__properties code { background: none !important; font-size: 14px; } -.mv-component__description__properties{ +.mountainview-styleguide-component__description__properties{ background: #fff !important; border: 1px solid #e4e4e4; max-height: 230px; @@ -139,7 +134,7 @@ body{ /* HINT */ -.mv-hint{ +.mountainview-styleguide-hint{ margin: 40px 0; padding: 30px; font-size: 14px; @@ -148,27 +143,27 @@ body{ box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); } -.mv-hint h2{ +.mountainview-styleguide-hint h2{ font-size: 19px; margin-bottom: 20px; color: #000; } -.mv-hint h2 span{ +.mountainview-styleguide-hint h2 span{ color: #FCCC37; margin-right: 5px; font-weight: bold; } -.mv-hint ul{ +.mountainview-styleguide-hint ul{ list-style-type: disc; margin-left: 15px; } -.mv-hint ul li{ +.mountainview-styleguide-hint ul li{ margin-bottom: 10px; line-height: 1.5; } -.mv-hint pre{ +.mountainview-styleguide-hint pre{ background: #F5F5F5; padding: 15px 30px; border-radius: 5px; @@ -178,6 +173,6 @@ body{ color: #444; } -.mv-hint strong{ +.mountainview-styleguide-hint strong{ font-weight: bold; } diff --git a/app/views/layouts/mountain_view.html.erb b/app/views/layouts/mountain_view.html.erb index 6994e68..1c5baf5 100644 --- a/app/views/layouts/mountain_view.html.erb +++ b/app/views/layouts/mountain_view.html.erb @@ -3,27 +3,30 @@ Styleguide <%= stylesheet_link_tag 'mountain_view/styleguide', media: 'all', 'data-turbolinks-track' => true %> + <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> <%= javascript_include_tag 'mountain_view/styleguide', 'data-turbolinks-track' => true %> <%= csrf_meta_tags %> - -
- -
-
-
-

COMPONENTS

-
    - <%- mv_components.each do |component| %> -
  • - <%= link_to component.title, styleguide_path(id: component.name) %> -
    • - <% end %> -
+ +
+
+
-
- <%= yield %> +
+
+

COMPONENTS

+
    + <%- mv_components.each do |component| %> +
  • + <%= link_to component.title, styleguide_path(id: component.name) %> +
    • + <% end %> +
+
+
+ <%= yield %> +
From 5b4bd4aafd0c8d09c5685150ac8139c56be1d206 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20K=C3=B6gel?= Date: Thu, 17 Mar 2016 15:51:31 +0100 Subject: [PATCH 7/7] Undo changes that slipped in from other pull requests. --- .travis.yml | 1 - README.md | 2 -- app/assets/javascripts/mountain_view.js.erb | 2 +- app/assets/stylesheets/mountain_view.css.erb | 2 +- test/helpers/mountain_view/component_helper_test.rb | 2 +- 5 files changed, 3 insertions(+), 6 deletions(-) diff --git a/.travis.yml b/.travis.yml index e1c15e8..51632bc 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,7 +4,6 @@ rvm: - 2.0 - 2.1 - 2.2 - - 2.3 env: - "RAILS_VERSION=3.2.0" diff --git a/README.md b/README.md index 5445fb1..66a5f7c 100644 --- a/README.md +++ b/README.md @@ -26,8 +26,6 @@ Then execute: $ bundle -Mountain View supports Ruby 2.0+. - ## Usage Use the built-in generator to create a new component: diff --git a/app/assets/javascripts/mountain_view.js.erb b/app/assets/javascripts/mountain_view.js.erb index ab8c1b6..574c1ab 100644 --- a/app/assets/javascripts/mountain_view.js.erb +++ b/app/assets/javascripts/mountain_view.js.erb @@ -1,4 +1,4 @@ -<% if Dir.exist?(MountainView.configuration.components_path) %> +<% if Dir.exists?(MountainView.configuration.components_path) %> <% depend_on MountainView.configuration.components_path.to_s %> <% Dir.glob(MountainView.configuration.components_path.join('*')).each do |component_dir| component = File.basename component_dir diff --git a/app/assets/stylesheets/mountain_view.css.erb b/app/assets/stylesheets/mountain_view.css.erb index 0196364..96a8cdb 100644 --- a/app/assets/stylesheets/mountain_view.css.erb +++ b/app/assets/stylesheets/mountain_view.css.erb @@ -1,7 +1,7 @@ <% MountainView.configuration.included_stylesheets.each do |included_stylesheet| %> <%= require_asset included_stylesheet %> <% end %> -<% if Dir.exist?(MountainView.configuration.components_path) %> +<% if Dir.exists?(MountainView.configuration.components_path) %> <% depend_on MountainView.configuration.components_path.to_s %> <% Dir.glob(MountainView.configuration.components_path.join('*')).each do |component_dir| component = File.basename component_dir diff --git a/test/helpers/mountain_view/component_helper_test.rb b/test/helpers/mountain_view/component_helper_test.rb index f9c7988..93e280d 100644 --- a/test/helpers/mountain_view/component_helper_test.rb +++ b/test/helpers/mountain_view/component_helper_test.rb @@ -7,6 +7,6 @@ class MountainView::ComponentHelperTest < ActionView::TestCase expected = /Pepe/ assert_match expected, rendered - assert_match %r(href=\"\/products\/1\"), rendered + assert_match /href=\"\/products\/1\"/, rendered end end