facades 0.0.1 → 0.0.2
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +97 -15
- data/app/helpers/facades_helper.rb +2 -3
- data/lib/facades/engine.rb +2 -0
- data/lib/facades/helpers/navigation.rb +1 -0
- data/lib/facades/helpers.rb +15 -0
- data/lib/facades/sass_ext/form_elements.rb +46 -0
- data/lib/facades/sass_ext.rb +15 -0
- data/lib/facades/stylesheets/facades/_reset.scss +13 -14
- data/lib/facades/stylesheets/facades/_ui.scss +1 -0
- data/lib/facades/stylesheets/facades/layout/_forms.scss +36 -26
- data/lib/facades/stylesheets/facades/layout/_grid.scss +7 -4
- data/lib/facades/stylesheets/facades/typography/_rhythm.scss +15 -3
- data/lib/facades/stylesheets/facades/ui/_tool-tip.scss +43 -0
- data/lib/facades/stylesheets/facades/utilities/_site-map.scss +18 -0
- data/lib/facades/version.rb +1 -1
- data/lib/facades.rb +1 -6
- metadata +13 -7
- /data/lib/facades/stylesheets/facades/{_util.css.scss → _utilities.scss} +0 -0
data/README.md
CHANGED
@@ -1,24 +1,106 @@
|
|
1
|
-
#
|
1
|
+
#Facades
|
2
|
+
Facades is a gem designed to assist with front-end development and misc design. It includes a compass plugin / mixins, and various Rails view helpers to help with common development tasks.
|
2
3
|
|
3
|
-
|
4
|
-
|
4
|
+
##CSS / SASS
|
5
|
+
Facades includes several mixins and includes for setting up a few defaults within your css.
|
5
6
|
|
6
|
-
|
7
|
+
###Reset
|
8
|
+
A HTML5-friendly reset is included to ensure elements like `aside`, `section` etc are setup properly. It also sets up a few typography defaults using Compass' vertical-rhythm format.
|
9
|
+
To configure, assign the variables to `$font-size` and `$line-height`. These will default to 12px / 24px. Vertical-rhythm is defaulted to relative font sizes.
|
7
10
|
|
8
|
-
|
11
|
+
$font-size:12px;
|
12
|
+
$line-height:24px;
|
13
|
+
|
14
|
+
@import 'facades/reset'; // Will automatically setup the vertical rhythm
|
9
15
|
|
10
|
-
###
|
11
|
-
|
12
|
-
vertical-rhythm format.
|
16
|
+
###Layout
|
17
|
+
Mixins are provided for a fixed grid, forms, and grid debugging.
|
13
18
|
|
14
|
-
|
19
|
+
**Grid Setup**
|
20
|
+
|
21
|
+
$grid-width: 960px; // Full width of the container
|
22
|
+
$grid-columns: 24; // Total number of columns
|
23
|
+
$grid-gutter-width: 10px; // Spacing between each column
|
24
|
+
|
25
|
+
@import 'facades/layout/grid'; /( or include 'facades/layout')
|
26
|
+
#wrapper{ @include container; }
|
27
|
+
|
28
|
+
To debug grid alignment, a shortcut to the Compass' grid background is provided.
|
29
|
+
|
30
|
+
#wrapper{ @include debug-grid; }
|
31
|
+
|
32
|
+
### Mixins
|
33
|
+
Below is a list of available mixins
|
34
|
+
|
35
|
+
Interface
|
36
|
+
-----------------------
|
37
|
+
tool-tip
|
38
|
+
|
39
|
+
Forms
|
40
|
+
----------------------
|
41
|
+
form-field-list
|
42
|
+
form-split-field-list
|
43
|
+
form-field
|
44
|
+
form-input
|
45
|
+
form-select
|
46
|
+
form-textarea
|
47
|
+
form-errors
|
48
|
+
form-error-message
|
49
|
+
form-field-hint
|
50
|
+
|
51
|
+
Grid (based off of the blueprint grid)
|
52
|
+
---------------------
|
53
|
+
column
|
54
|
+
push
|
55
|
+
pull
|
56
|
+
append
|
57
|
+
prepend
|
58
|
+
span (function) // width:span(2);
|
59
|
+
|
60
|
+
Text
|
61
|
+
----------------------
|
62
|
+
leading (shortcut to Compass adjust-leading-to)
|
63
|
+
font-size (shortcut to Compass adjust-font-size-to)
|
64
|
+
|
65
|
+
Utility
|
66
|
+
----------------------
|
67
|
+
position (shorthand position relative/fixed/absolute)
|
68
|
+
|
69
|
+
##Helpers
|
70
|
+
|
71
|
+
###Layout Helpers
|
72
|
+
|
73
|
+
**Variables**
|
74
|
+
Setup variables via templates to be used within your layout.
|
75
|
+
|
76
|
+
* `page_id` The id of the current page, useful for targeting with CSS. Defaults to "controller_action" in Rails
|
77
|
+
* `page_title` Used to populate the title of the page
|
78
|
+
* `keywords` Used to populate the keywords meta tag
|
79
|
+
* `description` Used to populate the description meta tag
|
80
|
+
|
81
|
+
To assign variables, pass their value to the method. To display, use the method without any arguments
|
82
|
+
|
83
|
+
# index.html.erb
|
84
|
+
<%= page_id('home') %>
|
85
|
+
|
86
|
+
# In your layout
|
87
|
+
body id="<%= page_id %>"
|
88
|
+
|
89
|
+
**Misc**
|
15
90
|
|
16
|
-
|
17
|
-
Mixins are provided for a fixed grid, forms, and grid debugging. To setup a grid, `@include 'facades/layout/grid'` ( or simply `facades/layout`) and configure the following:
|
91
|
+
`meta_tag` A shortcut for creating HTML meta tags.
|
18
92
|
|
19
|
-
|
20
|
-
|
21
|
-
|
93
|
+
<%= meta_tag('name', 'content') %> #=> <meta name="name" content="content" />
|
94
|
+
|
95
|
+
`robot_meta_tag` A shortcut for defining a robot meta tag based on the Rails.env. Useful to keep spiders out of your staging environments
|
22
96
|
|
23
|
-
|
97
|
+
# In any environment but production
|
98
|
+
<%= robot_meta_tag %> #=> <meta name="robots" content="noindex, nofollow" />
|
99
|
+
|
100
|
+
# In production
|
101
|
+
<%= robot_meta_tag %> #=> <meta name="robots" content="index, follow" />
|
102
|
+
|
103
|
+
`button_link` Shortcut for creating a link class="button" with an optional icon
|
24
104
|
|
105
|
+
<%= button_link 'Link Text', some_path, icon: 'image.png' %> #=> <a href='#' class='button'><img src='image.png' /></a>
|
106
|
+
|
data/lib/facades/engine.rb
CHANGED
@@ -36,6 +36,7 @@ module Facades
|
|
36
36
|
wrapper === false ? child_link : content_tag(wrapper, child_link, wrapper_attrs)
|
37
37
|
|
38
38
|
end
|
39
|
+
alias :nav_link_to :nav_link
|
39
40
|
|
40
41
|
def sub_nav_link(text, path, attrs = {}, wrapper = :li, container = :ol, &block)
|
41
42
|
wrapper_attrs = attrs.delete(:wrapper)
|
@@ -0,0 +1,15 @@
|
|
1
|
+
module Facades
|
2
|
+
module Helpers
|
3
|
+
extend ActiveSupport::Concern
|
4
|
+
|
5
|
+
autoload :Layout, 'facades/helpers/layout'
|
6
|
+
autoload :Navigation, 'facades/helpers/navigation'
|
7
|
+
autoload :Elements, 'facades/helpers/elements'
|
8
|
+
|
9
|
+
included do
|
10
|
+
include Facades::Helpers::Layout
|
11
|
+
include Facades::Helpers::Navigation
|
12
|
+
include Facades::Helpers::Elements
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
@@ -0,0 +1,46 @@
|
|
1
|
+
module Facades
|
2
|
+
module SassExt
|
3
|
+
module FormElements
|
4
|
+
|
5
|
+
def fields_of_type(*args)
|
6
|
+
types = args.collect do |type|
|
7
|
+
send(:"#{type}_input_types")
|
8
|
+
end
|
9
|
+
Sass::Script::String.new(types.join(", "))
|
10
|
+
end
|
11
|
+
|
12
|
+
private
|
13
|
+
|
14
|
+
def all_input_types
|
15
|
+
[:checkbox, :password, :radio, :select, :string, :textarea].collect{ |t| send(:"#{t}_input_types") }.flatten.compact
|
16
|
+
end
|
17
|
+
|
18
|
+
def checkbox_input_types
|
19
|
+
"input[type=checkbox]"
|
20
|
+
end
|
21
|
+
alias :check_input_types :checkbox_input_types
|
22
|
+
|
23
|
+
def password_input_types
|
24
|
+
"input[type=password]"
|
25
|
+
end
|
26
|
+
|
27
|
+
def radio_input_types
|
28
|
+
"input[type=radio]"
|
29
|
+
end
|
30
|
+
|
31
|
+
def select_input_types
|
32
|
+
"select"
|
33
|
+
end
|
34
|
+
|
35
|
+
def string_input_types
|
36
|
+
%w{email password text}.collect{ |t| "input[type=#{t}]" }
|
37
|
+
end
|
38
|
+
|
39
|
+
def textarea_input_types
|
40
|
+
"textarea"
|
41
|
+
end
|
42
|
+
|
43
|
+
end
|
44
|
+
|
45
|
+
end
|
46
|
+
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
require 'sass'
|
2
|
+
|
3
|
+
module Facades
|
4
|
+
module SassExt
|
5
|
+
autoload :FormElements, 'facades/sass_ext/form_elements'
|
6
|
+
end
|
7
|
+
end
|
8
|
+
|
9
|
+
module Sass::Script::Functions
|
10
|
+
include Facades::SassExt::FormElements
|
11
|
+
end
|
12
|
+
|
13
|
+
class Sass::Script::Functions::EvaluationContext
|
14
|
+
include Sass::Script::Functions
|
15
|
+
end
|
@@ -1,5 +1,5 @@
|
|
1
1
|
@import 'facades/typography/rhythm';
|
2
|
-
|
2
|
+
@import "compass/typography/lists/inline-block-list";
|
3
3
|
//
|
4
4
|
// Establishes a default baseline for vertical rhythm
|
5
5
|
// CSS Reset from html5doctor.com
|
@@ -42,14 +42,8 @@ img{ margin:0; }
|
|
42
42
|
|
43
43
|
// Establish reasonable heading and font sizes, with line-heights based on vertical rhythm.
|
44
44
|
|
45
|
-
h1,h2,h3,h4,h5,h6{ font-weight:normal;
|
46
|
-
|
47
|
-
h2{ @include font-size(28px, 2); }
|
48
|
-
h3{ @include font-size(26px, 2); }
|
49
|
-
h4{ @include font-size(22px, 2); }
|
50
|
-
h5{ @include font-size(16px, 1); }
|
51
|
-
h6{ @include font-size(11px, 1); }
|
52
|
-
p{ @include font-size($font-size, 1); }
|
45
|
+
h1,h2,h3,h4,h5,h6{ font-weight:normal;}
|
46
|
+
@include font-scaling;
|
53
47
|
|
54
48
|
a{ text-decoration:underline; color:$link-color;
|
55
49
|
&:hover{ color:$link-hover-color; }
|
@@ -66,14 +60,17 @@ abbr, acronym{ border-bottom: 1px dotted lighten($font-color, 10%); }
|
|
66
60
|
address{ margin: 0 0 1.5em; font-style: italic; }
|
67
61
|
pre{ margin: 1.5em 0; white-space:pre; }
|
68
62
|
pre, code, tt{ @include fixed-width-text; }
|
69
|
-
|
70
|
-
|
63
|
+
ul, ol{ margin:0 1.5em rhythm(1, $font-size) 0; padding-left: 1.5em;
|
64
|
+
li{ @include adjust-font-size-to($font-size);
|
65
|
+
ol, ul{ margin:0; }
|
66
|
+
}
|
67
|
+
}
|
71
68
|
ul{ list-style-type: $unordered-list-type; }
|
72
69
|
ol{ list-style-type: $ordered-list-type; }
|
73
|
-
dl{ margin: 0 0 1
|
70
|
+
dl{ margin: 0 0 rhythm(1, $font-size) 0;
|
74
71
|
dt{ font-weight: bold; }
|
75
72
|
}
|
76
|
-
dd{ margin
|
73
|
+
dd{ margin:0 1.5em rhythm(1, $font-size) 1.5em; }
|
77
74
|
table{ margin-bottom: 1.4em; width: 100%;
|
78
75
|
th{ font-weight: bold; }
|
79
76
|
thead th{ background: $table-header-color; }
|
@@ -81,4 +78,6 @@ table{ margin-bottom: 1.4em; width: 100%;
|
|
81
78
|
table.striped tr:nth-child(even) td,
|
82
79
|
table tr.even td{ background:$table-stripe-color; }
|
83
80
|
}
|
84
|
-
|
81
|
+
nav{
|
82
|
+
ol, ul{ @include inline-block-list(1em); @include margin-trailer(1, $font-size); }
|
83
|
+
}
|
@@ -0,0 +1 @@
|
|
1
|
+
@import 'facades/ui/tool-tip';
|
@@ -25,16 +25,19 @@ $error-border-color: #E41D38 !default;
|
|
25
25
|
|
26
26
|
// Mixin for styling select boxes
|
27
27
|
@mixin form-select( $font-size: $input-font-size, $normal-border: $unfocused-border-color, $focus-border: $focus-border-color, $border-radius: $input-border-radius ){
|
28
|
-
@include form-field($font-size, $
|
29
|
-
border-style:solid;
|
28
|
+
@include form-field($font-size, $normal-border, $focus-border, $border-radius);
|
29
|
+
border-style:solid;
|
30
|
+
border-width:1px;
|
30
31
|
&:focus{ outline:none; }
|
31
32
|
&[multiple=multiple]{ border-color:$unfocused-border-color; }
|
32
33
|
}
|
33
34
|
|
34
35
|
// Mixin for styling textareas
|
35
36
|
@mixin form-textarea( $font-size: $input-font-size, $normal-border: $unfocused-border-color, $focus-border: $focus-border-color, $border-radius: $input-border-radius ){
|
36
|
-
@include form-field($font-size, $
|
37
|
-
margin:0.5em; padding:5px;
|
37
|
+
@include form-field($font-size, $normal-border, $focus-border, $border-radius);
|
38
|
+
margin:0.5em; padding:5px;
|
39
|
+
border-style:solid;
|
40
|
+
border-width:1px;
|
38
41
|
}
|
39
42
|
|
40
43
|
// Default input styling
|
@@ -42,8 +45,10 @@ $error-border-color: #E41D38 !default;
|
|
42
45
|
&.text,
|
43
46
|
&[type=text],
|
44
47
|
&[type=password],
|
45
|
-
&[type=email]{
|
46
|
-
@include form-field($font-size, $
|
48
|
+
&[type=email]{
|
49
|
+
@include form-field($font-size, $normal-border, $focus-border, $border-radius); padding:.5em;
|
50
|
+
border-style:solid;
|
51
|
+
border-width:1px;
|
47
52
|
}
|
48
53
|
&[type=checkbox],
|
49
54
|
&[type=radio]{
|
@@ -100,29 +105,34 @@ $error-border-color: #E41D38 !default;
|
|
100
105
|
|
101
106
|
// Creates a single column list of fields within a form. Form elements should be marked up using ordered lists for semantic value.
|
102
107
|
@mixin form-field-list{
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
108
|
+
list-style-type:none;
|
109
|
+
margin:0px;
|
110
|
+
padding:0px;
|
111
|
+
padding-right:10px;
|
112
|
+
|
113
|
+
li{ padding:.5em 0px;
|
114
|
+
&.clear{ clear:both; }
|
115
|
+
&.buttons{ clear:both; padding:.25em 0px 0px 0px; }
|
116
|
+
&.inline label{ @include inline-block; }
|
117
|
+
&.multifield{
|
118
|
+
input, select{ @include inline-block; }
|
119
|
+
}
|
120
|
+
ol{ @include form-split-field-list; }
|
121
|
+
@include form-errors;
|
113
122
|
|
114
|
-
|
115
|
-
|
123
|
+
#{$form-hint-selector}{ @include form-field-hint; }
|
124
|
+
#{$form-error-message-selector}{ @include form-error-message( $error-color ); }
|
116
125
|
|
117
|
-
|
118
|
-
label{ display:block; }
|
119
|
-
@include form-select; @include form-input; @include form-textarea;
|
120
|
-
}
|
121
|
-
ol.inline li.label{ @include inline-block; }
|
122
|
-
label abbr{ outline:none; border:none; color:red; }
|
126
|
+
}
|
123
127
|
label{
|
124
|
-
|
125
|
-
|
128
|
+
display:block;
|
129
|
+
font-size:12px;
|
130
|
+
height:20px;
|
126
131
|
}
|
132
|
+
#{fields_of_type(select)}{ @include form-select; }
|
133
|
+
#{fields_of_type(string, checkbox, radio)}{ @include form-input; }
|
134
|
+
#{fields_of_type(textarea)}{ @include form-textarea; }
|
135
|
+
|
136
|
+
label abbr{ outline:none; border:none; color:red; }
|
127
137
|
fieldset{ border:none; }
|
128
138
|
}
|
@@ -15,14 +15,15 @@ $grid-column-width: $grid-width / $grid-columns * 1 - $grid-gutter-width;
|
|
15
15
|
@return $grid-width / $grid-columns * $n - $grid-gutter-width;
|
16
16
|
}
|
17
17
|
|
18
|
-
@mixin column-base($gutter: $gutter-width){
|
18
|
+
@mixin column-base($gutter: $grid-gutter-width){
|
19
19
|
display: inline; float: left;
|
20
20
|
margin-left: $gutter / 2;
|
21
21
|
margin-right: $gutter / 2;
|
22
22
|
}
|
23
23
|
|
24
|
-
@mixin column($n, $
|
25
|
-
@include column-base($gutter);
|
24
|
+
@mixin column($n, $last:false){
|
25
|
+
@include column-base($grid-gutter-width);
|
26
|
+
@if $last{ margin-right:0; }
|
26
27
|
width:span($n);
|
27
28
|
}
|
28
29
|
|
@@ -49,8 +50,9 @@ $grid-column-width: $grid-width / $grid-columns * 1 - $grid-gutter-width;
|
|
49
50
|
|
50
51
|
@import 'compass/layout/grid-background';
|
51
52
|
$grid-background-column-color: #eef2f9;
|
53
|
+
$grid-background-offset: ceil($grid-gutter-width / 2);
|
52
54
|
$grid-background-baseline-color: rgba(0,0,0,0.15);
|
53
|
-
$grid-background-gutter-color:
|
55
|
+
$grid-background-gutter-color: rgba(255,255,255,0);
|
54
56
|
$grid-background-total-columns: $grid-columns;
|
55
57
|
$grid-background-column-width: $grid-column-width;
|
56
58
|
$grid-background-gutter-width: $grid-gutter-width;
|
@@ -58,5 +60,6 @@ $grid-background-baseline-height: #{($line-height / $font-size)}em;
|
|
58
60
|
|
59
61
|
|
60
62
|
@mixin debug-grid{
|
63
|
+
background-color:transparent;
|
61
64
|
@include grid-background;
|
62
65
|
}
|
@@ -7,9 +7,21 @@
|
|
7
7
|
// Shorthand overrides for Compass' adjust-font-size/leading-to
|
8
8
|
// because well.. they are freakin long.
|
9
9
|
//
|
10
|
-
@mixin font-size($size, $lines){
|
10
|
+
@mixin font-size($size, $lines: lines-for-font-size($size)){
|
11
11
|
@include adjust-font-size-to($size, $lines);
|
12
12
|
}
|
13
|
-
@mixin leading($size, $lines){
|
13
|
+
@mixin leading($size, $lines: lines-for-font-size($size)){
|
14
14
|
@include adjust-leading-to($size, $lines);
|
15
|
-
}
|
15
|
+
}
|
16
|
+
|
17
|
+
// Basic font scaling based on a typography scale. Its not perfect, but hey its nice lookin.
|
18
|
+
// Scales h1-h6 and sets paragraphs.
|
19
|
+
@mixin font-scaling($base: $font-size, $scale: 24px 22px 20px 18px 16px 14px){
|
20
|
+
$offset:1.618;
|
21
|
+
$scale: compact($scale);
|
22
|
+
@for $i from 1 through 6 {
|
23
|
+
$sizing: floor((nth($scale, $i) * $offset) - ($base / $offset));
|
24
|
+
h#{$i}{ @include adjust-font-size-to($sizing, 1); @include margin-trailer(1, $sizing); }
|
25
|
+
}
|
26
|
+
p{ @include adjust-font-size-to($font-size); @include margin-trailer(1, $font-size); }
|
27
|
+
}
|
@@ -0,0 +1,43 @@
|
|
1
|
+
@import "compass/typography/lists/inline-block-list";
|
2
|
+
//
|
3
|
+
// Creates a pure CSS tool tip using border-styles
|
4
|
+
//
|
5
|
+
$tool-tip-color:#333 !default;
|
6
|
+
$tool-tip-text-color:#fff !default;
|
7
|
+
|
8
|
+
@mixin tool-tip($color: false, $dir: bl, $size: 7px, $text-color: $tool-tip-text-color){
|
9
|
+
$text-color: if($text-color, $text-color, if(luminance($color) == dark, #fff, #333) );
|
10
|
+
background:$color;
|
11
|
+
color:$text-color;
|
12
|
+
padding:.75em 1em;
|
13
|
+
position:relative;
|
14
|
+
@include inline-block;
|
15
|
+
|
16
|
+
&:after{
|
17
|
+
content:"";
|
18
|
+
display:block;
|
19
|
+
position:absolute;
|
20
|
+
width:0;
|
21
|
+
border-width:$size $size 0;
|
22
|
+
border-style:solid;
|
23
|
+
border-color:$color transparent;
|
24
|
+
border-color:inherit transparent;
|
25
|
+
@if( $dir == bl or $dir == br ){ bottom: -$size; }
|
26
|
+
@if( $dir == tl or $dir == tr ){ top: -$size; }
|
27
|
+
@if( $dir == tl or $dir == bl ){ left:1em; }
|
28
|
+
@if( $dir == tl or $dir == bl ){ right:1em; }
|
29
|
+
@if( $dir == left ){
|
30
|
+
left:-$size;
|
31
|
+
border-width:$size ($size * 1.8) $size 0;
|
32
|
+
}
|
33
|
+
@if( $dir == right ){
|
34
|
+
right:-$size;
|
35
|
+
border-width:$size 0 $size ($size * 1.8);
|
36
|
+
}
|
37
|
+
@if( $dir == right or $dir == left ){
|
38
|
+
top:50%;
|
39
|
+
margin-top:-$size;
|
40
|
+
border-color:transparent $color;
|
41
|
+
}
|
42
|
+
}
|
43
|
+
}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
#sitemap{ @include inline-block-list(0); text-align:center; width:100%; padding-top:25px;
|
2
|
+
ol{ margin:0; padding:0; @include clearfix; }
|
3
|
+
li{ vertical-align:top; margin:0 10px 15px 10px; }
|
4
|
+
li.single{ float:left !important;
|
5
|
+
ol{ text-align:left !important; padding-top:15px; margin:0 -10px;
|
6
|
+
li{ display:block !important; float:none !important; }
|
7
|
+
}
|
8
|
+
}
|
9
|
+
li.multi{ float:left;
|
10
|
+
ol{ white-space:nowrap; padding-top:15px; margin:0 -10px;
|
11
|
+
li{ float:left; }
|
12
|
+
}
|
13
|
+
}
|
14
|
+
a{ @include inline-block; margin:0px; padding:2px 15px; @include border-radius(3px); @include box-shadow(rgba(100,100,100,0.5), 2px, 2px, 1px, 0);
|
15
|
+
@include background(linear-gradient(top, #b2cd23, darken(#b2cd23, 7%))); border:2px solid darken(#b2cd23, 5%); color:white; text-decoration:none;
|
16
|
+
font-weight:bold; @include single-text-shadow(darken(#b2cd23, 15%), 1px, 1px, 1px);
|
17
|
+
}
|
18
|
+
}
|
data/lib/facades/version.rb
CHANGED
data/lib/facades.rb
CHANGED
@@ -7,12 +7,6 @@ module Facades
|
|
7
7
|
autoload :Html, 'facades/debug/html'
|
8
8
|
end
|
9
9
|
|
10
|
-
module Helpers
|
11
|
-
autoload :Layout, 'facades/helpers/layout'
|
12
|
-
autoload :Navigation, 'facades/helpers/navigation'
|
13
|
-
autoload :Elements, 'facades/helpers/elements'
|
14
|
-
end
|
15
|
-
|
16
10
|
mattr_accessor :enable_html5
|
17
11
|
mattr_accessor :debug_html
|
18
12
|
|
@@ -25,6 +19,7 @@ end
|
|
25
19
|
Facades.enable_html5 = true
|
26
20
|
Facades.debug_html = true
|
27
21
|
|
22
|
+
require 'facades/sass_ext'
|
28
23
|
require 'compass'
|
29
24
|
Compass::Frameworks.register('facades',
|
30
25
|
:stylesheets_directory => File.join(File.dirname(__FILE__), 'facades/stylesheets'),
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: facades
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.2
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,12 +9,12 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2011-
|
12
|
+
date: 2011-08-01 00:00:00.000000000 -04:00
|
13
13
|
default_executable:
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: sass
|
17
|
-
requirement: &
|
17
|
+
requirement: &70254468244960 !ruby/object:Gem::Requirement
|
18
18
|
none: false
|
19
19
|
requirements:
|
20
20
|
- - ~>
|
@@ -22,10 +22,10 @@ dependencies:
|
|
22
22
|
version: '3.1'
|
23
23
|
type: :runtime
|
24
24
|
prerelease: false
|
25
|
-
version_requirements: *
|
25
|
+
version_requirements: *70254468244960
|
26
26
|
- !ruby/object:Gem::Dependency
|
27
27
|
name: compass
|
28
|
-
requirement: &
|
28
|
+
requirement: &70254468244340 !ruby/object:Gem::Requirement
|
29
29
|
none: false
|
30
30
|
requirements:
|
31
31
|
- - ! '>='
|
@@ -33,7 +33,7 @@ dependencies:
|
|
33
33
|
version: '0.11'
|
34
34
|
type: :runtime
|
35
35
|
prerelease: false
|
36
|
-
version_requirements: *
|
36
|
+
version_requirements: *70254468244340
|
37
37
|
description: Facades includes various helpers, methods, and compass/sass mixins for
|
38
38
|
simplifying frontend development.
|
39
39
|
email:
|
@@ -51,15 +51,21 @@ files:
|
|
51
51
|
- lib/facades.rb
|
52
52
|
- lib/facades/debug/html.rb
|
53
53
|
- lib/facades/engine.rb
|
54
|
+
- lib/facades/helpers.rb
|
54
55
|
- lib/facades/helpers/elements.rb
|
55
56
|
- lib/facades/helpers/layout.rb
|
56
57
|
- lib/facades/helpers/navigation.rb
|
58
|
+
- lib/facades/sass_ext.rb
|
59
|
+
- lib/facades/sass_ext/form_elements.rb
|
57
60
|
- lib/facades/stylesheets/facades/_layout.scss
|
58
61
|
- lib/facades/stylesheets/facades/_reset.scss
|
59
|
-
- lib/facades/stylesheets/facades/
|
62
|
+
- lib/facades/stylesheets/facades/_ui.scss
|
63
|
+
- lib/facades/stylesheets/facades/_utilities.scss
|
60
64
|
- lib/facades/stylesheets/facades/layout/_forms.scss
|
61
65
|
- lib/facades/stylesheets/facades/layout/_grid.scss
|
62
66
|
- lib/facades/stylesheets/facades/typography/_rhythm.scss
|
67
|
+
- lib/facades/stylesheets/facades/ui/_tool-tip.scss
|
68
|
+
- lib/facades/stylesheets/facades/utilities/_site-map.scss
|
63
69
|
- lib/facades/version.rb
|
64
70
|
- spec/facades/helpers/elements_spec.rb
|
65
71
|
- spec/facades/helpers/layout_helpers_spec.rb
|
File without changes
|