scss-boilerplate-rails 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- data/.gitignore +15 -0
- data/.rvmrc +66 -0
- data/Gemfile +41 -0
- data/README.md +11 -0
- data/lib/generators/scss_boilerplate/install/USAGE +25 -0
- data/lib/generators/scss_boilerplate/install/install_generator.rb +18 -0
- data/lib/generators/scss_boilerplate/install/templates/base/chromeframe.css.scss +14 -0
- data/lib/generators/scss_boilerplate/install/templates/base/collections.css.scss +0 -0
- data/lib/generators/scss_boilerplate/install/templates/base/common.css.scss +40 -0
- data/lib/generators/scss_boilerplate/install/templates/base/document.css.scss +25 -0
- data/lib/generators/scss_boilerplate/install/templates/base/footers.css.scss +0 -0
- data/lib/generators/scss_boilerplate/install/templates/base/forms.css.scss +140 -0
- data/lib/generators/scss_boilerplate/install/templates/base/headers.css.scss +11 -0
- data/lib/generators/scss_boilerplate/install/templates/base/helpers.css.scss +173 -0
- data/lib/generators/scss_boilerplate/install/templates/base/image_replaces.css.scss +0 -0
- data/lib/generators/scss_boilerplate/install/templates/base/media_queries.css.scss +3 -0
- data/lib/generators/scss_boilerplate/install/templates/base/typography.css.scss +43 -0
- data/lib/generators/scss_boilerplate/install/templates/base/variables.css.scss +22 -0
- data/lib/generators/scss_boilerplate/install/templates/base.css.scss +24 -0
- data/lib/generators/scss_boilerplate/install/templates/config/compass.rb +18 -0
- data/lib/generators/scss_boilerplate/namespace/USAGE +8 -0
- data/lib/generators/scss_boilerplate/namespace/namespace_generator.rb +20 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/collections.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/common.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/containers.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/footers.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/forms.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/headers.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/helpers.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/image_replaces.css.scss +9 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/typography.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace/variables.css.scss +1 -0
- data/lib/generators/scss_boilerplate/namespace/templates/namespace.css.scss +13 -0
- data/scss-boilerplate-rails.gemspec +11 -0
- metadata +78 -0
data/.gitignore
ADDED
@@ -0,0 +1,15 @@
|
|
1
|
+
# See http://help.github.com/ignore-files/ for more about ignoring files.
|
2
|
+
#
|
3
|
+
# If you find yourself ignoring temporary files generated by your text editor
|
4
|
+
# or operating system, you probably want to add a global ignore instead:
|
5
|
+
# git config --global core.excludesfile ~/.gitignore_global
|
6
|
+
|
7
|
+
# Ignore bundler config
|
8
|
+
/.bundle
|
9
|
+
|
10
|
+
# Ignore the default SQLite database.
|
11
|
+
/db/*.sqlite3
|
12
|
+
|
13
|
+
# Ignore all logfiles and tempfiles.
|
14
|
+
/log/*.log
|
15
|
+
/tmp
|
data/.rvmrc
ADDED
@@ -0,0 +1,66 @@
|
|
1
|
+
#!/usr/bin/env bash
|
2
|
+
|
3
|
+
# This is an RVM Project .rvmrc file, used to automatically load the ruby
|
4
|
+
# development environment upon cd'ing into the directory
|
5
|
+
|
6
|
+
# First we specify our desired <ruby>[@<gemset>], the @gemset name is optional.
|
7
|
+
environment_id="ruby-1.9.3-p0@scss-boilerplate-rails"
|
8
|
+
|
9
|
+
#
|
10
|
+
# Uncomment following line if you want options to be set only for given project.
|
11
|
+
#
|
12
|
+
# PROJECT_JRUBY_OPTS=( --1.9 )
|
13
|
+
|
14
|
+
#
|
15
|
+
# First we attempt to load the desired environment directly from the environment
|
16
|
+
# file. This is very fast and efficient compared to running through the entire
|
17
|
+
# CLI and selector. If you want feedback on which environment was used then
|
18
|
+
# insert the word 'use' after --create as this triggers verbose mode.
|
19
|
+
#
|
20
|
+
if [[ -d "${rvm_path:-$HOME/.rvm}/environments" \
|
21
|
+
&& -s "${rvm_path:-$HOME/.rvm}/environments/$environment_id" ]]
|
22
|
+
then
|
23
|
+
\. "${rvm_path:-$HOME/.rvm}/environments/$environment_id"
|
24
|
+
|
25
|
+
if [[ -s "${rvm_path:-$HOME/.rvm}/hooks/after_use" ]]
|
26
|
+
then
|
27
|
+
. "${rvm_path:-$HOME/.rvm}/hooks/after_use"
|
28
|
+
fi
|
29
|
+
else
|
30
|
+
# If the environment file has not yet been created, use the RVM CLI to select.
|
31
|
+
if ! rvm --create "$environment_id"
|
32
|
+
then
|
33
|
+
echo "Failed to create RVM environment '${environment_id}'."
|
34
|
+
return 1
|
35
|
+
fi
|
36
|
+
fi
|
37
|
+
|
38
|
+
#
|
39
|
+
# If you use an RVM gemset file to install a list of gems (*.gems), you can have
|
40
|
+
# it be automatically loaded. Uncomment the following and adjust the filename if
|
41
|
+
# necessary.
|
42
|
+
#
|
43
|
+
# filename=".gems"
|
44
|
+
# if [[ -s "$filename" ]]
|
45
|
+
# then
|
46
|
+
# rvm gemset import "$filename" | grep -v already | grep -v listed | grep -v complete | sed '/^$/d'
|
47
|
+
# fi
|
48
|
+
|
49
|
+
# If you use bundler, this might be useful to you:
|
50
|
+
# if [[ -s Gemfile ]] && ! command -v bundle >/dev/null
|
51
|
+
# then
|
52
|
+
# printf "The rubygem 'bundler' is not installed. Installing it now.\n"
|
53
|
+
# gem install bundler
|
54
|
+
# fi
|
55
|
+
# if [[ -s Gemfile ]] && command -v bundle
|
56
|
+
# then
|
57
|
+
# bundle install
|
58
|
+
# fi
|
59
|
+
|
60
|
+
if [[ $- == *i* ]] # check for interactive shells
|
61
|
+
then
|
62
|
+
echo "Using: $(tput setaf 2)$GEM_HOME$(tput sgr0)" # show the user the ruby and gemset they are using in green
|
63
|
+
else
|
64
|
+
echo "Using: $GEM_HOME" # don't use colors in interactive shells
|
65
|
+
fi
|
66
|
+
|
data/Gemfile
ADDED
@@ -0,0 +1,41 @@
|
|
1
|
+
source 'https://rubygems.org'
|
2
|
+
|
3
|
+
gem 'rails', '3.2.1'
|
4
|
+
|
5
|
+
# Bundle edge Rails instead:
|
6
|
+
# gem 'rails', :git => 'git://github.com/rails/rails.git'
|
7
|
+
|
8
|
+
gem 'sqlite3'
|
9
|
+
|
10
|
+
|
11
|
+
# Gems used only for assets and not required
|
12
|
+
# in production environments by default.
|
13
|
+
group :assets do
|
14
|
+
gem 'sass-rails', '~> 3.2.3'
|
15
|
+
gem 'coffee-rails', '~> 3.2.1'
|
16
|
+
|
17
|
+
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
|
18
|
+
# gem 'therubyracer'
|
19
|
+
|
20
|
+
gem 'compass-rails'
|
21
|
+
gem 'compass-h5bp'
|
22
|
+
|
23
|
+
gem 'uglifier', '>= 1.0.3'
|
24
|
+
end
|
25
|
+
|
26
|
+
gem 'jquery-rails'
|
27
|
+
|
28
|
+
# To use ActiveModel has_secure_password
|
29
|
+
# gem 'bcrypt-ruby', '~> 3.0.0'
|
30
|
+
|
31
|
+
# To use Jbuilder templates for JSON
|
32
|
+
# gem 'jbuilder'
|
33
|
+
|
34
|
+
# Use unicorn as the web server
|
35
|
+
# gem 'unicorn'
|
36
|
+
|
37
|
+
# Deploy with Capistrano
|
38
|
+
# gem 'capistrano'
|
39
|
+
|
40
|
+
# To use debugger
|
41
|
+
# gem 'ruby-debug19', :require => 'ruby-debug'
|
data/README.md
ADDED
@@ -0,0 +1,25 @@
|
|
1
|
+
Description:
|
2
|
+
Generates a base partial structure
|
3
|
+
|
4
|
+
Example:
|
5
|
+
rails generate scss_boilerplate:base
|
6
|
+
|
7
|
+
This will create:
|
8
|
+
create config/compass.rb
|
9
|
+
create app/assets/stylesheets/base.css.scss
|
10
|
+
create app/assets/stylesheets/base
|
11
|
+
create app/assets/stylesheets/base/chromeframe.css.scss
|
12
|
+
create app/assets/stylesheets/base/collections.css.scss
|
13
|
+
create app/assets/stylesheets/base/common.css.scss
|
14
|
+
create app/assets/stylesheets/base/document.css.scss
|
15
|
+
create app/assets/stylesheets/base/footers.css.scss
|
16
|
+
create app/assets/stylesheets/base/forms.css.scss
|
17
|
+
create app/assets/stylesheets/base/headers.css.scss
|
18
|
+
create app/assets/stylesheets/base/helpers.css.scss
|
19
|
+
create app/assets/stylesheets/base/image_replaces.css.scss
|
20
|
+
create app/assets/stylesheets/base/media_queries.css.scss
|
21
|
+
create app/assets/stylesheets/base/typography.css.scss
|
22
|
+
create app/assets/stylesheets/base/variables.css.scss
|
23
|
+
create app/assets/stylesheets/application.css.scss
|
24
|
+
append app/assets/stylesheets/application.css.scss
|
25
|
+
|
@@ -0,0 +1,18 @@
|
|
1
|
+
module ScssBoilerplate
|
2
|
+
module Generators
|
3
|
+
class InstallGenerator < ::Rails::Generators::Base
|
4
|
+
source_root File.expand_path('../templates', __FILE__)
|
5
|
+
|
6
|
+
def generate_scss_install
|
7
|
+
template "config/compass.rb"
|
8
|
+
copy_file "base.css.scss", "app/assets/stylesheets/base.css.scss"
|
9
|
+
directory "base", "app/assets/stylesheets/base"
|
10
|
+
# add import to manifest
|
11
|
+
manifest = "app/assets/stylesheets/application.css.scss"
|
12
|
+
create_file manifest unless File.exists? manifest
|
13
|
+
append_to_file manifest, "\n@import \"base.css.scss\";"
|
14
|
+
end
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
// This file was generated by html5-rails
|
2
|
+
// https://github.com/sporkd/html5-rails
|
3
|
+
// Upgrade with: $ rails generate html5:install
|
4
|
+
|
5
|
+
//-----------------------------------------
|
6
|
+
// Chrome Frame prompt
|
7
|
+
//-----------------------------------------
|
8
|
+
|
9
|
+
.chromeframe {
|
10
|
+
margin: 0.2em 0;
|
11
|
+
background: #ccc;
|
12
|
+
color: black;
|
13
|
+
padding: 0.2em 0;
|
14
|
+
}
|
File without changes
|
@@ -0,0 +1,40 @@
|
|
1
|
+
/* Visual Elements */
|
2
|
+
img{
|
3
|
+
vertical-align:top;
|
4
|
+
}
|
5
|
+
.thumbnail{
|
6
|
+
overflow:hidden;
|
7
|
+
display:inline-block;
|
8
|
+
background-color:white;
|
9
|
+
border:1px solid #dddddd;
|
10
|
+
padding:1px;
|
11
|
+
}
|
12
|
+
.notice-message{
|
13
|
+
@include border-radius(10px);
|
14
|
+
background-color: #f2f2f2;
|
15
|
+
border: 1px solid #ccc;
|
16
|
+
color: #333;
|
17
|
+
|
18
|
+
font-weight: bold;
|
19
|
+
margin-bottom: 10px;
|
20
|
+
margin-top: 10px;
|
21
|
+
padding: 10px;
|
22
|
+
}
|
23
|
+
.alert-message{
|
24
|
+
@extend .notice-message;
|
25
|
+
background-color: #FFA5A5;
|
26
|
+
border-color:#993333;
|
27
|
+
color: #993333;
|
28
|
+
}
|
29
|
+
.warning-message{
|
30
|
+
@extend .notice-message;
|
31
|
+
background-color: #FAFAD2;
|
32
|
+
border-color:#BC8E19;
|
33
|
+
color: #BC8E19;
|
34
|
+
}
|
35
|
+
.success-message{
|
36
|
+
@extend .notice-message;
|
37
|
+
background-color:#BDEDB6;
|
38
|
+
border-color:#264421;
|
39
|
+
color: #264421;
|
40
|
+
}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
html{
|
2
|
+
|
3
|
+
}
|
4
|
+
body{
|
5
|
+
|
6
|
+
}
|
7
|
+
#container{
|
8
|
+
width:100%;
|
9
|
+
max-width:$width-container;
|
10
|
+
margin:20px auto;
|
11
|
+
background:#fff;
|
12
|
+
@include border-radius(10px);
|
13
|
+
@include box-shadow(#ccc, 1px);
|
14
|
+
}
|
15
|
+
#main{
|
16
|
+
overflow:auto;
|
17
|
+
}
|
18
|
+
section.main{
|
19
|
+
.inner-section-main{
|
20
|
+
padding:20px;
|
21
|
+
}
|
22
|
+
}
|
23
|
+
aside.main{
|
24
|
+
float:left;
|
25
|
+
}
|
File without changes
|
@@ -0,0 +1,140 @@
|
|
1
|
+
.rockhil-form{
|
2
|
+
.field{
|
3
|
+
overflow:auto;
|
4
|
+
border-bottom:1px solid #ddd;
|
5
|
+
padding-bottom:10px;
|
6
|
+
|
7
|
+
.field-describe{
|
8
|
+
width:30%;
|
9
|
+
float:left;
|
10
|
+
}
|
11
|
+
.field-request{
|
12
|
+
float:left;
|
13
|
+
width:70%;
|
14
|
+
}
|
15
|
+
&:last-child{
|
16
|
+
border-bottom:0;
|
17
|
+
padding-bottom:0;
|
18
|
+
}
|
19
|
+
}
|
20
|
+
|
21
|
+
.field-request{
|
22
|
+
overflow:hidden;
|
23
|
+
}
|
24
|
+
/* Form Element Description */
|
25
|
+
.field-describe{
|
26
|
+
padding-top:10px;
|
27
|
+
padding-bottom:10px;
|
28
|
+
overflow:hidden;
|
29
|
+
.field-describe-detail{
|
30
|
+
background:#f2f2f2;
|
31
|
+
padding:4px;
|
32
|
+
margin-right:10px;
|
33
|
+
margin-top:4px;
|
34
|
+
line-height:15px;
|
35
|
+
font-weight:normal;
|
36
|
+
}
|
37
|
+
span.field-describe-detail{
|
38
|
+
margin-left:6px;
|
39
|
+
}
|
40
|
+
.field_with_errors{
|
41
|
+
display:inline;
|
42
|
+
background:#FFA5A5;
|
43
|
+
}
|
44
|
+
}
|
45
|
+
|
46
|
+
.field-checkbox{
|
47
|
+
.field-describe{
|
48
|
+
padding-top:0px;
|
49
|
+
padding-bottom:0px;
|
50
|
+
width:92%;
|
51
|
+
}
|
52
|
+
.field-request{
|
53
|
+
vertical-align:middle;
|
54
|
+
width:8%;
|
55
|
+
text-align:center;
|
56
|
+
}
|
57
|
+
}
|
58
|
+
.field-text{
|
59
|
+
input{
|
60
|
+
padding:10px;
|
61
|
+
border:1px solid #ddd;
|
62
|
+
background-color:#f4f4f4;
|
63
|
+
width:60%;
|
64
|
+
}
|
65
|
+
}
|
66
|
+
.field-file{
|
67
|
+
|
68
|
+
}
|
69
|
+
.field-textarea{
|
70
|
+
textarea{
|
71
|
+
width:90%;
|
72
|
+
height:140px;
|
73
|
+
padding:10px;
|
74
|
+
border:1px solid #ddd;
|
75
|
+
background-color:#f4f4f4;
|
76
|
+
}
|
77
|
+
}
|
78
|
+
.field-select{
|
79
|
+
|
80
|
+
}
|
81
|
+
/* Contains Form Submits and Buttons */
|
82
|
+
.field-actions,
|
83
|
+
&.field-actions{
|
84
|
+
input,a{
|
85
|
+
padding: 10px;
|
86
|
+
background-color: $link-color;
|
87
|
+
color: #ffffff;
|
88
|
+
font-weight: bold;
|
89
|
+
border:none;
|
90
|
+
@include border-radius(10px);
|
91
|
+
&:hover{
|
92
|
+
cursor:pointer;
|
93
|
+
}
|
94
|
+
}
|
95
|
+
a{
|
96
|
+
display:inline-block;
|
97
|
+
padding:10px;
|
98
|
+
text-decoration:none;
|
99
|
+
}
|
100
|
+
}
|
101
|
+
/* Labels generated by jQuery validation error */
|
102
|
+
label.error{
|
103
|
+
clear:both;
|
104
|
+
display:block;
|
105
|
+
display:inline-block;
|
106
|
+
background-color: #F4B5B6;
|
107
|
+
font-size: 11px;
|
108
|
+
padding: 10px;
|
109
|
+
margin: 10px;
|
110
|
+
border: 1px solid #A81015;
|
111
|
+
@include border-radius(10px);
|
112
|
+
}
|
113
|
+
/* Contains validation errors */
|
114
|
+
.field-errors{
|
115
|
+
background-color: #FFA5A5;
|
116
|
+
border: 2px solid #A40000;
|
117
|
+
padding: 10px;
|
118
|
+
@include border-radius(10px);
|
119
|
+
ul{
|
120
|
+
li{
|
121
|
+
list-style-type:disc;
|
122
|
+
margin-left: 20px;
|
123
|
+
}
|
124
|
+
}
|
125
|
+
}
|
126
|
+
/* Contains a series of field-fields */
|
127
|
+
.field-group{
|
128
|
+
border:1px solid #dddddd;
|
129
|
+
border-left:10px solid #dddddd;
|
130
|
+
margin-left:10px;
|
131
|
+
padding: 10px;
|
132
|
+
}
|
133
|
+
.field-header{
|
134
|
+
.field-describe{
|
135
|
+
@extend h3;
|
136
|
+
width:100%;
|
137
|
+
float:none;
|
138
|
+
}
|
139
|
+
}
|
140
|
+
}
|
@@ -0,0 +1,173 @@
|
|
1
|
+
/**************************************************************
|
2
|
+
|
3
|
+
@include list-reset(margin, orientation)
|
4
|
+
-
|
5
|
+
Reset a list and force the list items to float left.
|
6
|
+
|
7
|
+
**************************************************************/
|
8
|
+
|
9
|
+
@mixin list-reset()
|
10
|
+
{
|
11
|
+
list-style:none;
|
12
|
+
vertical-align:top;
|
13
|
+
margin:0;
|
14
|
+
padding:0;
|
15
|
+
overflow:auto;
|
16
|
+
li{
|
17
|
+
padding:0;
|
18
|
+
margin:0;
|
19
|
+
}
|
20
|
+
}
|
21
|
+
|
22
|
+
/**************************************************************
|
23
|
+
|
24
|
+
@include list-float(margin, orientation)
|
25
|
+
-
|
26
|
+
Reset a list and force the list items to float left.
|
27
|
+
|
28
|
+
**************************************************************/
|
29
|
+
|
30
|
+
@mixin list-float()
|
31
|
+
{
|
32
|
+
@include list-reset();
|
33
|
+
li{
|
34
|
+
float:left;
|
35
|
+
}
|
36
|
+
}
|
37
|
+
|
38
|
+
|
39
|
+
/**************************************************************
|
40
|
+
|
41
|
+
@include image-replace(image-name, file-extension);
|
42
|
+
-
|
43
|
+
Replace the element with this image
|
44
|
+
|
45
|
+
**************************************************************/
|
46
|
+
@mixin image-replace($name, $ext: png)
|
47
|
+
{
|
48
|
+
@include sized-background-image($name, $ext);
|
49
|
+
display:block;
|
50
|
+
text-indent:-9999px;
|
51
|
+
text-align:left;
|
52
|
+
border:0;
|
53
|
+
}
|
54
|
+
|
55
|
+
/**************************************************************
|
56
|
+
|
57
|
+
@include image-replace-auto(image, hover-image, ext)
|
58
|
+
-
|
59
|
+
Replace the element with this image.
|
60
|
+
Automatically generate a css class based on the image name.
|
61
|
+
|
62
|
+
**************************************************************/
|
63
|
+
@mixin image-replace-auto($name, $ext: png)
|
64
|
+
{
|
65
|
+
.#{$name},
|
66
|
+
.#{$name}.active:hover {
|
67
|
+
@include image-replace($name, $ext);
|
68
|
+
}
|
69
|
+
input.#{$name} {
|
70
|
+
cursor:pointer;
|
71
|
+
}
|
72
|
+
}
|
73
|
+
|
74
|
+
/**************************************************************
|
75
|
+
|
76
|
+
@include image-bullet(image-name, image-position, file-extension);
|
77
|
+
-
|
78
|
+
Position an image the left or right of an element.
|
79
|
+
|
80
|
+
**************************************************************/
|
81
|
+
@mixin image-bullet($name, $align:left, $ext: png)
|
82
|
+
{
|
83
|
+
$filename: '#{$name}.#{$ext}';
|
84
|
+
|
85
|
+
display:block;
|
86
|
+
border:0;
|
87
|
+
background:image-url($filename) no-repeat scroll $align center transparent;
|
88
|
+
@include min-height(image-height( $filename ) - image-height( $filename ) / 4 );
|
89
|
+
padding-top:image-height( $filename ) / 4;
|
90
|
+
padding-#{$align}:image-width( $filename ) + 5px;
|
91
|
+
|
92
|
+
@if $align == right{
|
93
|
+
float:right;
|
94
|
+
}
|
95
|
+
}
|
96
|
+
|
97
|
+
/**************************************************************
|
98
|
+
|
99
|
+
@include image-bullet-auto(image-name, image-position, file-extension);
|
100
|
+
-
|
101
|
+
Position an image the left or right of an element.
|
102
|
+
Automatically generate a css class based on the image name.
|
103
|
+
|
104
|
+
**************************************************************/
|
105
|
+
@mixin image-bullet-auto($name, $align:left, $ext: png)
|
106
|
+
{
|
107
|
+
.#{$name} {
|
108
|
+
@include image-bullet($name, $align, $ext);
|
109
|
+
}
|
110
|
+
}
|
111
|
+
|
112
|
+
/**************************************************************
|
113
|
+
|
114
|
+
@include sized-background-image(image-name, file-extension);
|
115
|
+
-
|
116
|
+
Set the backgroud image and determine the width & height.
|
117
|
+
|
118
|
+
**************************************************************/
|
119
|
+
@mixin sized-background-image($name, $ext: png)
|
120
|
+
{
|
121
|
+
$filename: '#{$name}.#{$ext}';
|
122
|
+
background:image-url($filename) top left no-repeat transparent;
|
123
|
+
width:image-width($filename);
|
124
|
+
height:image-height($filename);
|
125
|
+
}
|
126
|
+
|
127
|
+
|
128
|
+
|
129
|
+
/**************************************************************
|
130
|
+
|
131
|
+
@include sprite-replace(image-name, number-of-sprites, file-extension);
|
132
|
+
-
|
133
|
+
Replace the element with this sprite sheet image
|
134
|
+
|
135
|
+
**************************************************************/
|
136
|
+
@mixin sprite-replace($name, $count: 2, $ext: png)
|
137
|
+
{
|
138
|
+
$filename: '#{$name}.#{$ext}';
|
139
|
+
$height: image-height($filename) / $count;
|
140
|
+
width:image-width($filename) !important;
|
141
|
+
height:$height !important;
|
142
|
+
display:block;
|
143
|
+
text-indent:-9999px;
|
144
|
+
overflow:hidden;
|
145
|
+
text-align:left;
|
146
|
+
border:0;
|
147
|
+
background:image-url($filename) no-repeat scroll top left transparent;
|
148
|
+
padding:0px !important;
|
149
|
+
margin:0px;
|
150
|
+
&:hover,
|
151
|
+
&.active,
|
152
|
+
&.second-state{
|
153
|
+
background-position:0 ($height * -1);
|
154
|
+
}
|
155
|
+
@if $count >= 3{
|
156
|
+
&.third-state{
|
157
|
+
background-position:0 ($height * 2 * -1);
|
158
|
+
}
|
159
|
+
}
|
160
|
+
@if $count >= 4{
|
161
|
+
&.fourth-state{
|
162
|
+
background-position:0 ($height * 3 * -1);
|
163
|
+
}
|
164
|
+
}
|
165
|
+
}
|
166
|
+
|
167
|
+
@mixin sprite-replace-auto($name, $count: 2, $ext: png, $path: '')
|
168
|
+
{
|
169
|
+
$filename: '#{$path}/#{$name}';
|
170
|
+
.#{$name}{
|
171
|
+
@include sprite-replace($filename, $count, $ext);
|
172
|
+
}
|
173
|
+
}
|
File without changes
|
@@ -0,0 +1,43 @@
|
|
1
|
+
/* Text */
|
2
|
+
h1{
|
3
|
+
font-size:30px;
|
4
|
+
line-height:30px;
|
5
|
+
}
|
6
|
+
h2{
|
7
|
+
font-size:24px;
|
8
|
+
line-height:24px;
|
9
|
+
}
|
10
|
+
h3{
|
11
|
+
font-size:18px;
|
12
|
+
line-height:18px;
|
13
|
+
}
|
14
|
+
h4{
|
15
|
+
font-size:16px;
|
16
|
+
line-height:16px;
|
17
|
+
}
|
18
|
+
h5{
|
19
|
+
font-size:14px;
|
20
|
+
line-height:14px;
|
21
|
+
}
|
22
|
+
body{
|
23
|
+
font-family:$font-family;
|
24
|
+
color:$font-color;
|
25
|
+
font-size:$font-size;
|
26
|
+
line-height:$font-size + 6px;
|
27
|
+
}
|
28
|
+
strong{
|
29
|
+
font-weight:bold;
|
30
|
+
}
|
31
|
+
small{
|
32
|
+
font-size:11px;
|
33
|
+
font-weight:bold;
|
34
|
+
}
|
35
|
+
a,
|
36
|
+
a:active,
|
37
|
+
a:visited{
|
38
|
+
color:$link-color;
|
39
|
+
text-decoration:none;
|
40
|
+
&:hover{
|
41
|
+
text-decoration:underline;
|
42
|
+
}
|
43
|
+
}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
// This file was generated by html5-rails
|
2
|
+
// https://github.com/sporkd/html5-rails
|
3
|
+
// Upgrade with: $ rails generate html5:install
|
4
|
+
//
|
5
|
+
// These global SCSS(SASS) variables will be
|
6
|
+
// available to all your stylesheets.
|
7
|
+
|
8
|
+
//----------------------------------------------
|
9
|
+
// Html5 Boilerplate overrides
|
10
|
+
//----------------------------------------------
|
11
|
+
$line-height: 1.4; // 1.4 for true normalization
|
12
|
+
$font-color: #222;
|
13
|
+
$font-family: sans-serif;
|
14
|
+
$font-size: 13px;
|
15
|
+
$link-color: #00e;
|
16
|
+
$link-hover-color: #06e;
|
17
|
+
$link-visited-color: #551a8b;
|
18
|
+
$selected-font-color: #fff;
|
19
|
+
$selected-background-color: #0d2177;
|
20
|
+
$invalid-background-color: #f0dddd;
|
21
|
+
|
22
|
+
$width-container:960px;
|
@@ -0,0 +1,24 @@
|
|
1
|
+
/* Variables */
|
2
|
+
@import "base/variables";
|
3
|
+
|
4
|
+
/* CSS3 Compass Helpers */
|
5
|
+
@import "compass/css3";
|
6
|
+
|
7
|
+
/* Reset & Helpers */
|
8
|
+
@import "h5bp";
|
9
|
+
@include h5bp-normalize;
|
10
|
+
@include h5bp-helpers;
|
11
|
+
@include h5bp-media;
|
12
|
+
|
13
|
+
/* Base */
|
14
|
+
@import "base/helpers";
|
15
|
+
@import "base/chromeframe";
|
16
|
+
@import "base/typography";
|
17
|
+
@import "base/image_replaces";
|
18
|
+
@import "base/collections";
|
19
|
+
@import "base/document";
|
20
|
+
@import "base/headers";
|
21
|
+
@import "base/footers";
|
22
|
+
@import "base/common";
|
23
|
+
@import "base/forms";
|
24
|
+
@import "base/media_queries";
|
@@ -0,0 +1,18 @@
|
|
1
|
+
# This configuration file works with both the Compass command line tool and within Rails.
|
2
|
+
require 'compass/h5bp'
|
3
|
+
|
4
|
+
# Require any additional compass plugins here.
|
5
|
+
|
6
|
+
project_type = :rails
|
7
|
+
|
8
|
+
# Set this to the root of your project when deployed:
|
9
|
+
http_path = "/"
|
10
|
+
|
11
|
+
# You can select your preferred output style here (can be overridden via the command line):
|
12
|
+
output_style = :compact# or :compressed
|
13
|
+
|
14
|
+
# To enable relative paths to assets via compass helper functions. Uncomment:
|
15
|
+
# relative_assets = true
|
16
|
+
|
17
|
+
# To disable debugging comments that display the original location of your selectors. Uncomment:
|
18
|
+
line_comments = false
|
@@ -0,0 +1,20 @@
|
|
1
|
+
module ScssBoilerplate
|
2
|
+
module Generators
|
3
|
+
class NamespaceGenerator < ::Rails::Generators::Base
|
4
|
+
source_root File.expand_path('../templates', __FILE__)
|
5
|
+
|
6
|
+
argument :namespace, :type => :string, :default => "application"
|
7
|
+
|
8
|
+
def generate_namespace
|
9
|
+
# create namespace
|
10
|
+
template "namespace.css.scss", "app/assets/stylesheets/#{namespace}.css.scss"
|
11
|
+
directory "namespace", "app/assets/stylesheets/#{namespace}"
|
12
|
+
# add import to manifest
|
13
|
+
manifest = "app/assets/stylesheets/application.css.scss"
|
14
|
+
create_file manifest unless File.exists? manifest
|
15
|
+
append_to_file manifest, "\n@import \"#{namespace}.css.scss\";"
|
16
|
+
end
|
17
|
+
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Collections of records [ ul.collection-namespace ] */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Common Styles */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Containers ( .contains-namespace ) */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Footers ( footer.namespace ) */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Forms ( form.namespace) */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Headers ( header.namespace ) */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Mixins */
|
@@ -0,0 +1,9 @@
|
|
1
|
+
/*
|
2
|
+
Image Replacements. Helper mixins:
|
3
|
+
-
|
4
|
+
@include image-replace(image, ext);
|
5
|
+
@include image-replace-auto(image, ext)
|
6
|
+
@include image-bullet(image, align, ext);
|
7
|
+
@include image-bullet-auto(image, align, ext);
|
8
|
+
@include sprite-replace(image, count, ext)
|
9
|
+
*/
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Typographical ( .namespace h1 ) */
|
@@ -0,0 +1 @@
|
|
1
|
+
/* Variables shared between this namespace */
|
@@ -0,0 +1,13 @@
|
|
1
|
+
/* --------------------------- */
|
2
|
+
/* Styles for <%= namespace %> */
|
3
|
+
/* --------------------------- */
|
4
|
+
@import "<%= namespace %>/variables";
|
5
|
+
@import "<%= namespace %>/helpers";
|
6
|
+
@import "<%= namespace %>/typography";
|
7
|
+
@import "<%= namespace %>/image_replaces";
|
8
|
+
@import "<%= namespace %>/common";
|
9
|
+
@import "<%= namespace %>/headers";
|
10
|
+
@import "<%= namespace %>/footers";
|
11
|
+
@import "<%= namespace %>/containers";
|
12
|
+
@import "<%= namespace %>/collections";
|
13
|
+
@import "<%= namespace %>/forms";
|
@@ -0,0 +1,11 @@
|
|
1
|
+
Gem::Specification.new do |s|
|
2
|
+
s.name = 'scss-boilerplate-rails'
|
3
|
+
s.version = '0.1.0'
|
4
|
+
s.date = '2012-04-02'
|
5
|
+
s.summary = "Rails support for scss-boilerplate."
|
6
|
+
s.description = "Generate scss partials with a namespace."
|
7
|
+
s.authors = ["Blake Hilscher"]
|
8
|
+
s.email = 'blake@hilscher.ca'
|
9
|
+
s.files = `git ls-files`.split("\n")
|
10
|
+
s.homepage = 'http://blake.hilscher.ca/'
|
11
|
+
end
|
metadata
ADDED
@@ -0,0 +1,78 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: scss-boilerplate-rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.1.0
|
5
|
+
prerelease:
|
6
|
+
platform: ruby
|
7
|
+
authors:
|
8
|
+
- Blake Hilscher
|
9
|
+
autorequire:
|
10
|
+
bindir: bin
|
11
|
+
cert_chain: []
|
12
|
+
date: 2012-04-02 00:00:00.000000000 Z
|
13
|
+
dependencies: []
|
14
|
+
description: Generate scss partials with a namespace.
|
15
|
+
email: blake@hilscher.ca
|
16
|
+
executables: []
|
17
|
+
extensions: []
|
18
|
+
extra_rdoc_files: []
|
19
|
+
files:
|
20
|
+
- .gitignore
|
21
|
+
- .rvmrc
|
22
|
+
- Gemfile
|
23
|
+
- README.md
|
24
|
+
- lib/generators/scss_boilerplate/install/USAGE
|
25
|
+
- lib/generators/scss_boilerplate/install/install_generator.rb
|
26
|
+
- lib/generators/scss_boilerplate/install/templates/base.css.scss
|
27
|
+
- lib/generators/scss_boilerplate/install/templates/base/chromeframe.css.scss
|
28
|
+
- lib/generators/scss_boilerplate/install/templates/base/collections.css.scss
|
29
|
+
- lib/generators/scss_boilerplate/install/templates/base/common.css.scss
|
30
|
+
- lib/generators/scss_boilerplate/install/templates/base/document.css.scss
|
31
|
+
- lib/generators/scss_boilerplate/install/templates/base/footers.css.scss
|
32
|
+
- lib/generators/scss_boilerplate/install/templates/base/forms.css.scss
|
33
|
+
- lib/generators/scss_boilerplate/install/templates/base/headers.css.scss
|
34
|
+
- lib/generators/scss_boilerplate/install/templates/base/helpers.css.scss
|
35
|
+
- lib/generators/scss_boilerplate/install/templates/base/image_replaces.css.scss
|
36
|
+
- lib/generators/scss_boilerplate/install/templates/base/media_queries.css.scss
|
37
|
+
- lib/generators/scss_boilerplate/install/templates/base/typography.css.scss
|
38
|
+
- lib/generators/scss_boilerplate/install/templates/base/variables.css.scss
|
39
|
+
- lib/generators/scss_boilerplate/install/templates/config/compass.rb
|
40
|
+
- lib/generators/scss_boilerplate/namespace/USAGE
|
41
|
+
- lib/generators/scss_boilerplate/namespace/namespace_generator.rb
|
42
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace.css.scss
|
43
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/collections.css.scss
|
44
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/common.css.scss
|
45
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/containers.css.scss
|
46
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/footers.css.scss
|
47
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/forms.css.scss
|
48
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/headers.css.scss
|
49
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/helpers.css.scss
|
50
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/image_replaces.css.scss
|
51
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/typography.css.scss
|
52
|
+
- lib/generators/scss_boilerplate/namespace/templates/namespace/variables.css.scss
|
53
|
+
- scss-boilerplate-rails.gemspec
|
54
|
+
homepage: http://blake.hilscher.ca/
|
55
|
+
licenses: []
|
56
|
+
post_install_message:
|
57
|
+
rdoc_options: []
|
58
|
+
require_paths:
|
59
|
+
- lib
|
60
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
61
|
+
none: false
|
62
|
+
requirements:
|
63
|
+
- - ! '>='
|
64
|
+
- !ruby/object:Gem::Version
|
65
|
+
version: '0'
|
66
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
67
|
+
none: false
|
68
|
+
requirements:
|
69
|
+
- - ! '>='
|
70
|
+
- !ruby/object:Gem::Version
|
71
|
+
version: '0'
|
72
|
+
requirements: []
|
73
|
+
rubyforge_project:
|
74
|
+
rubygems_version: 1.8.10
|
75
|
+
signing_key:
|
76
|
+
specification_version: 3
|
77
|
+
summary: Rails support for scss-boilerplate.
|
78
|
+
test_files: []
|