html5-starter 0.1.3b
Sign up to get free protection for your applications and to get access to all the features.
- data/LICENSE +3 -0
- data/README.md +135 -0
- data/VERSION +1 -0
- data/lib/app/helpers/html5_boilerplate_helper.rb +47 -0
- data/lib/html5-boilerplate.rb +6 -0
- data/stylesheets/_html5-boilerplate.scss +15 -0
- data/stylesheets/html5-boilerplate/_fonts.scss +36 -0
- data/stylesheets/html5-boilerplate/_handheld.scss +8 -0
- data/stylesheets/html5-boilerplate/_helpers.scss +25 -0
- data/stylesheets/html5-boilerplate/_print.scss +20 -0
- data/stylesheets/html5-boilerplate/_reset.scss +50 -0
- data/stylesheets/html5-boilerplate/_styles.scss +100 -0
- data/templates/project/_flashes.html.haml +4 -0
- data/templates/project/_footer.html.haml +2 -0
- data/templates/project/_head.html.haml +32 -0
- data/templates/project/_header.html.haml +1 -0
- data/templates/project/_javascripts.html.haml +38 -0
- data/templates/project/_stylesheets.html.haml +8 -0
- data/templates/project/application.html.haml +15 -0
- data/templates/project/files/404.html +22 -0
- data/templates/project/files/apple-touch-icon.png +0 -0
- data/templates/project/files/build/build.xml +636 -0
- data/templates/project/files/build/buildinfo.properties +5 -0
- data/templates/project/files/build/config/build.properties +3 -0
- data/templates/project/files/build/config/default.properties +79 -0
- data/templates/project/files/build/config/project.properties +49 -0
- data/templates/project/files/build/createproject.sh +73 -0
- data/templates/project/files/build/tools/ant-contrib-1.0b3.jar +0 -0
- data/templates/project/files/build/tools/css-compressor/CSSCompression.php +465 -0
- data/templates/project/files/build/tools/css-compressor/changelog.txt +22 -0
- data/templates/project/files/build/tools/css-compressor/cli.php +101 -0
- data/templates/project/files/build/tools/css-compressor/helpers/hex2short-colors.json +39 -0
- data/templates/project/files/build/tools/css-compressor/helpers/hex2short-safe.json +16 -0
- data/templates/project/files/build/tools/css-compressor/helpers/long2hex-colors.json +127 -0
- data/templates/project/files/build/tools/css-compressor/lib/Cleanup.php +218 -0
- data/templates/project/files/build/tools/css-compressor/lib/Color.php +199 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine.php +191 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/Aural.php +109 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/Background.php +107 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/Border.php +98 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/BorderOutline.php +109 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/BorderRadius.php +262 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/Font.php +125 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/List.php +104 -0
- data/templates/project/files/build/tools/css-compressor/lib/Combine/MarginPadding.php +190 -0
- data/templates/project/files/build/tools/css-compressor/lib/Compress.php +212 -0
- data/templates/project/files/build/tools/css-compressor/lib/Control.php +236 -0
- data/templates/project/files/build/tools/css-compressor/lib/Exception.php +32 -0
- data/templates/project/files/build/tools/css-compressor/lib/Format.php +187 -0
- data/templates/project/files/build/tools/css-compressor/lib/Individuals.php +307 -0
- data/templates/project/files/build/tools/css-compressor/lib/Numeric.php +103 -0
- data/templates/project/files/build/tools/css-compressor/lib/Option.php +133 -0
- data/templates/project/files/build/tools/css-compressor/lib/Organize.php +149 -0
- data/templates/project/files/build/tools/css-compressor/lib/Selectors.php +245 -0
- data/templates/project/files/build/tools/css-compressor/lib/Setup.php +292 -0
- data/templates/project/files/build/tools/css-compressor/lib/Trim.php +213 -0
- data/templates/project/files/build/tools/css-compressor/license.txt +21 -0
- data/templates/project/files/build/tools/htmlcompressor-0.9.8.jar +0 -0
- data/templates/project/files/build/tools/jpegtran.exe +0 -0
- data/templates/project/files/build/tools/optipng-0.6.4-exe/LICENSE.txt +21 -0
- data/templates/project/files/build/tools/optipng-0.6.4-exe/optipng.exe +0 -0
- data/templates/project/files/build/tools/yuicompressor-2.4.2.jar +0 -0
- data/templates/project/files/crossdomain.xml +25 -0
- data/templates/project/files/favicon.ico +0 -0
- data/templates/project/files/gitignore.txt +32 -0
- data/templates/project/files/gitignore_placeholder.txt +2 -0
- data/templates/project/files/google.yml +22 -0
- data/templates/project/files/htaccess +415 -0
- data/templates/project/files/humans.txt +43 -0
- data/templates/project/files/lighttpd.conf +149 -0
- data/templates/project/files/mime.types +80 -0
- data/templates/project/files/nginx.conf +108 -0
- data/templates/project/files/robots.txt +5 -0
- data/templates/project/files/web.config +207 -0
- data/templates/project/handheld.scss +8 -0
- data/templates/project/index.html +81 -0
- data/templates/project/javascripts/libs/dd_belatedpng.js +13 -0
- data/templates/project/javascripts/libs/jquery-1.4.4.js +7179 -0
- data/templates/project/javascripts/libs/jquery-1.4.4.min.js +167 -0
- data/templates/project/javascripts/libs/modernizr-1.6.min.js +30 -0
- data/templates/project/javascripts/plugins.js +13 -0
- data/templates/project/javascripts/rails.js +156 -0
- data/templates/project/javascripts/script.js +26 -0
- data/templates/project/manifest.rb +101 -0
- data/templates/project/partials/_base.scss +23 -0
- data/templates/project/style.scss +70 -0
- metadata +171 -0
data/LICENSE
ADDED
data/README.md
ADDED
@@ -0,0 +1,135 @@
|
|
1
|
+
Compass Html5 Boilerplate
|
2
|
+
=========================
|
3
|
+
|
4
|
+
HTML5 Boilerplate is a Compass extension based on HTML5 Boilerplate by Paul Irish.
|
5
|
+
You can use it to kick-start fully compliant HTML5 applications. Generate either
|
6
|
+
stand-alone HTML5 projects, or Rails applications with fully integrated HTML5
|
7
|
+
Haml and Sass (Scss) templates.
|
8
|
+
|
9
|
+
Browse [html5boilerplate.com](http://html5boilerplate.com) for the full workup.
|
10
|
+
|
11
|
+
Rails Installation
|
12
|
+
==================
|
13
|
+
|
14
|
+
gem install html5-boilerplate
|
15
|
+
cd my_rails_project
|
16
|
+
compass init rails -r html5-boilerplate -u html5-boilerplate --force
|
17
|
+
|
18
|
+
**This will install the following files in your rails project:**
|
19
|
+
(Using `--force` flag will overwrite any files that may already exist. In most cases this is probably what you want.)
|
20
|
+
|
21
|
+
app/views/layouts/application.html.haml
|
22
|
+
app/views/layouts/_flashes.html.haml
|
23
|
+
app/views/layouts/_footer.html.haml
|
24
|
+
app/views/layouts/_head.html.haml
|
25
|
+
app/views/layouts/_header.html.haml
|
26
|
+
app/views/layouts/_javascripts.html.haml
|
27
|
+
app/views/layouts/_stylesheets.html.haml
|
28
|
+
|
29
|
+
app/stylesheets/style.scss
|
30
|
+
app/stylesheets/handheld.scss
|
31
|
+
app/stylesheets/partials/_base.scss
|
32
|
+
app/stylesheets/partials/_example.scss
|
33
|
+
app/stylesheets/partials/_page.scss
|
34
|
+
|
35
|
+
public/404.html
|
36
|
+
public/.htaccess
|
37
|
+
public/crossdomain.xml
|
38
|
+
public/robots.txt
|
39
|
+
public/apple-touch-icon.png
|
40
|
+
public/favicon.ico
|
41
|
+
|
42
|
+
public/javascripts/dd_belatedpng.js
|
43
|
+
public/javascripts/jquery-1.4.4.min.js
|
44
|
+
public/javascripts/modernizr-1.6.min.js
|
45
|
+
public/javascripts/plugins.js
|
46
|
+
public/javascripts/rails.js
|
47
|
+
public/javascripts/profiling/charts.swf
|
48
|
+
public/javascripts/profiling/config.js
|
49
|
+
public/javascripts/profiling/yahoo-profiling.css
|
50
|
+
public/javascripts/profiling/yahoo-profiling.min.js
|
51
|
+
|
52
|
+
config/compass.rb
|
53
|
+
config/initializers/compass.rb
|
54
|
+
config/google.yml
|
55
|
+
config/nginx.conf
|
56
|
+
config/mime.types
|
57
|
+
|
58
|
+
The Scss files above will automatically get compiled to your Sass compilation directory:
|
59
|
+
|
60
|
+
public/stylesheets/style.css
|
61
|
+
public/stylesheets/handheld.css
|
62
|
+
|
63
|
+
**Note:** If you already have a config/compass.rb file in your project, you may need to
|
64
|
+
manually add the following line to the top:
|
65
|
+
|
66
|
+
require 'html5-boilerplate'
|
67
|
+
|
68
|
+
### A few more minor points to store into your brainpan...
|
69
|
+
|
70
|
+
If you still have an application.html.erb in your layouts, you will need to loose
|
71
|
+
it now so that Rails will use your shiny new application.html.haml layout instead.
|
72
|
+
|
73
|
+
The haml will compile to the equivalent of html5-boilerplate's index.html,
|
74
|
+
but with all comments stripped out, and some additional rails stuff
|
75
|
+
like csrf_meta_tags, flashes and the Rails jQuery driver.
|
76
|
+
|
77
|
+
You can set your own Google Analytics Account ID and your Google API Key
|
78
|
+
either as ENV variables, or inside config/google.yml.
|
79
|
+
|
80
|
+
This extension has only been tested on Rails3.
|
81
|
+
|
82
|
+
|
83
|
+
Stand Alone Installation
|
84
|
+
========================
|
85
|
+
|
86
|
+
gem install html5-boilerplate
|
87
|
+
compass create my_project -r html5-boilerplate -u html5-boilerplate --javascripts-dir js --css-dir css
|
88
|
+
|
89
|
+
The `--javascripts-dir` and `--css-dir` flags are to keep consistent with the original project layout.
|
90
|
+
If you omit them, be sure to edit your javascript and style tags accordingly in index.html.
|
91
|
+
|
92
|
+
**This will create a `my_project` directory containing the following files:**
|
93
|
+
|
94
|
+
index.html
|
95
|
+
404.html
|
96
|
+
crossdomain.xml
|
97
|
+
robots.txt
|
98
|
+
apple-touch-icon.png
|
99
|
+
favicon.ico
|
100
|
+
|
101
|
+
src/style.scss
|
102
|
+
src/handheld.scss
|
103
|
+
src/partials/_base.scss
|
104
|
+
src/partials/_example.scss
|
105
|
+
src/partials/_page.scss
|
106
|
+
|
107
|
+
js/dd_belatedpng.js
|
108
|
+
js/jquery-1.4.4.min.js
|
109
|
+
js/modernizr-1.6.min.js
|
110
|
+
js/plugins.js
|
111
|
+
js/profiling/charts.swf
|
112
|
+
js/profiling/config.js
|
113
|
+
js/profiling/yahoo-profiling.css
|
114
|
+
js/profiling/yahoo-profiling.min.js
|
115
|
+
|
116
|
+
.htaccess
|
117
|
+
config.rb
|
118
|
+
nginx.conf
|
119
|
+
mime.types
|
120
|
+
web.config
|
121
|
+
|
122
|
+
Run `compass watch my_project` and the SCSS files above will automatically
|
123
|
+
get compiled to your Sass compilation directory whenever a change is made:
|
124
|
+
|
125
|
+
css/style.css
|
126
|
+
css/handheld.css
|
127
|
+
|
128
|
+
License
|
129
|
+
=======
|
130
|
+
|
131
|
+
HTML5 Boilerplate by Paul Irish
|
132
|
+
(comments left intact in scss files)
|
133
|
+
|
134
|
+
Compass Extension Copyright (c) 2010, Peter Gumeson
|
135
|
+
[http://creativecommons.org/licenses/by/3.0](http://creativecommons.org/licenses/by/3.0)
|
data/VERSION
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
0.2.6
|
@@ -0,0 +1,47 @@
|
|
1
|
+
module Html5BoilerplateHelper
|
2
|
+
# Create a named haml tag to wrap IE conditional around a block
|
3
|
+
# http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither
|
4
|
+
def ie_tag(name=:body, attrs={}, &block)
|
5
|
+
attrs.symbolize_keys!
|
6
|
+
haml_concat("<!--[if lt IE 7 ]> #{ tag(name, add_class('ie6', attrs), true) } <![endif]-->".html_safe)
|
7
|
+
haml_concat("<!--[if IE 7 ]> #{ tag(name, add_class('ie7', attrs), true) } <![endif]-->".html_safe)
|
8
|
+
haml_concat("<!--[if IE 8 ]> #{ tag(name, add_class('ie8', attrs), true) } <![endif]-->".html_safe)
|
9
|
+
haml_concat("<!--[if IE 9 ]> #{ tag(name, add_class('ie9', attrs), true) } <![endif]-->".html_safe)
|
10
|
+
haml_concat("<!--[if (gte IE 9)|!(IE)]><!-->".html_safe)
|
11
|
+
haml_tag name, attrs do
|
12
|
+
haml_concat("<!--<![endif]-->".html_safe)
|
13
|
+
block.call
|
14
|
+
end
|
15
|
+
end
|
16
|
+
|
17
|
+
def ie_html(attrs={}, &block)
|
18
|
+
ie_tag(:html, attrs, &block)
|
19
|
+
end
|
20
|
+
|
21
|
+
def ie_body(attrs={}, &block)
|
22
|
+
ie_tag(:body, attrs, &block)
|
23
|
+
end
|
24
|
+
|
25
|
+
def google_account_id
|
26
|
+
ENV['GOOGLE_ACCOUNT_ID'] || google_config(:google_account_id)
|
27
|
+
end
|
28
|
+
|
29
|
+
def google_api_key
|
30
|
+
ENV['GOOGLE_API_KEY'] || google_config(:google_api_key)
|
31
|
+
end
|
32
|
+
|
33
|
+
private
|
34
|
+
|
35
|
+
def add_class(name, attrs)
|
36
|
+
classes = attrs[:class] || ''
|
37
|
+
classes.strip!
|
38
|
+
classes = ' ' + classes if !classes.blank?
|
39
|
+
classes = name + classes
|
40
|
+
attrs.merge(:class => classes)
|
41
|
+
end
|
42
|
+
|
43
|
+
def google_config(key)
|
44
|
+
configs = YAML.load_file(File.join(Rails.root, 'config', 'google.yml'))[Rails.env.to_sym] rescue {}
|
45
|
+
configs[key]
|
46
|
+
end
|
47
|
+
end
|
@@ -0,0 +1,6 @@
|
|
1
|
+
Compass::Frameworks.register("html5-boilerplate", :path => "#{File.dirname(__FILE__)}/..")
|
2
|
+
|
3
|
+
if defined?(ActionController)
|
4
|
+
require File.join(File.dirname(__FILE__), 'app', 'helpers', 'html5_boilerplate_helper')
|
5
|
+
ActionController::Base.helper(Html5BoilerplateHelper)
|
6
|
+
end
|
@@ -0,0 +1,15 @@
|
|
1
|
+
@import "compass/css3";
|
2
|
+
|
3
|
+
@import "html5-boilerplate/reset";
|
4
|
+
@import "html5-boilerplate/fonts";
|
5
|
+
@import "html5-boilerplate/styles";
|
6
|
+
@import "html5-boilerplate/helpers";
|
7
|
+
@import "html5-boilerplate/print";
|
8
|
+
|
9
|
+
@mixin html5-boilerplate {
|
10
|
+
@include html5-boilerplate-reset;
|
11
|
+
@include html5-boilerplate-fonts;
|
12
|
+
@include html5-boilerplate-styles;
|
13
|
+
@include html5-boilerplate-helpers;
|
14
|
+
@include html5-boilerplate-print;
|
15
|
+
}
|
@@ -0,0 +1,36 @@
|
|
1
|
+
$base-font-family: unquote("sans-serif") !default;
|
2
|
+
$base-font-size: 13px !default;
|
3
|
+
$base-line-height: 1.231 !default;
|
4
|
+
|
5
|
+
@mixin html5-boilerplate-fonts($family: $base-font-family, $size: $base-font-size, $line-height: $base-line-height) {
|
6
|
+
/* font normalization inspired by from the YUI Library's fonts.css: developer.yahoo.com/yui/ */
|
7
|
+
body {
|
8
|
+
font-size: $size;
|
9
|
+
font-family: $family;
|
10
|
+
line-height: $line-height;
|
11
|
+
/* hack retained to preserve specificity */
|
12
|
+
*font-size: small;
|
13
|
+
}
|
14
|
+
select, input, textarea, button { font: 99% $family; }
|
15
|
+
|
16
|
+
/* normalize monospace sizing
|
17
|
+
* en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
|
18
|
+
pre, code, kbd, samp { font-family: monospace, sans-serif; }
|
19
|
+
}
|
20
|
+
|
21
|
+
// Sets the font size specified in pixels using percents so that the base
|
22
|
+
// font size changes and 1em has the correct value. When nesting font size
|
23
|
+
// declarations, within the DOM tree, the base_font_size must be the parent's
|
24
|
+
// effective font-size in pixels.
|
25
|
+
// Usage Examples:
|
26
|
+
// .big
|
27
|
+
// +font-size(16px)
|
28
|
+
// .bigger
|
29
|
+
// +font-size(18px)
|
30
|
+
// .big .bigger
|
31
|
+
// +font-size(18px, 16px)
|
32
|
+
//
|
33
|
+
// For more information see the table found at http://developer.yahoo.com/yui/3/cssfonts/#fontsize
|
34
|
+
@mixin font-size($size, $base-font-size: $base-font-size) {
|
35
|
+
font-size: ceil(percentage($size / $base-font-size));
|
36
|
+
}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
@mixin html5-boilerplate-helpers {
|
2
|
+
/*
|
3
|
+
* Non-semantic helper classes: please define your styles before this section.
|
4
|
+
*/
|
5
|
+
|
6
|
+
/* for image replacement */
|
7
|
+
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
|
8
|
+
|
9
|
+
/* Hide for both screenreaders and browsers
|
10
|
+
css-discuss.incutio.com/wiki/Screenreader_Visibility */
|
11
|
+
.hidden { display: none; visibility: hidden; }
|
12
|
+
|
13
|
+
/* Hide only visually, but have it available for screenreaders: by Jon Neal
|
14
|
+
www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden */
|
15
|
+
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
|
16
|
+
|
17
|
+
/* Hide visually and from screenreaders, but maintain layout */
|
18
|
+
.invisible { visibility: hidden; }
|
19
|
+
|
20
|
+
/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
|
21
|
+
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; }
|
22
|
+
.clearfix:after { clear: both; }
|
23
|
+
/* fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
|
24
|
+
.clearfix { zoom: 1; }
|
25
|
+
}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
@mixin html5-boilerplate-print {
|
2
|
+
/*
|
3
|
+
* print styles
|
4
|
+
* inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/
|
5
|
+
*/
|
6
|
+
@media print {
|
7
|
+
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
|
8
|
+
-ms-filter: none !important; } /* black prints faster: sanbeiji.com/archives/953 */
|
9
|
+
a, a:visited { color: #444 !important; text-decoration: underline; }
|
10
|
+
a[href]:after { content: " (" attr(href) ")"; }
|
11
|
+
abbr[title]:after { content: " (" attr(title) ")"; }
|
12
|
+
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* don't show links for images, or javascript/internal links */
|
13
|
+
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
|
14
|
+
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
|
15
|
+
tr, img { page-break-inside: avoid; }
|
16
|
+
@page { margin: 0.5cm; }
|
17
|
+
p, h2, h3 { orphans: 3; widows: 3; }
|
18
|
+
h2, h3{ page-break-after: avoid; }
|
19
|
+
}
|
20
|
+
}
|
@@ -0,0 +1,50 @@
|
|
1
|
+
@mixin html5-boilerplate-reset {
|
2
|
+
/*
|
3
|
+
html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
|
4
|
+
v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark
|
5
|
+
html5doctor.com/html-5-reset-stylesheet/
|
6
|
+
*/
|
7
|
+
|
8
|
+
html, body, div, span, object, iframe,
|
9
|
+
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
10
|
+
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
|
11
|
+
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
|
12
|
+
fieldset, form, label, legend,
|
13
|
+
table, caption, tbody, tfoot, thead, tr, th, td,
|
14
|
+
article, aside, canvas, details, figcaption, figure,
|
15
|
+
footer, header, hgroup, menu, nav, section, summary,
|
16
|
+
time, mark, audio, video {
|
17
|
+
margin:0;
|
18
|
+
padding:0;
|
19
|
+
border:0;
|
20
|
+
font-size:100%;
|
21
|
+
font: inherit;
|
22
|
+
vertical-align:baseline;
|
23
|
+
}
|
24
|
+
|
25
|
+
article, aside, details, figcaption, figure,
|
26
|
+
footer, header, hgroup, menu, nav, section {
|
27
|
+
display:block;
|
28
|
+
}
|
29
|
+
|
30
|
+
blockquote, q { quotes:none; }
|
31
|
+
|
32
|
+
blockquote:before, blockquote:after,
|
33
|
+
q:before, q:after { content:''; content:none; }
|
34
|
+
|
35
|
+
ins { background-color:#ff9; color:#000; text-decoration:none; }
|
36
|
+
|
37
|
+
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
|
38
|
+
|
39
|
+
del { text-decoration: line-through; }
|
40
|
+
|
41
|
+
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
|
42
|
+
|
43
|
+
table { border-collapse:collapse; border-spacing:0; }
|
44
|
+
|
45
|
+
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
|
46
|
+
|
47
|
+
input, select { vertical-align:middle; }
|
48
|
+
|
49
|
+
/* END RESET CSS */
|
50
|
+
}
|
@@ -0,0 +1,100 @@
|
|
1
|
+
$font-color: #444 !default; //looks better than black: twitter.com/H_FJ/statuses/11800719859
|
2
|
+
$link-color: #607890 !default;
|
3
|
+
$link-hover-color: #036 !default;
|
4
|
+
$link-active-color: #607890 !default;
|
5
|
+
$link-visited-color: #607890 !default;
|
6
|
+
$selected-font-color: #fff !default;
|
7
|
+
$selected-background-color: #ff5e99 !default;
|
8
|
+
$list-left-margin: 2em !default;
|
9
|
+
|
10
|
+
|
11
|
+
@mixin html5-boilerplate-styles {
|
12
|
+
/*
|
13
|
+
* minimal base styles
|
14
|
+
*/
|
15
|
+
|
16
|
+
|
17
|
+
body, select, input, textarea {
|
18
|
+
/* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */
|
19
|
+
color: $font-color;
|
20
|
+
/* set your base font here, to apply evenly */
|
21
|
+
font-family: $base-font-family;
|
22
|
+
}
|
23
|
+
|
24
|
+
/* headers (h1,h2,etc) have no default font-size or margin. define those yourself. */
|
25
|
+
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
|
26
|
+
|
27
|
+
/* always force a scrollbar in non-IE: */
|
28
|
+
html { overflow-y: scroll; }
|
29
|
+
|
30
|
+
|
31
|
+
/* accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
|
32
|
+
a:hover, a:active { outline: none; }
|
33
|
+
|
34
|
+
a, a:active, a:visited { color: $link-color; }
|
35
|
+
a:hover { color: $link-hover-color; }
|
36
|
+
|
37
|
+
|
38
|
+
ul, ol { margin-left: $list-left-margin; }
|
39
|
+
ol { list-style-type: decimal; }
|
40
|
+
|
41
|
+
/* remove margins for navigation lists */
|
42
|
+
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
|
43
|
+
|
44
|
+
small { font-size: 85%; }
|
45
|
+
strong, th { font-weight: bold; }
|
46
|
+
|
47
|
+
td { vertical-align: top; }
|
48
|
+
|
49
|
+
/* set sub, sup without affecting line-height: gist.github.com/413930 */
|
50
|
+
sub, sup { font-size: 75%; line-height: 0; position: relative; }
|
51
|
+
sup { top: -0.5em; }
|
52
|
+
sub { bottom: -0.25em; }
|
53
|
+
|
54
|
+
pre {
|
55
|
+
/* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
|
56
|
+
white-space: pre; white-space: pre-wrap; white-space: pre-line; word-wrap: break-word;
|
57
|
+
padding: 15px;
|
58
|
+
}
|
59
|
+
|
60
|
+
textarea { overflow: auto; } /* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */
|
61
|
+
|
62
|
+
.ie6 legend, .ie7 legend { margin-left: -7px; } /* thnx ivannikolic! */
|
63
|
+
|
64
|
+
/* align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css */
|
65
|
+
input[type="radio"] { vertical-align: text-bottom; }
|
66
|
+
input[type="checkbox"] { vertical-align: bottom; }
|
67
|
+
.ie7 input[type="checkbox"] { vertical-align: baseline; }
|
68
|
+
.ie6 input { vertical-align: text-bottom; }
|
69
|
+
|
70
|
+
/* hand cursor on clickable input elements */
|
71
|
+
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
|
72
|
+
|
73
|
+
/* webkit browsers add a 2px margin outside the chrome of form elements */
|
74
|
+
button, input, select, textarea { margin: 0; }
|
75
|
+
|
76
|
+
/* colors for form validity */
|
77
|
+
input:invalid, textarea:invalid {
|
78
|
+
@include border-radius(1px);
|
79
|
+
@include box-shadow(red, 0, 0, 5px, 0);
|
80
|
+
}
|
81
|
+
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
|
82
|
+
|
83
|
+
|
84
|
+
/* These selection declarations have to be separate.
|
85
|
+
No text-shadow: twitter.com/miketaylr/status/12228805301
|
86
|
+
Also: hot pink. */
|
87
|
+
::-moz-selection{ background: $selected-background-color; color: $selected-font-color; text-shadow: none; }
|
88
|
+
::selection { background: $selected-background-color; color: $selected-font-color; text-shadow: none; }
|
89
|
+
|
90
|
+
/* j.mp/webkit-tap-highlight-color */
|
91
|
+
a:link { -webkit-tap-highlight-color: $selected-background-color; }
|
92
|
+
|
93
|
+
/* make buttons play nice in IE:
|
94
|
+
www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
|
95
|
+
button { width: auto; overflow: visible; }
|
96
|
+
|
97
|
+
/* bicubic resizing for non-native sized IMG:
|
98
|
+
code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
|
99
|
+
.ie7 img { -ms-interpolation-mode: bicubic; }
|
100
|
+
}
|