compass-boilerplate-plugin 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1 @@
1
+ pkg/
@@ -0,0 +1,64 @@
1
+ = Compass Boilerplate Plugin
2
+
3
+ Lightweight HTML5 boilerplate (http://html5boilerplate.com/) plug-in for
4
+ Compass (http://compass-style.org/). It contains only the pure SCSS (SASS)
5
+ definitions.
6
+
7
+ For a full stack (including Javascript files & Rails helpers) please see
8
+ http://github.com/sporkd/compass-html5-boilerplate.
9
+
10
+ == Installation
11
+
12
+ Bundled:
13
+
14
+ # Add the line below to your Gemfile
15
+ gem "compass-boilerplate-plugin", :require => "compass_boilerplate"
16
+
17
+ As a simple Gem:
18
+
19
+ gem install compass-boilerplate-plugin
20
+
21
+ == Usage
22
+
23
+ Basic SASS example (app/stylesheets/all.sass):
24
+
25
+ // Reset everything
26
+ @import boilerplate/reset
27
+
28
+ // Import boilerplate
29
+ @import boilerplate
30
+
31
+ // Override variables (see _base.scss for full list of options)
32
+ $font_family: Georgia, serif;
33
+ $font_size: 14px;
34
+ $link_color: #036 !default;
35
+ $link_hover_color: #000 !default;
36
+
37
+ // Include all boilerplate definitions
38
+ +boilerplate
39
+
40
+ // Include boilerplate's print definitions inline (within @media print { ... })
41
+ +boilerplate-print-inline
42
+
43
+ == License
44
+
45
+ (The MIT License)
46
+
47
+ Permission is hereby granted, free of charge, to any person obtaining
48
+ a copy of this software and associated documentation files (the
49
+ 'Software'), to deal in the Software without restriction, including
50
+ without limitation the rights to use, copy, modify, merge, publish,
51
+ distribute, sublicense, and/or sell copies of the Software, and to
52
+ permit persons to whom the Software is furnished to do so, subject to
53
+ the following conditions:
54
+
55
+ The above copyright notice and this permission notice shall be
56
+ included in all copies or substantial portions of the Software.
57
+
58
+ THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
59
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
60
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
61
+ IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
62
+ CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
63
+ TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
64
+ SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
@@ -0,0 +1,20 @@
1
+ $: << File.join(File.dirname(__FILE__), "lib")
2
+
3
+ require 'rubygems'
4
+ require 'rake'
5
+
6
+ begin
7
+ require 'jeweler'
8
+ Jeweler::Tasks.new do |gemspec|
9
+ gemspec.name = "compass-boilerplate-plugin"
10
+ gemspec.summary = "HTML5 boileplate plugin for Compass"
11
+ gemspec.description = "Lightweight - contains only the pure SCSS (SASS) definitions"
12
+ gemspec.email = "dimitrij@blacksquaremedia.com"
13
+ gemspec.homepage = "http://github.com/bsm/compass-boilerplate-plugin"
14
+ gemspec.authors = ["Dimitrij Denissenko"]
15
+ gemspec.add_runtime_dependency "compass"
16
+ end
17
+ Jeweler::GemcutterTasks.new
18
+ rescue LoadError
19
+ puts "Jeweler not available. Install it with: gem install jeweler"
20
+ end
data/VERSION ADDED
@@ -0,0 +1 @@
1
+ 0.1.0
@@ -0,0 +1,54 @@
1
+ # Generated by jeweler
2
+ # DO NOT EDIT THIS FILE DIRECTLY
3
+ # Instead, edit Jeweler::Tasks in Rakefile, and run the gemspec command
4
+ # -*- encoding: utf-8 -*-
5
+
6
+ Gem::Specification.new do |s|
7
+ s.name = %q{compass-boilerplate-plugin}
8
+ s.version = "0.1.0"
9
+
10
+ s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
11
+ s.authors = ["Dimitrij Denissenko"]
12
+ s.date = %q{2010-09-21}
13
+ s.description = %q{Lightweight - contains only the pure SCSS (SASS) definitions}
14
+ s.email = %q{dimitrij@blacksquaremedia.com}
15
+ s.extra_rdoc_files = [
16
+ "README.rdoc"
17
+ ]
18
+ s.files = [
19
+ ".gitignore",
20
+ "README.rdoc",
21
+ "Rakefile",
22
+ "VERSION",
23
+ "compass-boilerplate-plugin.gemspec",
24
+ "init.rb",
25
+ "lib/compass_boilerplate.rb",
26
+ "stylesheets/_boilerplate.scss",
27
+ "stylesheets/boilerplate/_advanced.scss",
28
+ "stylesheets/boilerplate/_base.scss",
29
+ "stylesheets/boilerplate/_helpers.scss",
30
+ "stylesheets/boilerplate/_print.scss",
31
+ "stylesheets/boilerplate/_reset.scss",
32
+ "stylesheets/boilerplate/_typography.scss",
33
+ "stylesheets/boilerplate/reset/_utilities.scss"
34
+ ]
35
+ s.homepage = %q{http://github.com/bsm/compass-boilerplate-plugin}
36
+ s.rdoc_options = ["--charset=UTF-8"]
37
+ s.require_paths = ["lib"]
38
+ s.rubygems_version = %q{1.3.7}
39
+ s.summary = %q{HTML5 boileplate plugin for Compass}
40
+
41
+ if s.respond_to? :specification_version then
42
+ current_version = Gem::Specification::CURRENT_SPECIFICATION_VERSION
43
+ s.specification_version = 3
44
+
45
+ if Gem::Version.new(Gem::VERSION) >= Gem::Version.new('1.2.0') then
46
+ s.add_runtime_dependency(%q<compass>, [">= 0"])
47
+ else
48
+ s.add_dependency(%q<compass>, [">= 0"])
49
+ end
50
+ else
51
+ s.add_dependency(%q<compass>, [">= 0"])
52
+ end
53
+ end
54
+
data/init.rb ADDED
@@ -0,0 +1 @@
1
+ require 'compass_boilerplate'
@@ -0,0 +1,2 @@
1
+ require 'compass'
2
+ Compass::Frameworks.register("boilerplate", :path => "#{File.dirname(__FILE__)}/..")
@@ -0,0 +1,16 @@
1
+ @import "boilerplate/typography";
2
+ @import "boilerplate/helpers";
3
+ @import "boilerplate/advanced";
4
+ @import "boilerplate/print";
5
+
6
+ @mixin boilerplate {
7
+ @include boilerplate-typography;
8
+ @include boilerplate-helpers;
9
+ @include boilerplate-advanced;
10
+ }
11
+
12
+ @mixin boilerplate-print-inline {
13
+ @media print {
14
+ @include boilerplate-print;
15
+ }
16
+ }
@@ -0,0 +1,39 @@
1
+ @import "compass/utilities/general/float";
2
+ @import "compass/utilities/text/nowrap";
3
+
4
+ /* More semantic classes. Example:
5
+ * h1 { @extend .large; @extend .caps; }
6
+ */
7
+ @mixin boilerplate-advanced {
8
+
9
+ .huge { font-size: 2em; letter-spacing: -1px; font-weight: bold; }
10
+ .large { font-size: 1.3em; }
11
+ .big { font-size: 1.1em; }
12
+ .small { font-size: 0.75em; }
13
+ .tiny { font-size: 0.65em; }
14
+
15
+ .normal { font-family: $font_family; }
16
+ .fixed { font-family: $font_family_fixed; }
17
+ .quiet { color: $quiet_color; }
18
+ .loud { color: $loud_color; }
19
+ .header { color: $header_color; }
20
+ .strong { font-weight: bold; }
21
+ .italic { font-style: italic; }
22
+ .caps { text-transform: uppercase; }
23
+
24
+ .right { text-align: right; }
25
+ .center { text-align: center; }
26
+ .middle { vertical-align: middle; }
27
+
28
+ .block { display: block; }
29
+ .inline { display: inline; }
30
+ .none { display: none; }
31
+ .nowrap { @include nowrap; }
32
+ .handle { cursor: pointer; }
33
+ .clear { clear: both; }
34
+
35
+ .float-l { @include float-left; }
36
+ .float-r { @include float-right; }
37
+ .bottom { margin-bottom: 0; }
38
+
39
+ }
@@ -0,0 +1,28 @@
1
+ $font_family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", "Bitstream Vera Sans", sans-serif !default;
2
+ $font_family_fixed: monospace, sans-serif !default;
3
+
4
+ $font_size: 13px !default;
5
+ $line_height: 1.231 !default;
6
+
7
+ $font_color: #444444 !default;
8
+ $link_color: #607890 !default;
9
+ $link_hover_color: #003366 !default;
10
+
11
+ $selection_color: #FFFFFF !default;
12
+ $selection_bg_color: #FF5E99 !default;
13
+
14
+ $error_color: #FF0000 !default;
15
+ $error_bg_color: #F0DDDD !default;
16
+
17
+ $added_color: #000000 !default;
18
+ $added_bg_color: #FFFF99 !default;
19
+
20
+ $highlight_color: $added_color !default;
21
+ $highlight_bg_color: $added_bg_color !default;
22
+
23
+ $quiet_color: $font_color + #333333 !default;
24
+ $loud_color: $font_color - #444444 !default;
25
+ $header_color: $font_color - #111111 !default;
26
+
27
+ $border_color: #CCCCCC !default;
28
+ $border_color_print: $border_color - #333333 !default;
@@ -0,0 +1,29 @@
1
+ @mixin boilerplate-helpers {
2
+
3
+ /*
4
+ * Non-semantic helper classes
5
+ */
6
+
7
+ /* for image replacement */
8
+ .ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
9
+
10
+ /* Hide for both screenreaders and browsers
11
+ css-discuss.incutio.com/wiki/Screenreader_Visibility */
12
+ .hidden { display: none; visibility: hidden; }
13
+
14
+ /* Hide only visually, but have it available for screenreaders
15
+ www.webaim.org/techniques/css/invisiblecontent/
16
+ Solution from: j.mp/visuallyhidden - Thanks Jonathan Neal! */
17
+ .visuallyhidden { position: absolute !important;
18
+ clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
19
+ clip: rect(1px, 1px, 1px, 1px); }
20
+
21
+ /* Hide visually and from screenreaders, but maintain layout */
22
+ .invisible { visibility: hidden; }
23
+
24
+ /* >> The Magnificent CLEARFIX << j.mp/phayesclearfix */
25
+ .clearfix:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
26
+ /* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
27
+ .clearfix { zoom: 1; }
28
+
29
+ }
@@ -0,0 +1,27 @@
1
+ @import "base";
2
+
3
+ @mixin boilerplate-print {
4
+
5
+ * { background: transparent !important; color: $font_color !important; text-shadow: none !important; }
6
+
7
+ a, a:visited { color: $font_color !important; text-decoration: underline; }
8
+
9
+ a:after { content: " (" attr(href) ")"; }
10
+
11
+ abbr:after { content: " (" attr(title) ")"; }
12
+
13
+ .ir a:after { content: ""; } /* Don't show links for images */
14
+
15
+ pre, blockquote { border: 1px solid $border_color_print; page-break-inside: avoid; }
16
+
17
+ thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
18
+
19
+ tr, img { page-break-inside: avoid; }
20
+
21
+ @page { margin: 0.5cm; }
22
+
23
+ p, h2, h3 { orphans: 3; widows: 3; }
24
+
25
+ h2, h3{ page-break-after: avoid; }
26
+
27
+ }
@@ -0,0 +1,3 @@
1
+ @import "reset/utilities";
2
+
3
+ @include boilerplate-reset;
@@ -0,0 +1,117 @@
1
+ @import "base";
2
+
3
+ @mixin boilerplate-typography {
4
+
5
+ /* fonts.css from the YUI Library: developer.yahoo.com/yui/
6
+ Refer to developer.yahoo.com/yui/3/cssfonts/ for font sizing percentages
7
+
8
+ There are three custom edits:
9
+ * remove arial, helvetica from explicit font stack
10
+ * we normalize monospace styles ourselves
11
+ * table font-size is reset in the HTML5 reset above so there is no need to repeat
12
+ */
13
+ body { font:$font_size"/"$line_height sans-serif; *font-size:small; } /* hack retained to preserve specificity */
14
+
15
+ select, input, textarea, button { font:99% sans-serif; }
16
+
17
+ /* normalize monospace sizing
18
+ * en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome
19
+ */
20
+ pre, code, kbd, samp { font-family: $font_family_fixed; }
21
+
22
+
23
+ /*
24
+ * minimal base styles
25
+ */
26
+
27
+
28
+ body, select, input, textarea {
29
+ /* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */
30
+ color: $font_color;
31
+ /* set your base font here, to apply evenly */
32
+ font-family: $font_family;
33
+ }
34
+
35
+ /* Headers (h1,h2,etc) have no default font-size or margin,
36
+ you'll want to define those yourself. */
37
+ h1,h2,h3,h4,h5,h6 { font-weight: bold; }
38
+
39
+ /* always force a scrollbar in non-IE */
40
+ html { overflow-y: scroll; }
41
+
42
+
43
+ /* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
44
+ a:hover, a:active { outline: none; }
45
+
46
+ a, a:active, a:visited { color: $link_color; }
47
+ a:hover { color: $link_hover_color; }
48
+
49
+
50
+ ul, ol { margin-left: 1.8em; }
51
+ ol { list-style-type: decimal; }
52
+
53
+ small { font-size: 85%; }
54
+ strong, th { font-weight: bold; }
55
+
56
+ td, td img { vertical-align: top; }
57
+
58
+ sub { vertical-align: sub; font-size: smaller; }
59
+ sup { vertical-align: super; font-size: smaller; }
60
+
61
+ pre {
62
+ padding: 15px;
63
+
64
+ /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
65
+ white-space: pre; /* CSS2 */
66
+ white-space: pre-wrap; /* CSS 2.1 */
67
+ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
68
+ word-wrap: break-word; /* IE */
69
+ }
70
+
71
+ textarea { overflow: auto; } /* thnx ivannikolic! www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */
72
+
73
+ .ie6 legend, .ie7 legend { margin-left: -7px; } /* thnx ivannikolic! */
74
+
75
+ /* align checkboxes, radios, text inputs with their label
76
+ by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css */
77
+ input[type="radio"] { vertical-align: text-bottom; }
78
+ input[type="checkbox"] { vertical-align: bottom; }
79
+ .ie7 input[type="checkbox"] { vertical-align: baseline; }
80
+ .ie6 input { vertical-align: text-bottom; }
81
+
82
+ /* hand cursor on clickable input elements */
83
+ label, input[type=button], input[type=submit], button { cursor: pointer; }
84
+
85
+ /* webkit browsers add a 2px margin outside the chrome of form elements */
86
+ button, input, select, textarea { margin: 0; }
87
+
88
+ /* colors for form validity */
89
+ input:valid, textarea:valid { }
90
+ input:invalid, textarea:invalid {
91
+ border-radius: 1px;
92
+ -moz-box-shadow: 0px 0px 5px $error_color;
93
+ -webkit-box-shadow: 0px 0px 5px $error_color;
94
+ box-shadow: 0px 0px 5px $error_color;
95
+ }
96
+ .no-boxshadow input:invalid,
97
+ .no-boxshadow textarea:invalid { background-color: $error_bg_color; }
98
+
99
+
100
+ /* These selection declarations have to be separate.
101
+ No text-shadow: twitter.com/miketaylr/status/12228805301
102
+ Also: hot pink. */
103
+ ::-moz-selection{ background:$selection_bg_color; color:$selection_color; text-shadow: none; }
104
+ ::selection { background:$selection_bg_color; color:$selection_color; text-shadow: none; }
105
+
106
+ /* j.mp/webkit-tap-highlight-color */
107
+ a:link { -webkit-tap-highlight-color:$selection_bg_color; }
108
+
109
+ /* make buttons play nice in IE:
110
+ www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
111
+ button { width: auto; overflow: visible; }
112
+
113
+ /* bicubic resizing for non-native sized IMG:
114
+ code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
115
+ .ie7 img { -ms-interpolation-mode: bicubic; }
116
+
117
+ }
@@ -0,0 +1,61 @@
1
+ @import "boilerplate/base";
2
+
3
+ @mixin boilerplate-reset {
4
+
5
+ /*
6
+ html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
7
+ v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark
8
+ html5doctor.com/html-5-reset-stylesheet/
9
+ */
10
+
11
+ html, body, div, span, object, iframe,
12
+ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
13
+ abbr, address, cite, code,
14
+ del, dfn, em, img, ins, kbd, q, samp,
15
+ small, strong, sub, sup, var,
16
+ b, i,
17
+ dl, dt, dd, ol, ul, li,
18
+ fieldset, form, label, legend,
19
+ table, caption, tbody, tfoot, thead, tr, th, td,
20
+ article, aside, canvas, details, figcaption, figure,
21
+ footer, header, hgroup, menu, nav, section, summary,
22
+ time, mark, audio, video {
23
+ margin:0;
24
+ padding:0;
25
+ border:0;
26
+ outline:0;
27
+ font-size:100%;
28
+ vertical-align:baseline;
29
+ background:transparent;
30
+ }
31
+
32
+ article, aside, details, figcaption, figure,
33
+ footer, header, hgroup, menu, nav, section {
34
+ display:block;
35
+ }
36
+
37
+ nav ul { list-style:none; }
38
+
39
+ blockquote, q { quotes:none; }
40
+
41
+ blockquote:before, blockquote:after,
42
+ q:before, q:after { content:''; content:none; }
43
+
44
+ a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
45
+
46
+ ins { background-color:$added_bg_color; color:$added_color; text-decoration:none; }
47
+
48
+ mark { background-color:$highlight_bg_color; color:$highlight_color; font-style:italic; font-weight:bold; }
49
+
50
+ del { text-decoration: line-through; }
51
+
52
+ abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
53
+
54
+ /* tables still need cellspacing="0" in the markup */
55
+ table { border-collapse:collapse; border-spacing:0; }
56
+
57
+ hr { display:block; height:1px; border:0; border-top:1px solid $border_color; margin:1em 0; padding:0; }
58
+
59
+ input, select { vertical-align:middle; }
60
+
61
+ };
metadata ADDED
@@ -0,0 +1,94 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: compass-boilerplate-plugin
3
+ version: !ruby/object:Gem::Version
4
+ hash: 27
5
+ prerelease: false
6
+ segments:
7
+ - 0
8
+ - 1
9
+ - 0
10
+ version: 0.1.0
11
+ platform: ruby
12
+ authors:
13
+ - Dimitrij Denissenko
14
+ autorequire:
15
+ bindir: bin
16
+ cert_chain: []
17
+
18
+ date: 2010-09-21 00:00:00 +01:00
19
+ default_executable:
20
+ dependencies:
21
+ - !ruby/object:Gem::Dependency
22
+ name: compass
23
+ prerelease: false
24
+ requirement: &id001 !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ">="
28
+ - !ruby/object:Gem::Version
29
+ hash: 3
30
+ segments:
31
+ - 0
32
+ version: "0"
33
+ type: :runtime
34
+ version_requirements: *id001
35
+ description: Lightweight - contains only the pure SCSS (SASS) definitions
36
+ email: dimitrij@blacksquaremedia.com
37
+ executables: []
38
+
39
+ extensions: []
40
+
41
+ extra_rdoc_files:
42
+ - README.rdoc
43
+ files:
44
+ - .gitignore
45
+ - README.rdoc
46
+ - Rakefile
47
+ - VERSION
48
+ - compass-boilerplate-plugin.gemspec
49
+ - init.rb
50
+ - lib/compass_boilerplate.rb
51
+ - stylesheets/_boilerplate.scss
52
+ - stylesheets/boilerplate/_advanced.scss
53
+ - stylesheets/boilerplate/_base.scss
54
+ - stylesheets/boilerplate/_helpers.scss
55
+ - stylesheets/boilerplate/_print.scss
56
+ - stylesheets/boilerplate/_reset.scss
57
+ - stylesheets/boilerplate/_typography.scss
58
+ - stylesheets/boilerplate/reset/_utilities.scss
59
+ has_rdoc: true
60
+ homepage: http://github.com/bsm/compass-boilerplate-plugin
61
+ licenses: []
62
+
63
+ post_install_message:
64
+ rdoc_options:
65
+ - --charset=UTF-8
66
+ require_paths:
67
+ - lib
68
+ required_ruby_version: !ruby/object:Gem::Requirement
69
+ none: false
70
+ requirements:
71
+ - - ">="
72
+ - !ruby/object:Gem::Version
73
+ hash: 3
74
+ segments:
75
+ - 0
76
+ version: "0"
77
+ required_rubygems_version: !ruby/object:Gem::Requirement
78
+ none: false
79
+ requirements:
80
+ - - ">="
81
+ - !ruby/object:Gem::Version
82
+ hash: 3
83
+ segments:
84
+ - 0
85
+ version: "0"
86
+ requirements: []
87
+
88
+ rubyforge_project:
89
+ rubygems_version: 1.3.7
90
+ signing_key:
91
+ specification_version: 3
92
+ summary: HTML5 boileplate plugin for Compass
93
+ test_files: []
94
+