webby 0.3.0 → 0.4.0
Sign up to get free protection for your applications and to get access to all the features.
- data/History.txt +5 -0
- data/Manifest.txt +0 -4
- data/README.txt +31 -8
- data/Rakefile +2 -5
- data/data/content/css/blueprint/Readme.txt +10 -3
- data/data/content/css/blueprint/lib/buttons.css +2 -2
- data/data/content/css/blueprint/lib/compressed.css +112 -102
- data/data/content/css/blueprint/lib/grid.css +78 -106
- data/data/content/css/blueprint/lib/img/grid.png +0 -0
- data/data/content/css/blueprint/lib/reset.css +6 -3
- data/data/content/css/blueprint/lib/typography.css +55 -53
- data/data/content/css/blueprint/print.css +9 -5
- data/data/content/css/blueprint/screen.css +15 -19
- data/data/content/css/coderay.css +1 -1
- data/lib/webby.rb +2 -2
- data/lib/webby/coderay_filter.rb +3 -2
- data/lib/webby/renderer.rb +10 -10
- data/tasks/setup.rb +3 -1
- data/website/content/css/blueprint/lib/buttons.css +2 -2
- data/website/content/css/blueprint/lib/compressed.css +112 -102
- data/website/content/css/blueprint/lib/grid.css +78 -106
- data/website/content/css/blueprint/lib/img/grid.png +0 -0
- data/website/content/css/blueprint/lib/reset.css +6 -3
- data/website/content/css/blueprint/lib/typography.css +55 -53
- data/website/content/css/blueprint/print.css +9 -5
- data/website/content/css/blueprint/screen.css +15 -19
- data/website/content/css/site.css +15 -4
- data/website/content/index.txt +13 -0
- data/website/content/tips_and_tricks.txt +29 -27
- data/website/layouts/default.rhtml +0 -3
- metadata +12 -7
- data/data/content/css/blueprint/lib/img/baseline-black.png +0 -0
- data/data/content/css/blueprint/lib/img/baseline.png +0 -0
- data/website/content/css/blueprint/lib/img/baseline-black.png +0 -0
- data/website/content/css/blueprint/lib/img/baseline.png +0 -0
data/History.txt
CHANGED
data/Manifest.txt
CHANGED
@@ -9,8 +9,6 @@ data/content/css/blueprint/Readme.txt
|
|
9
9
|
data/content/css/blueprint/lib/buttons.css
|
10
10
|
data/content/css/blueprint/lib/compressed.css
|
11
11
|
data/content/css/blueprint/lib/grid.css
|
12
|
-
data/content/css/blueprint/lib/img/baseline-black.png
|
13
|
-
data/content/css/blueprint/lib/img/baseline.png
|
14
12
|
data/content/css/blueprint/lib/img/grid.png
|
15
13
|
data/content/css/blueprint/lib/img/icons/cross.png
|
16
14
|
data/content/css/blueprint/lib/img/icons/textfield_key.png
|
@@ -53,8 +51,6 @@ website/Rakefile
|
|
53
51
|
website/content/css/blueprint/lib/buttons.css
|
54
52
|
website/content/css/blueprint/lib/compressed.css
|
55
53
|
website/content/css/blueprint/lib/grid.css
|
56
|
-
website/content/css/blueprint/lib/img/baseline-black.png
|
57
|
-
website/content/css/blueprint/lib/img/baseline.png
|
58
54
|
website/content/css/blueprint/lib/img/grid.png
|
59
55
|
website/content/css/blueprint/lib/img/icons/cross.png
|
60
56
|
website/content/css/blueprint/lib/img/icons/textfield_key.png
|
data/README.txt
CHANGED
@@ -6,16 +6,34 @@ Webby
|
|
6
6
|
|
7
7
|
== DESCRIPTION:
|
8
8
|
|
9
|
-
Webby is a
|
10
|
-
|
11
|
-
|
12
|
-
|
9
|
+
Webby is a super fantastic little website management system. It would be called a _content management system_ if it were a bigger kid. But, it's just a runt with a special knack for transforming text. And that's really all it does - manages the legwork of turning text into something else, an *ASCII Alchemist* if you will.
|
10
|
+
|
11
|
+
Webby works by combining the contents of a *page* with a *layout* to produce HTML. The layout contains everthing common to all the pages - HTML headers, navigation menu, footer, etc. - and the page contains just the information for that page. You can use your favorite markup language to write your pages; Webby supports quite a few.
|
12
|
+
|
13
|
+
Install Webby and try it out!
|
13
14
|
|
14
15
|
== FEATURES:
|
15
16
|
|
16
|
-
*
|
17
|
-
*
|
18
|
-
*
|
17
|
+
* choose your templating language: *eRuby*, *Textile*, *Markdown*, *HAML*
|
18
|
+
* support for {CodeRay}[http://coderay.rubychan.de/] syntax highlighting
|
19
|
+
* quick and speedy - only builds pages that have changed
|
20
|
+
* deploy anywhere - it's just HTML, no special server stuff required
|
21
|
+
* happy {rake}[http://docs.rubyrake.org/] tasks for deploying your website to a server
|
22
|
+
* build new pages from templates for quicker blog posts and news items
|
23
|
+
|
24
|
+
But Wait! There's More!
|
25
|
+
|
26
|
+
Webby has a great _autobuild_ feature that continously generates HTML whenever the *pages* or *layouts* change. The HTML is served up via {heel}[http://copiousfreetime.rubyforge.org/heel/], a static file webserver based on mongrel. Whenever you change a page, you can immediately see those changes without having to run any commands.
|
27
|
+
|
28
|
+
$ rake autobuild
|
29
|
+
heel --root output --daemonize
|
30
|
+
-- starting autobuild (Ctrl-C to stop)
|
31
|
+
- started at 10:21:26
|
32
|
+
creating output/index.html
|
33
|
+
- started at 10:22:57
|
34
|
+
creating output/index.html
|
35
|
+
|
36
|
+
Webby is not limited to producing HTML. By no means! Do you ever get tired of repeating the same color code <b>#D3C4A2</b> in your CSS files? Webby can help. Need some customized JavaScript for your website. Webby can help. Anytime you find yourself repeating the same bit of text over and over, then you should be using Webby.
|
19
37
|
|
20
38
|
== INSTALL:
|
21
39
|
|
@@ -34,7 +52,10 @@ web server for general consumption.
|
|
34
52
|
$ rake create:page another/new_page.rhtml
|
35
53
|
creating content/another/new_page.rhtml
|
36
54
|
|
37
|
-
$ rake
|
55
|
+
$ rake autobuild
|
56
|
+
heel --root output --daemonize
|
57
|
+
-- starting autobuild (Ctrl-C to stop)
|
58
|
+
- started at 07:01:30
|
38
59
|
creating output/index.html
|
39
60
|
creating output/new_page.html
|
40
61
|
creating output/another/new_page.html
|
@@ -44,6 +65,8 @@ web server for general consumption.
|
|
44
65
|
* rake
|
45
66
|
* rspec
|
46
67
|
* directory_watcher
|
68
|
+
* hpricot
|
69
|
+
* heel
|
47
70
|
|
48
71
|
== LICENSE:
|
49
72
|
|
data/Rakefile
CHANGED
@@ -1,11 +1,7 @@
|
|
1
1
|
# $Id$
|
2
2
|
|
3
|
-
require 'rubygems'
|
4
|
-
require 'rake'
|
5
|
-
require 'spec'
|
6
|
-
require 'webby'
|
7
|
-
require 'fileutils'
|
8
3
|
load './tasks/setup.rb'
|
4
|
+
require 'webby'
|
9
5
|
|
10
6
|
task :default => 'spec:run'
|
11
7
|
|
@@ -28,6 +24,7 @@ PROJ.rdoc_exclude << '^(\.\/|\/)?website'
|
|
28
24
|
PROJ.spec_opts << '--color'
|
29
25
|
|
30
26
|
depend_on 'directory_watcher', '1.0.0'
|
27
|
+
depend_on 'heel'
|
31
28
|
depend_on 'hpricot'
|
32
29
|
depend_on 'rspec'
|
33
30
|
|
@@ -1,4 +1,4 @@
|
|
1
|
-
Blueprint CSS framework (http://bjorkoy.com/blueprint)
|
1
|
+
Blueprint CSS framework 0.5 (http://bjorkoy.com/blueprint)
|
2
2
|
----------------------------------------------------------------
|
3
3
|
|
4
4
|
Welcome to Blueprint! This is a CSS framework designed to
|
@@ -37,8 +37,8 @@ How to use Blueprint
|
|
37
37
|
Here's a quick primer on how to use BP:
|
38
38
|
http://code.google.com/p/blueprintcss/wiki/Tutorial
|
39
39
|
|
40
|
-
Each file is also heavily commented, so you'll
|
41
|
-
lot by reading through them.
|
40
|
+
Each file is also heavily commented, so you'll
|
41
|
+
learn a lot by reading through them.
|
42
42
|
|
43
43
|
|
44
44
|
Files in Blueprint
|
@@ -68,6 +68,13 @@ contains lots of (hopefully) clarifying comments.
|
|
68
68
|
* lib/reset.css
|
69
69
|
This file resets CSS values that browsers tend to set for you.
|
70
70
|
|
71
|
+
* lib/buttons.css
|
72
|
+
Provides some great CSS-only buttons.
|
73
|
+
|
74
|
+
* lib/compressed.css
|
75
|
+
A compressed version of the core files. Use this on every live site.
|
76
|
+
See screen.css for instructions.
|
77
|
+
|
71
78
|
|
72
79
|
Credits
|
73
80
|
----------------------------------------------------------------
|
@@ -1,7 +1,8 @@
|
|
1
1
|
/* --------------------------------------------------------------
|
2
2
|
|
3
3
|
Buttons.css
|
4
|
-
*
|
4
|
+
* Version: 0.5 (28/8/2007)
|
5
|
+
* Website: http://code.google.com/p/blueprintcss/
|
5
6
|
|
6
7
|
Created by Kevin Hale [particletree.com]
|
7
8
|
* particletree.com/features/rediscovering-the-button-element
|
@@ -24,7 +25,6 @@
|
|
24
25
|
<img src="css/blueprint/lib/img/icons/cross.png" alt=""/> Cancel
|
25
26
|
</a>
|
26
27
|
|
27
|
-
|
28
28
|
-------------------------------------------------------------- */
|
29
29
|
|
30
30
|
a.button, button {
|
@@ -1,127 +1,137 @@
|
|
1
|
-
/* Blueprint
|
1
|
+
/* Blueprint Compressed Version */
|
2
|
+
|
2
3
|
|
3
4
|
/* reset.css */
|
4
|
-
html,body,div,span,applet,object,iframe, h1,h2,h3,h4,h5,h6,p,blockquote,pre, a,abbr,acronym,address,big,cite,code, del,dfn,em,font,img,ins,kbd,q,s,samp,
|
5
|
+
html,body,div,span,applet,object,iframe, h1,h2,h3,h4,h5,h6,p,blockquote,pre, a,abbr,acronym,address,big,cite,code, del,dfn,em,font,img,ins,kbd,q,s,samp, strike,strong,sub,sup,tt,var, dl,dt,dd,ol,ul,li, fieldset,form,label,legend, table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
|
5
6
|
body{line-height:1;color:#333;background:white;}
|
6
7
|
table{border-collapse:separate;border-spacing:0;}
|
7
8
|
caption,th,td{text-align:left;font-weight:normal;}
|
8
9
|
blockquote:before,blockquote:after,q:before,q:after{content:"";}
|
9
10
|
blockquote,q{quotes:"" "";}
|
10
11
|
|
11
|
-
|
12
|
-
|
13
|
-
body{font-size:
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
h3{
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
12
|
+
|
13
|
+
/* typography.css */
|
14
|
+
body{font-size:12px;line-height:18px;}
|
15
|
+
h1,h2,h3, h4,h5,h6{font-family:Constantia,"Palatino Linotype",Palatino,Georgia,"Times New Roman",Times,serif;}
|
16
|
+
body{font-family:Frutiger,Univers,"Helvetica Neue","Lucida Grande",Calibri,Helvetica,Verdana,sans-serif;}
|
17
|
+
pre{font-family:Corbel,Verdana,"Bitstream Vera Sans",sans-serif;}
|
18
|
+
code{font-family:Consolas,"Bitstream Vera Sans Mono","Courier New",Monaco,Courier,monospace;}
|
19
|
+
h1,h2,h3,h4,h5,h6{color:#111;clear:both;}
|
20
|
+
h1{font-size:30px;line-height:36px;padding:0 0 18px 0;}
|
21
|
+
h2{font-size:20px;line-height:36px;}
|
22
|
+
h3{font-size:16px;line-height:36px;}
|
23
|
+
h4{font-size:14px;font-weight:bold;}
|
24
|
+
h5{font-size:12px;font-weight:bold;}
|
25
|
+
h6{font-size:12px;}
|
26
|
+
p{margin:0 0 18px 0;text-align:justify;}
|
23
27
|
p.last{margin-bottom:0;}
|
24
|
-
p img{float:left;margin:
|
28
|
+
p img{float:left;margin:18px 18px 18px 0;padding:0;}
|
25
29
|
p img.top{margin-top:0;}
|
26
|
-
|
30
|
+
a{color:#125AA7;text-decoration:underline;}
|
31
|
+
a:hover{color:#000;}
|
32
|
+
ul,ol{margin:0 0 18px 18px;}
|
33
|
+
ul{list-style-type:circle;}
|
27
34
|
ol{list-style-type:decimal;}
|
28
|
-
dl{margin:
|
35
|
+
dl{margin:0 0 18px 0;}
|
29
36
|
dl dt{font-weight:bold;}
|
30
|
-
|
31
|
-
a:hover{color:#000;}
|
32
|
-
blockquote{margin:1.5em 0 1.5em 1.5em;color:#666;font-style:italic;}
|
37
|
+
blockquote{margin:0 0 18px 18px;color:#666;font-style:italic;}
|
33
38
|
strong{font-weight:bold;}
|
34
39
|
em{font-style:italic;}
|
35
|
-
pre{margin-bottom:
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
table{margin-bottom:1.4em;border-top:0.1em solid #ddd;border-left:0.1em solid #ddd;}
|
40
|
-
th,td{height:1em;padding:0.2em 0.4em;border-bottom:0.1em solid #ddd;border-right:0.1em solid #ddd;}
|
40
|
+
pre{margin-bottom:18px;background:#eee;border:1px solid #ddd;padding:16px;}
|
41
|
+
hr{background:#B2CCFF;color:#B2CCFF;clear:both;float:none;width:100%;height:2px;margin:0 0 16px 0;border:none;}
|
42
|
+
table{margin-bottom:16px;border-top:1px solid #ddd;border-left:1px solid #ddd;}
|
43
|
+
th,td{height:13px;padding:2px 4px;border-bottom:1px solid #ddd;border-right:1px solid #ddd;}
|
41
44
|
th{font-weight:bold;}
|
42
|
-
|
43
|
-
|
44
|
-
p.small{font-size:0.8em;margin-bottom:1.875em;line-height:1.875em;}
|
45
|
-
p.large{font-size:1.2em;line-height:2.5em;}
|
45
|
+
p.small{font-size:10px;margin-bottom:18px;}
|
46
|
+
p.large{font-size:14px;line-height:36px;}
|
46
47
|
p.quiet{color:#666;}
|
47
48
|
.hide{display:none;}
|
48
|
-
.alt{color:#666;font-family:"Warnock Pro","Goudy Old Style","Palatino","Book Antiqua",serif;font-size:1.2em;line-height:1%;font-style:italic;}
|
49
|
+
.alt{color:#666;font-family:"Warnock Pro","Goudy Old Style","Palatino","Book Antiqua",Georgia,serif;font-size:1.2em;line-height:1%;font-style:italic;}
|
49
50
|
.dquo{margin-left:-.7em;}
|
50
|
-
p.incr,.incr p{font-size:
|
51
|
+
p.incr,.incr p{font-size:10px;line-height:1.44em;margin-bottom:18px;}
|
52
|
+
.caps{font-variant:small-caps;letter-spacing:1px;text-transform:lowercase;font-size:1.2em;line-height:1%;font-weight:bold;}
|
53
|
+
|
51
54
|
|
52
55
|
/* grid.css */
|
53
56
|
body{text-align:center;margin:36px 0;}
|
54
|
-
.container{text-align:left;position:relative;padding:0;margin:0 auto;width:
|
55
|
-
.column{float:left;margin:
|
57
|
+
.container{text-align:left;position:relative;padding:0;margin:0 auto;width:950px;}
|
58
|
+
.column{float:left;margin-right:10px;padding:0;}
|
56
59
|
* html .column{overflow-x:hidden;}
|
57
|
-
.border{padding-right:
|
58
|
-
.
|
60
|
+
.border{padding-right:4px;margin-right:5px;border-right:1px solid #ddd;}
|
61
|
+
.span-1{width:30px;}
|
62
|
+
.span-2{width:70px;}
|
63
|
+
.span-3{width:110px;}
|
64
|
+
.span-4{width:150px;}
|
65
|
+
.span-5{width:190px;}
|
66
|
+
.span-6{width:230px;}
|
67
|
+
.span-7{width:270px;}
|
68
|
+
.span-8{width:310px;}
|
69
|
+
.span-9{width:350px;}
|
70
|
+
.span-10{width:390px;}
|
71
|
+
.span-11{width:430px;}
|
72
|
+
.span-12{width:470px;}
|
73
|
+
.span-13{width:510px;}
|
74
|
+
.span-14{width:550px;}
|
75
|
+
.span-15{width:590px;}
|
76
|
+
.span-16{width:630px;}
|
77
|
+
.span-17{width:670px;}
|
78
|
+
.span-18{width:710px;}
|
79
|
+
.span-19{width:750px;}
|
80
|
+
.span-20{width:790px;}
|
81
|
+
.span-21{width:830px;}
|
82
|
+
.span-22{width:870px;}
|
83
|
+
.span-23{width:910px;}
|
84
|
+
.span-24{width:950px;margin:0;}
|
59
85
|
.last{margin-right:0;}
|
60
|
-
.
|
61
|
-
.
|
62
|
-
.
|
63
|
-
.
|
64
|
-
.
|
65
|
-
.
|
66
|
-
.
|
67
|
-
.
|
68
|
-
.
|
69
|
-
.
|
70
|
-
.
|
71
|
-
.
|
72
|
-
.
|
73
|
-
.
|
74
|
-
.
|
75
|
-
.
|
76
|
-
.
|
77
|
-
.
|
78
|
-
.
|
79
|
-
.
|
80
|
-
.
|
81
|
-
.
|
82
|
-
.
|
83
|
-
.
|
84
|
-
|
85
|
-
.
|
86
|
-
.
|
87
|
-
.
|
88
|
-
.
|
89
|
-
.
|
90
|
-
.
|
91
|
-
.
|
92
|
-
.
|
93
|
-
.
|
94
|
-
.
|
95
|
-
|
96
|
-
.prepend-10{padding-left:700px;}
|
97
|
-
.prepend-11{padding-left:770px;}
|
98
|
-
.prepend-12{padding-left:840px;}
|
99
|
-
.prepend-13{padding-left:910px;}
|
100
|
-
.box{padding:1.5em;margin-bottom:1.5em;background:#F0F0F0;}
|
101
|
-
.clear{display:inline-block;}
|
102
|
-
.clear:after,.container:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
|
103
|
-
* html .clear{height:1%;}
|
104
|
-
.clear{display:block;}
|
105
|
-
img{margin:0 0 1.5em 0;}
|
106
|
-
.pull-1{margin-left:-70px;}
|
107
|
-
.pull-2{margin-left:-140px;}
|
108
|
-
.pull-3{margin-left:-210px;}
|
109
|
-
.push-0{margin:0 0 0 1.5em;float:right;}
|
110
|
-
.push-1{margin:0 -88px 0 1.5em;float:right;}
|
111
|
-
.push-2{margin:0 -158px 0 1.5em;float:right;}
|
112
|
-
.push-3{margin:0 -228px 0 1.5em;float:right;}
|
86
|
+
.append-1{padding-right:40px;}
|
87
|
+
.append-2{padding-right:80px;}
|
88
|
+
.append-3{padding-right:120px;}
|
89
|
+
.append-4{padding-right:160px;}
|
90
|
+
.append-5{padding-right:200px;}
|
91
|
+
.append-6{padding-right:240px;}
|
92
|
+
.append-7{padding-right:280px;}
|
93
|
+
.append-8{padding-right:320px;}
|
94
|
+
.append-9{padding-right:360px;}
|
95
|
+
.append-10{padding-right:400px;}
|
96
|
+
.append-11{padding-right:440px;}
|
97
|
+
.append-12{padding-right:480px;}
|
98
|
+
.prepend-1{padding-left:40px;}
|
99
|
+
.prepend-2{padding-left:80px;}
|
100
|
+
.prepend-3{padding-left:120px;}
|
101
|
+
.prepend-4{padding-left:160px;}
|
102
|
+
.prepend-5{padding-left:200px;}
|
103
|
+
.prepend-6{padding-left:240px;}
|
104
|
+
.prepend-7{padding-left:280px;}
|
105
|
+
.prepend-8{padding-left:320px;}
|
106
|
+
.prepend-9{padding-left:360px;}
|
107
|
+
.prepend-10{padding-left:400px;}
|
108
|
+
.prepend-11{padding-left:440px;}
|
109
|
+
.prepend-12{padding-left:480px;}
|
110
|
+
img{margin:0 0 18px 0;}
|
111
|
+
.pull-1{margin-left:-40px;}
|
112
|
+
.pull-2{margin-left:-80px;}
|
113
|
+
.pull-3{margin-left:-120px;}
|
114
|
+
.pull-4{margin-left:-160px;}
|
115
|
+
.push-0{margin:0 0 0 18px;float:right;}
|
116
|
+
.push-1{margin:0 -40px 0 18px;float:right;}
|
117
|
+
.push-2{margin:0 -80px 0 18px;float:right;}
|
118
|
+
.push-3{margin:0 -120px 0 18px;float:right;}
|
119
|
+
.push-4{margin:0 -160px 0 18px;float:right;}
|
120
|
+
.pull-1,.pull-2,.pull-3,.pull-4, .push-1,.push-2,.push-3,.push-4{overflow-x:visible;}
|
121
|
+
|
113
122
|
|
114
123
|
/* buttons.css */
|
115
|
-
a.button,button{display:block;float:left;margin:0 0.583em 0.667em 0;padding:5px 10px 6px 7px;border:0.1em solid #dedede;border-top:0.1em solid #eee;border-left:0.1em solid #eee;background-color:#f5f5f5;line-height:130%;text-decoration:none;font-weight:bold;color:#565656;cursor:pointer;
|
116
|
-
button{width:auto;overflow:visible;padding:4px 10px 3px 7px}
|
117
|
-
button[type]{padding:5px 10px 5px 7px;line-height:17px}
|
118
|
-
*:first-child+html button[type]{padding:4px 10px 3px 7px}
|
119
|
-
button img,a.button img{margin:0 3px -3px 0 !important;padding:0;border:none;width:16px;height:16px}
|
120
|
-
button:hover,a.button:hover{background-color:#dff4ff;border:0.1em solid #c2e1ef;color:#336699}
|
121
|
-
a.button:active{background-color:#6299c5;border:1px solid #6299c5;color:#fff}
|
122
|
-
.positive{color:#529214}
|
123
|
-
a.positive:hover,button.positive:hover{background-color:#E6EFC2;border:0.1em solid #C6D880;color:#529214}
|
124
|
-
a.positive:active{background-color:#529214;border:0.1em solid #529214;color:#fff}
|
125
|
-
.negative{color:#d12f19}
|
126
|
-
a.negative:hover,button.negative:hover{background:#fbe3e4;border:0.1em solid #fbc2c4}
|
127
|
-
a.negative:active{background-color:#d12f19;border:0.1em solid #d12f19;color:#fff}
|
124
|
+
a.button,button{display:block;float:left;margin:0 0.583em 0.667em 0;padding:5px 10px 6px 7px;border:0.1em solid #dedede;border-top:0.1em solid #eee;border-left:0.1em solid #eee;background-color:#f5f5f5;font-family:"Lucida Grande",Tahoma,Arial,Verdana,sans-serif;font-size:100%;line-height:130%;text-decoration:none;font-weight:bold;color:#565656;cursor:pointer;}
|
125
|
+
button{width:auto;overflow:visible;padding:4px 10px 3px 7px;}
|
126
|
+
button[type]{padding:5px 10px 5px 7px;line-height:17px;}
|
127
|
+
*:first-child+html button[type]{padding:4px 10px 3px 7px;}
|
128
|
+
button img,a.button img{margin:0 3px -3px 0 !important;padding:0;border:none;width:16px;height:16px;}
|
129
|
+
button:hover,a.button:hover{background-color:#dff4ff;border:0.1em solid #c2e1ef;color:#336699;}
|
130
|
+
a.button:active{background-color:#6299c5;border:1px solid #6299c5;color:#fff;}
|
131
|
+
.positive{color:#529214;}
|
132
|
+
a.positive:hover,button.positive:hover{background-color:#E6EFC2;border:0.1em solid #C6D880;color:#529214;}
|
133
|
+
a.positive:active{background-color:#529214;border:0.1em solid #529214;color:#fff;}
|
134
|
+
.negative{color:#d12f19;}
|
135
|
+
a.negative:hover,button.negative:hover{background:#fbe3e4;border:0.1em solid #fbc2c4;}
|
136
|
+
a.negative:active{background-color:#d12f19;border:0.1em solid #d12f19;color:#fff;}
|
137
|
+
|
@@ -1,26 +1,28 @@
|
|
1
1
|
/* --------------------------------------------------------------
|
2
2
|
|
3
3
|
Grid.css
|
4
|
-
*
|
4
|
+
* Version: 0.5 (28/8/2007)
|
5
|
+
* Website: http://code.google.com/p/blueprintcss/
|
5
6
|
|
6
7
|
Based on work by:
|
8
|
+
* Olav Bjorkoy [bjorkoy.com]
|
7
9
|
* Nathan Borror [playgroundblues.com]
|
8
10
|
* Jeff Croft [jeffcroft.com]
|
9
11
|
* Christian Metts [mintchaos.com]
|
10
12
|
* Khoi Vinh [subtraction.com]
|
11
13
|
|
12
|
-
By default, the grid is
|
13
|
-
spanning
|
14
|
+
By default, the grid is 950px wide, with 24 columns
|
15
|
+
spanning 30px, and a 10px margin between columns.
|
14
16
|
|
15
17
|
If you need fewer or more columns, use this
|
16
18
|
formula to find the new total width:
|
17
19
|
|
18
|
-
Total width = (columns *
|
20
|
+
Total width = (columns * 30) - 10
|
19
21
|
|
20
22
|
-------------------------------------------------------------- */
|
21
23
|
|
22
24
|
body {
|
23
|
-
text-align: center; /*
|
25
|
+
text-align: center; /* IE6 Fix */
|
24
26
|
margin:36px 0;
|
25
27
|
}
|
26
28
|
|
@@ -30,7 +32,7 @@ body {
|
|
30
32
|
position: relative;
|
31
33
|
padding: 0;
|
32
34
|
margin: 0 auto; /* Centers layout */
|
33
|
-
width:
|
35
|
+
width: 950px; /* Total width */
|
34
36
|
}
|
35
37
|
|
36
38
|
|
@@ -43,135 +45,105 @@ body {
|
|
43
45
|
|
44
46
|
.column {
|
45
47
|
float: left;
|
46
|
-
margin:
|
48
|
+
margin-right: 10px;
|
47
49
|
padding: 0;
|
48
50
|
}
|
49
51
|
* html .column { overflow-x: hidden; } /* IE6 fix */
|
50
52
|
|
51
|
-
|
52
53
|
/* Add this class to a column if you want a border on its
|
53
54
|
right hand side. This should be customized to fit your needs. */
|
54
55
|
|
55
56
|
.border {
|
56
|
-
padding-right:
|
57
|
-
margin-right:
|
57
|
+
padding-right: 4px;
|
58
|
+
margin-right: 5px;
|
58
59
|
border-right: 1px solid #ddd;
|
59
60
|
}
|
60
61
|
|
61
62
|
|
62
|
-
/* The first and last elements in a multi-column
|
63
|
-
block needs one of these classes each. */
|
64
|
-
|
65
|
-
.first { margin-left: 0; }
|
66
|
-
.last { margin-right: 0; }
|
67
|
-
|
68
|
-
|
69
63
|
/* Use these classes to set how wide a column should be. */
|
70
|
-
.span-1 { width:
|
71
|
-
.span-2 { width:
|
72
|
-
.span-3 { width:
|
73
|
-
.span-4 { width:
|
74
|
-
.span-5 { width:
|
75
|
-
.span-6 { width:
|
76
|
-
.span-7 { width:
|
77
|
-
.span-8 { width:
|
78
|
-
.span-9 { width:
|
79
|
-
.span-10 { width:
|
80
|
-
.span-11 { width:
|
81
|
-
.span-12 { width:
|
82
|
-
.span-13 { width:
|
83
|
-
.span-14 { width:
|
64
|
+
.span-1 { width: 30px; }
|
65
|
+
.span-2 { width: 70px; }
|
66
|
+
.span-3 { width: 110px; }
|
67
|
+
.span-4 { width: 150px; }
|
68
|
+
.span-5 { width: 190px; }
|
69
|
+
.span-6 { width: 230px; }
|
70
|
+
.span-7 { width: 270px; }
|
71
|
+
.span-8 { width: 310px; }
|
72
|
+
.span-9 { width: 350px; }
|
73
|
+
.span-10 { width: 390px; }
|
74
|
+
.span-11 { width: 430px; }
|
75
|
+
.span-12 { width: 470px; }
|
76
|
+
.span-13 { width: 510px; }
|
77
|
+
.span-14 { width: 550px; }
|
78
|
+
.span-15 { width: 590px; }
|
79
|
+
.span-16 { width: 630px; }
|
80
|
+
.span-17 { width: 670px; }
|
81
|
+
.span-18 { width: 710px; }
|
82
|
+
.span-19 { width: 750px; }
|
83
|
+
.span-20 { width: 790px; }
|
84
|
+
.span-21 { width: 830px; }
|
85
|
+
.span-22 { width: 870px; }
|
86
|
+
.span-23 { width: 910px; }
|
87
|
+
.span-24 { width: 950px; margin: 0; }
|
88
|
+
|
89
|
+
/* The last element in a multi-column block needs this class. */
|
90
|
+
.last { margin-right: 0; }
|
84
91
|
|
85
92
|
/* Add these to a column to append empty cols. */
|
86
|
-
.append-1 { padding-right:
|
87
|
-
.append-2 { padding-right:
|
88
|
-
.append-3 { padding-right:
|
89
|
-
.append-4 { padding-right:
|
90
|
-
.append-5 { padding-right:
|
91
|
-
.append-6 { padding-right:
|
92
|
-
.append-7 { padding-right:
|
93
|
-
.append-8 { padding-right:
|
94
|
-
.append-9 { padding-right:
|
95
|
-
.append-10 { padding-right:
|
96
|
-
.append-11 { padding-right:
|
97
|
-
.append-12 { padding-right:
|
98
|
-
.append-13 { padding-right: 910px; }
|
93
|
+
.append-1 { padding-right: 40px; }
|
94
|
+
.append-2 { padding-right: 80px; }
|
95
|
+
.append-3 { padding-right: 120px; }
|
96
|
+
.append-4 { padding-right: 160px; }
|
97
|
+
.append-5 { padding-right: 200px; }
|
98
|
+
.append-6 { padding-right: 240px; }
|
99
|
+
.append-7 { padding-right: 280px; }
|
100
|
+
.append-8 { padding-right: 320px; }
|
101
|
+
.append-9 { padding-right: 360px; }
|
102
|
+
.append-10 { padding-right: 400px; }
|
103
|
+
.append-11 { padding-right: 440px; }
|
104
|
+
.append-12 { padding-right: 480px; }
|
99
105
|
|
100
106
|
/* Add these to a column to prepend empty cols. */
|
101
|
-
.prepend-1 { padding-left:
|
102
|
-
.prepend-2 { padding-left:
|
103
|
-
.prepend-3 { padding-left:
|
104
|
-
.prepend-4 { padding-left:
|
105
|
-
.prepend-5 { padding-left:
|
106
|
-
.prepend-6 { padding-left:
|
107
|
-
.prepend-7 { padding-left:
|
108
|
-
.prepend-8 { padding-left:
|
109
|
-
.prepend-9 { padding-left:
|
110
|
-
.prepend-10 { padding-left:
|
111
|
-
.prepend-11 { padding-left:
|
112
|
-
.prepend-12 { padding-left:
|
113
|
-
.prepend-13 { padding-left: 910px; }
|
114
|
-
|
115
|
-
|
116
|
-
/* Use a .box to create a padded box inside a column.
|
117
|
-
Sticking to the the baseline. */
|
118
|
-
|
119
|
-
.box {
|
120
|
-
padding: 1.5em;
|
121
|
-
margin-bottom: 1.5em;
|
122
|
-
background: #f0f0f0;
|
123
|
-
}
|
124
|
-
|
125
|
-
|
126
|
-
/* Clearing floats without extra markup
|
127
|
-
Based on How To Clear Floats Without Structural Markup by PiE
|
128
|
-
[http://www.positioniseverything.net/easyclearing.html] */
|
129
|
-
|
130
|
-
.clear { display: inline-block; }
|
131
|
-
.clear:after, .container:after {
|
132
|
-
content: ".";
|
133
|
-
display: block;
|
134
|
-
height: 0;
|
135
|
-
clear: both;
|
136
|
-
visibility: hidden;
|
137
|
-
}
|
138
|
-
* html .clear { height: 1%; }
|
139
|
-
.clear { display: block; }
|
107
|
+
.prepend-1 { padding-left: 40px; }
|
108
|
+
.prepend-2 { padding-left: 80px; }
|
109
|
+
.prepend-3 { padding-left: 120px; }
|
110
|
+
.prepend-4 { padding-left: 160px; }
|
111
|
+
.prepend-5 { padding-left: 200px; }
|
112
|
+
.prepend-6 { padding-left: 240px; }
|
113
|
+
.prepend-7 { padding-left: 280px; }
|
114
|
+
.prepend-8 { padding-left: 320px; }
|
115
|
+
.prepend-9 { padding-left: 360px; }
|
116
|
+
.prepend-10 { padding-left: 400px; }
|
117
|
+
.prepend-11 { padding-left: 440px; }
|
118
|
+
.prepend-12 { padding-left: 480px; }
|
140
119
|
|
141
120
|
|
142
|
-
/* Nudge your elements [subtraction.com/archives/2007/0606_nudge_your_e.php]:
|
143
|
-
All block elements (not hr) inside a col should have a 5px padding on each side.
|
144
|
-
(Not everyone wants this, but feel free to uncomment if you do.)
|
145
|
-
|
146
|
-
p,ul,ol,dl,h1,h2,h3,h4,h5,h6,
|
147
|
-
caption,pre,blockquote,input,textarea {
|
148
|
-
padding-left: 5px;
|
149
|
-
padding-right: 5px;
|
150
|
-
}
|
151
|
-
div, table {
|
152
|
-
margin-left: 5px;
|
153
|
-
margin-right: 5px;
|
154
|
-
padding: 0;
|
155
|
-
} */
|
156
|
-
|
157
121
|
|
158
122
|
/* Images
|
159
123
|
-------------------------------------------------------------- */
|
160
124
|
|
161
125
|
/* Remember the baseline (typography.css). */
|
162
|
-
img { margin: 0 0
|
126
|
+
img { margin: 0 0 18px 0; }
|
163
127
|
|
164
128
|
|
165
129
|
/* Use these classes to make an image flow into the column before
|
166
130
|
or after it. This techique can also be used on other objects. */
|
167
131
|
|
168
|
-
.pull-1 { margin-left: -
|
169
|
-
.pull-2 { margin-left: -
|
170
|
-
.pull-3 { margin-left: -
|
132
|
+
.pull-1 { margin-left: -40px; }
|
133
|
+
.pull-2 { margin-left: -80px; }
|
134
|
+
.pull-3 { margin-left: -120px; }
|
135
|
+
.pull-4 { margin-left: -160px; }
|
171
136
|
|
172
|
-
.push-0 { margin: 0 0 0
|
173
|
-
.push-1 { margin: 0 -
|
174
|
-
.push-2 { margin: 0 -
|
175
|
-
.push-3 { margin: 0 -
|
137
|
+
.push-0 { margin: 0 0 0 18px; float: right; } /* Right aligns the image. */
|
138
|
+
.push-1 { margin: 0 -40px 0 18px; float: right; }
|
139
|
+
.push-2 { margin: 0 -80px 0 18px; float: right; }
|
140
|
+
.push-3 { margin: 0 -120px 0 18px; float: right; }
|
141
|
+
.push-4 { margin: 0 -160px 0 18px; float: right; }
|
142
|
+
|
143
|
+
.pull-1, .pull-2, .pull-3, .pull-4,
|
144
|
+
.push-1, .push-2, .push-3, .push-4 {
|
145
|
+
overflow-x: visible; /* Overrides previous IE6 fix (needs improvement). */
|
146
|
+
}
|
176
147
|
|
148
|
+
/* EOF */
|
177
149
|
|