Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[alternative idea] Use application css #38

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
+51 −54
Open

[alternative idea] Use application css #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
47892ce
Tests: fix warning.
Mar 17, 2016
fd14c10
Tests: fix deprecation warning.
Mar 17, 2016
435afde
Fix circular dependency warning:
Mar 17, 2016
b7298e7
Make Hound CI even happier.
Mar 17, 2016
9f19f31
+ .travis.yml: add Ruby 2.3.
Mar 17, 2016
8cb4e63
Merge branch 'ruby-versions' into fork
Mar 17, 2016
645ead1
Don't build styleguide's CSS from component folder but use
Mar 17, 2016
5b4bd4a
Undo changes that slipped in from other pull requests.
Mar 17, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 32 additions & 37 deletions app/assets/stylesheets/mountain_view/styleguide.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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;
Expand All @@ -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;
Expand All @@ -139,7 +134,7 @@ body{


/* HINT */
.mv-hint{
.mountainview-styleguide-hint{
margin: 40px 0;
padding: 30px;
font-size: 14px;
Expand All @@ -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;
Expand All @@ -178,6 +173,6 @@ body{
color: #444;
}

.mv-hint strong{
.mountainview-styleguide-hint strong{
font-weight: bold;
}
35 changes: 19 additions & 16 deletions app/views/layouts/mountain_view.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,27 +3,30 @@
<head>
<title>Styleguide</title>
<%= 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 %>
</head>
<body>
<div class="mv-header">
<div class="mv-header__logo">STYLEGUIDE</div>
</div>
<div class="mv-flex-wrapper">
<div class="mv-sidebar">
<h3>COMPONENTS</h3>
<ul>
<%- mv_components.each do |component| %>
<li>
<%= link_to component.title, styleguide_path(id: component.name) %>
</li>
<% end %>
</ul>
<body class='mountainview-styleguide-body'>
<div class='mountainview-styleguide-wrapper'>
<div class="mountainview-styleguide-header">
<div class="mountainview-styleguide-header__logo">STYLEGUIDE</div>
</div>
<div class="mv-main">
<%= yield %>
<div class="mountainview-styleguide-flex-wrapper">
<div class="mountainview-styleguide-sidebar">
<h3>COMPONENTS</h3>
<ul>
<%- mv_components.each do |component| %>
<li>
<%= link_to component.title, styleguide_path(id: component.name) %>
</li>
<% end %>
</ul>
</div>
<div class="mountainview-styleguide-main">
<%= yield %>
</div>
</div>
</div>
</body>
Expand Down
1 change: 0 additions & 1 deletion lib/mountain_view/engine.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
require "rails"
require "mountain_view"
require "mountain_view/component"

module MountainView
Expand Down