alexcabrera-graphpaper 0.2.3

Sign up to get free protection for your applications and to get access to all the features.
data/README.markdown ADDED
@@ -0,0 +1,20 @@
1
+ Installing
2
+ ==========
3
+
4
+ $> sudo gem install alexcabrera-graphpaper --source http://gems.github.com/
5
+
6
+ Creating a New Project Based on GraphPaper
7
+ ==========================================
8
+
9
+ $> compass -r graphpaper -f graphpaper my_graphpaper_project
10
+
11
+ Related Links
12
+ =============
13
+
14
+ * The GraphPaper project is hosted on [GitHub][project_url].
15
+ * The [GraphPaper Wiki][wiki].
16
+ * The [Compass Stylesheet Authoring Framework][compass_homepage].
17
+
18
+ [project_url]: http://github.com/alexcabrera/graphpaper
19
+ [wiki]: http://wiki.github.com/alexcabrera/graphpaper
20
+ [compass_homepage]: http://compass-style.org/
data/Rakefile ADDED
@@ -0,0 +1,22 @@
1
+ begin
2
+ require 'jeweler'
3
+ Jeweler::Tasks.new do |gemspec|
4
+ gemspec.name = "graphpaper"
5
+ gemspec.summary = "A Sass library for use with the Compass stylesheet authoring framework."
6
+ gemspec.description = "A great starting point for projects that makes no design assumptions."
7
+ gemspec.email = "alex@policus.com"
8
+ gemspec.homepage = "http://github.com/alexcabrera/graphpaper"
9
+ gemspec.authors = ["Alex Cabrera"]
10
+ gemspec.files = []
11
+ gemspec.files << "graphpaper.gemspec"
12
+ gemspec.files << "README.markdown"
13
+ gemspec.files << "Rakefile"
14
+ gemspec.files << "VERSION.yml"
15
+ gemspec.files += Dir.glob("lib/**/*")
16
+ gemspec.files += Dir.glob("stylesheets/**/*")
17
+ gemspec.files += Dir.glob("templates/**/*")
18
+ gemspec.files -= Dir.glob("pkg/**/*")
19
+ end
20
+ rescue LoadError
21
+ puts "Jeweler not available. Install it with: sudo gem install technicalpickles-jeweler -s http://gems.github.com"
22
+ end
data/VERSION.yml ADDED
@@ -0,0 +1,4 @@
1
+ ---
2
+ :minor: 2
3
+ :patch: 3
4
+ :major: 0
@@ -0,0 +1,54 @@
1
+ # -*- encoding: utf-8 -*-
2
+
3
+ Gem::Specification.new do |s|
4
+ s.name = %q{graphpaper}
5
+ s.version = "0.2.3"
6
+
7
+ s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
8
+ s.authors = ["Alex Cabrera"]
9
+ s.date = %q{2009-07-11}
10
+
11
+ s.description = %q{A great starting point for projects that makes no design assumptions.}
12
+ s.email = %q{alex@policus.com}
13
+ s.extra_rdoc_files = [
14
+ "README.markdown"
15
+ ]
16
+ s.files = [
17
+ "README.markdown",
18
+ "Rakefile",
19
+ "VERSION.yml",
20
+ "graphpaper.gemspec",
21
+ "lib/graphpaper.rb",
22
+ "stylesheets/_graphpaper.sass",
23
+ "stylesheets/graphpaper/_ie.sass",
24
+ "stylesheets/graphpaper/_print.sass",
25
+ "stylesheets/graphpaper/_screen.sass",
26
+ "stylesheets/graphpaper/modules/_colors.sass",
27
+ "stylesheets/graphpaper/modules/_grid.sass",
28
+ "stylesheets/graphpaper/modules/_lists.sass",
29
+ "stylesheets/graphpaper/modules/_reset.sass",
30
+ "stylesheets/graphpaper/modules/_sitemap.sass",
31
+ "templates/project/ie.sass",
32
+ "templates/project/manifest.rb",
33
+ "templates/project/partials/_base.sass",
34
+ "templates/project/partials/_config.sass",
35
+ "templates/project/print.sass",
36
+ "templates/project/screen.sass",
37
+ "templates/project/sitemap.sass"
38
+ ]
39
+ s.homepage = %q{http://github.com/alexcabrera/graphpaper}
40
+ s.rdoc_options = ["--charset=UTF-8"]
41
+ s.require_paths = ["lib"]
42
+ s.rubygems_version = %q{1.3.3}
43
+ s.summary = %q{A Sass library for use with the Compass stylesheet authoring framework.}
44
+
45
+ if s.respond_to? :specification_version then
46
+ current_version = Gem::Specification::CURRENT_SPECIFICATION_VERSION
47
+ s.specification_version = 3
48
+
49
+ if Gem::Version.new(Gem::RubyGemsVersion) >= Gem::Version.new('1.2.0') then
50
+ else
51
+ end
52
+ else
53
+ end
54
+ end
data/lib/graphpaper.rb ADDED
@@ -0,0 +1,2 @@
1
+ graphpaper_dir = File.expand_path(File.join(File.dirname(__FILE__), ".."))
2
+ Compass::Frameworks.register('graphpaper', graphpaper_dir)
@@ -0,0 +1,3 @@
1
+ @import graphpaper/screen.sass
2
+ @import graphpaper/print.sass
3
+ @import graphpaper/ie.sass
File without changes
File without changes
@@ -0,0 +1,4 @@
1
+ @import graphpaper/modules/reset.sass
2
+ @import graphpaper/modules/colors.sass
3
+ @import graphpaper/modules/grid.sass
4
+ @import graphpaper/modules/lists.sass
@@ -0,0 +1,130 @@
1
+ // Ever wanted to use Crayola crayon names in your CSS instead
2
+ // of ugly hex values? Of course you do.
3
+
4
+ // Values taken from this article on ColourLovers:
5
+ // http://www.colourlovers.com/blog/2008/04/22/all-120-crayon-names-color-codes-and-fun-facts/
6
+
7
+ // All constants are set as optional assingment in case you
8
+ // want to overwrite the name in your Sass file, but why would you
9
+ // want to go and do that?
10
+
11
+ !mahogany ||= #cd4a4a
12
+ !fuzzy_wuzzy_brown ||= #cc6666
13
+ !chestnut ||= #bc5d58
14
+ !red_orange ||= #ff5349
15
+ !sunset_orange ||= #fd5e53
16
+ !bittersweet ||= #fd7c6e
17
+ !melon ||= #fdbcb4
18
+ !outrageous_orange ||= #ff6e4a
19
+ !vivid_tangerine ||= #ffa089
20
+ !burnt_sienna ||= #ea7e5d
21
+ !brown ||= #b4674d
22
+ !sepia ||= #a5694f
23
+ !orange ||= #ff7538
24
+ !burnt_orange ||= #ff7f49
25
+ !copper ||= #dd9475
26
+ !mango_tango ||= #ff8243
27
+ !atomic_tangerine ||= #ffa474
28
+ !beaver ||= #9f8170
29
+ !antique_brass ||= #cd9575
30
+ !desert_sand ||= #efcdb8
31
+ !raw_sienna ||= #d68a59
32
+ !tumbleweed ||= #deaa88
33
+ !tan ||= #faa76c
34
+ !peach ||= #ffcfab
35
+ !macaroni_and_cheese ||= #ffbd88
36
+ !apricot ||= #fdd9b5
37
+ !neon_carrot ||= #ffa343
38
+ !almond ||= #efdbc5
39
+ !yellow_orange ||= #ffb653
40
+ !gold ||= #e7c697
41
+ !shadow ||= #8a795d
42
+ !banana_mania ||= #fae7b5
43
+ !sunglow ||= #ffcf48
44
+ !goldenrod ||= #fcd975
45
+ !dandelion ||= #fddb6d
46
+ !yellow ||= #fce883
47
+ !green_yellow ||= #f0e891
48
+ !spring_green ||= #eceabe
49
+ !olive_green ||= #bab86c
50
+ !laser_lemon ||= #fdfc74
51
+ !unmellow_yellow ||= #fdfc74
52
+ !canary ||= #ffff99
53
+ !yellow_green ||= #c5e384
54
+ !inch_worm ||= #b2ec5d
55
+ !asparagus ||= #87a96b
56
+ !granny_smith_apple ||= #a8e4a0
57
+ !electric_lime ||= #1df914
58
+ !screamin_green ||= #76ff7a
59
+ !fern ||= #71bc78
60
+ !forest_green ||= #6dae81
61
+ !sea_green ||= #9fe2bf
62
+ !green ||= #1cac78
63
+ !mountain_meadow ||= #30ba8f
64
+ !shamrock ||= #45cea2
65
+ !jungle_green ||= #3bb08f
66
+ !caribbean_green ||= #1cd3a2
67
+ !tropical_rain_forest ||= #17806d
68
+ !pine_green ||= #158078
69
+ !robin_egg_blue ||= #1fcecb
70
+ !aquamarine ||= #78dbe2
71
+ !turquoise_blue ||= #77dde7
72
+ !sky_blue ||= #80daeb
73
+ !outer_space ||= #414a4c
74
+ !blue_green ||= #199ebd
75
+ !pacific_blue ||= #1ca9c9
76
+ !cerulean ||= #1dacd6
77
+ !cornflower ||= #9aceeb
78
+ !midnight_blue ||= #1a4876
79
+ !navy_blue ||= #1974d2
80
+ !denim ||= #2b6cc4
81
+ !blue ||= #1f75fe
82
+ !periwinkle ||= #c5d0e6
83
+ !cadet_blue ||= #b0b7c6
84
+ !indigo ||= #5d76cb
85
+ !wild_blue_yonder ||= #a2add0
86
+ !manatee ||= #979aaa
87
+ !blue_bell ||= #adadd6
88
+ !blue_violet ||= #7366bd
89
+ !purple_heart ||= #7442c8
90
+ !royal_purple ||= #7851a9
91
+ !purple_mountains_majesty ||= #9d81ba
92
+ !violet_purple ||= #926eae
93
+ !wisteria ||= #cda4de
94
+ !vivid_violet ||= #8f509d
95
+ !fuchsia ||= #c364c5
96
+ !shocking_pink ||= #fb7efd
97
+ !pink_flamingo ||= #fc74fd
98
+ !plum ||= #8e4585
99
+ !hot_magenta ||= #ff1dce
100
+ !purple_pizzazz ||= #ff1dce
101
+ !razzle_dazzle_rose ||= #ff48d0
102
+ !orchid ||= #e6a8d7
103
+ !red_violet ||= #c0448f
104
+ !eggplant ||= #6e5160
105
+ !cerise ||= #dd4492
106
+ !wild_strawberry ||= #ff43a4
107
+ !magenta ||= #f664af
108
+ !lavender ||= #fcb4d5
109
+ !cotton_candy ||= #ffbcd9
110
+ !violet_red ||= #f75394
111
+ !carnation_pink ||= #ffaacc
112
+ !razzmatazz ||= #e3256b
113
+ !piggy_pink ||= #fdd7e4
114
+ !jazzberry_jam ||= #ca3767
115
+ !blush ||= #de5d83
116
+ !tickle_me_pink ||= #fc89ac
117
+ !pink_sherbet ||= #f780a1
118
+ !maroon ||= #c8385a
119
+ !red ||= #ee204d
120
+ !radical_red ||= #ff496c
121
+ !mauvelous ||= #ef98aa
122
+ !wild_watermelon ||= #fc6c85
123
+ !scarlet ||= #fc2847
124
+ !salmon ||= #ff9baa
125
+ !brick_red ||= #cb4154
126
+ !white ||= #ededed
127
+ !timberwolf ||= #dbd7d2
128
+ !silver ||= #cdc5c2
129
+ !gray ||= #95918c
130
+ !black ||= #232323
@@ -0,0 +1,186 @@
1
+ // ----------------------------------------------------------------------------------------------------------------
2
+ //
3
+ // Graphpaper's Grid System
4
+ // ========================
5
+ //
6
+ // Based on Chris Eppstein's Sassification of the Blueprint CSS framework,
7
+ // Graphpaper's grid library aims at creating a simple, lightweight way to
8
+ // build a fixed-width grid-based layout with the least amount of
9
+ // public-facing mixins.
10
+ //
11
+ // This library is, admittedly, not as well tested as Blueprint; but should
12
+ // work just fine under modern browsers. I'd be able to further simplify
13
+ // this library if the Internet Explorer team could just find it in their
14
+ // hearts to implement the goddamn :last-child selector; but alas, Microsoft
15
+ // deems it neccessary to further tarnish themselves with developers until
16
+ // there's nobody left to develop for their shitty platform.
17
+ //
18
+ // - Alex Cabrera, 08-JUL-2009
19
+ //
20
+ // ----------------------------------------------------------------------------------------------------------------
21
+
22
+ // Imports required libraries
23
+
24
+ @import compass/utilities/general/float.sass
25
+ @import graphpaper/modules/colors.sass
26
+
27
+ // Default grid constants. It's pretty much the same as Blueprint but with one
28
+ // important exception. Graphpaper can add padding to the left of the grid
29
+ // container to add a little breathing room.
30
+
31
+ !graphpaper_grid_columns ||= 24
32
+ !graphpaper_grid_width ||= 30px
33
+ !graphpaper_grid_margin ||= 10px
34
+ !graphpaper_grid_padding ||= 10px
35
+
36
+ !graphpaper_grid_outer_width = !graphpaper_grid_width + !graphpaper_grid_margin
37
+ !graphpaper_container_size = !graphpaper_grid_outer_width * !graphpaper_grid_columns - !graphpaper_grid_margin
38
+
39
+ // ----------------------------------------------------------------------------------------------------------------
40
+ //
41
+ // MIXIN: grid-container(center[true], add_padding_if_not_centered[true])
42
+ // USAGE: --- PUBLIC ---
43
+ // This mixin should be used on the element containing the contents of your
44
+ // page. By default, the grid is set to be aligned to the center of the
45
+ // browser window. By setting the first argument to "false", the grid
46
+ // will be aligned to the left side of the page. Additionally, this will
47
+ // trigger padding to be automatically added to the left side of the
48
+ // grid container. You can turn this off, by setting the second argument
49
+ // to "false" [ex. +grid-container(false, false)]
50
+
51
+ =grid-container(!center = true, !add_padding = true)
52
+
53
+ @if !center
54
+ :margin 0px auto
55
+ @else
56
+
57
+ @if !add_padding
58
+ :padding-left = !graphpaper_grid_padding
59
+
60
+ :width = !graphpaper_container_size
61
+ +clearfix
62
+
63
+
64
+ // ----------------------------------------------------------------------------------------------------------------
65
+ //
66
+ // MIXIN: container
67
+ // USAGE: --- PUBLIC ---
68
+ // This mixin is intended for page elements that contain any number of grid
69
+ // columns. It provides the float clear for these internal columns.
70
+
71
+ =container
72
+ :display block
73
+ :margin-bottom 10px
74
+ :width = 100%
75
+ +clearfix
76
+
77
+ // ----------------------------------------------------------------------------------------------------------------
78
+ //
79
+ // MIXIN: last
80
+ // USAGE: --- PUBLIC ---
81
+ // The last mixin should be used in your IE stylesheet to remove the gutter
82
+ // from the last column in a container. Stylesheets targeting modern browsers
83
+ // such as Safari, Firefox, or Chrome do not need to add mixin because the
84
+ // column mixin utilizes the :last-child psuedo selector to automatically
85
+ // remove the gutter. Isn't that nice?
86
+
87
+ =last
88
+ :margin-right 0
89
+
90
+ // ----------------------------------------------------------------------------------------------------------------
91
+ //
92
+ // MIXIN: column-span(number_of_columns, add_right_gutter[false])
93
+ // USAGE: --- PRIVATE --
94
+ // You should never need to use this mixin in your own stylesheets. Graphpaper
95
+ // uses the column-span to set the width of a column
96
+
97
+ =column-span(!n)
98
+ :width = !graphpaper_grid_width * !n + (!graphpaper_grid_margin * (!n - 1))
99
+
100
+ // ----------------------------------------------------------------------------------------------------------------
101
+ //
102
+ // MIXIN: column(number_of_columns, add_right_gutter[false])
103
+ // USAGE: --- PUBLIC ---
104
+ // Use +column for any element that you would like to become part of the grid structure of your document.
105
+ // These work almost exactly like Blueprint columns with a few exceptions:
106
+ //
107
+ // 1. By default, the column mixin will make the scoped element span one grid column. You can change this
108
+ // by setting the first argument to an integer equal to the number of columns you wish the element
109
+ // to span.
110
+ // 2. You do not need to add "true" as the second argument to denote the last column in a container. This
111
+ // mixin uses the :last-child selector to automatically remove the gutter for the last column. This,
112
+ // however, does not work in Internet Explorer. To compensate for this, you should add the +last mixin
113
+ // to the last element in your conditional IE stylesheet. Should Microsoft ever get its head out of its
114
+ // ass and decide to implement :last-child, I won't need to go back and change this code.
115
+ // 3. Sometimes, you might want to add some right-side padding to a column (maybe to make it look like a
116
+ // double gutter). You can do this by setting the second argument to "true".
117
+ //
118
+ // This is a pretty important mixin, so some examples shoule be in order.
119
+ //
120
+ // Example 1: Spanning an element over 5 columns
121
+ // +column(5)
122
+ //
123
+ // Example 2: Spanning an element 2 columns, and adding padding to the right equal to the gutter width
124
+ // +column(5, true)
125
+
126
+ =column(!n = 1)
127
+ +float("left")
128
+ +column-span(!n)
129
+ :margin-right = !graphpaper_grid_margin
130
+
131
+ &:last-child
132
+ +last
133
+
134
+ // ----------------------------------------------------------------------------------------------------------------
135
+ //
136
+ // MIXIN: prepend(number_of_columns)
137
+ // USAGE: --- PUBLIC --
138
+ // Add padding to the left of a column equal to the number of columns in the mixin argument. The mixin
139
+ // defaults to prepending the element with a single column.
140
+
141
+ =prepend(!n = 1)
142
+ :padding-left = !graphpaper_grid_outer_width * !n
143
+
144
+ // ----------------------------------------------------------------------------------------------------------------
145
+ //
146
+ // MIXIN: append(number_of_columns)
147
+ // USAGE: --- PUBLIC ---
148
+ // Add padding to the right of a column equal to the number of columns in the mixin's argument. The mixin
149
+ // defaults to appending the element with a single column.
150
+
151
+ =append(!n = 1)
152
+ :padding-right = !graphpaper_grid_outer_width * !n
153
+
154
+ // ----------------------------------------------------------------------------------------------------------------
155
+ //
156
+ // MIXIN: push(number_of_columns)
157
+ // USAGE: --- PUBLIC ---
158
+ // Moves an element to the right equal to the number of columns specified in the mixin's argument. The mixin
159
+ // defaults to pushing the element a single column.
160
+
161
+ =push(!n = 1)
162
+ +float("left")
163
+ :margin-left = !graphpaper_grid_outer_width * !n
164
+
165
+ // ----------------------------------------------------------------------------------------------------------------
166
+ //
167
+ // MIXIN: pull(number_of_columns)
168
+ // USAGE: --- PUBLIC ---
169
+ // Pulls an element to the left equal to the number of columns specified in the mixin's argument. The mixin
170
+ // defaults to pulling the element a single column.
171
+
172
+ =pull(!n = 1)
173
+ +float("left")
174
+ :margin-left = (!graphpaper_grid_outer_width * !n) * -1
175
+
176
+ // ----------------------------------------------------------------------------------------------------------------
177
+ //
178
+ // MIXIN: border(hex_value_of_border_color)
179
+ // USAGE: --- PUBLIC ---
180
+ // Adds a border to the right of the scoped element. The color of the border defaults to gray as defined
181
+ // in Graphpaper's color file.
182
+
183
+ =border(!border_color = !gray)
184
+ :padding-right = !graphpaper_column_gutter / 2 - 1
185
+ :margin-right = !graphpaper_column_gutter / 2
186
+ :border-right 1px solid #{!border_color}
@@ -0,0 +1,10 @@
1
+ =horizontal-list(!item_width = 2)
2
+ li
3
+ +column(!item_width)
4
+
5
+ &:last-child
6
+ +last
7
+
8
+ a
9
+ :display block
10
+ :width 100%
@@ -0,0 +1,3 @@
1
+ @import compass/utilities/general/reset.sass
2
+
3
+ +global-reset
@@ -0,0 +1,127 @@
1
+ // ----------------------------------------------------------------------------------------------------------------
2
+ //
3
+ // Easy Site Maps
4
+ // ========================
5
+ //
6
+ // This is an adaptation of SlickMap CSS (http://astuteo.com/slickmap/) by Astuteo.
7
+ // It's not as pretty as the sitemaps produced by that library (this one doen't
8
+ // include any images), but it gets the job done. It creates clickable sitemaps
9
+ // from unordered lists. Use it to help develop the architecture for your site
10
+ // during your prototyping process.
11
+ //
12
+ // To use it, simply mix +build-sitemap into the top level ul element.
13
+ //
14
+ // ----------------------------------------------------------------------------------------------------------------
15
+
16
+ @import graphpaper/modules/reset.sass
17
+ @import graphpaper/modules/colors.sass
18
+ @import graphpaper/modules/grid.sass
19
+
20
+
21
+ =build-sitemap
22
+
23
+ :font-family "Helvetica", "Arial", sans-serif
24
+
25
+ #info
26
+ :margin-top 40px
27
+ :margin-left 40px
28
+
29
+
30
+ h1
31
+ :font-size 36px
32
+ :font-weight bold
33
+ :line-height 36px
34
+ :margin-bottom 18px
35
+
36
+ h2
37
+ :font-size 14px
38
+ :font-weight bold
39
+ :line-height 18px
40
+
41
+ ul#sitemap
42
+ :color #{!black}
43
+ :padding 40px
44
+ :font-size 12px
45
+ :line-height 1
46
+ :list-style none
47
+
48
+ a
49
+
50
+ &:link, &:visited
51
+
52
+ &:before
53
+ :content " "attr(href)" "
54
+ :display block
55
+ :text-transform uppercase
56
+ :font-size 10px
57
+ :margin-bottom 5px
58
+ :word-wrap break-word
59
+
60
+ li
61
+ :float left
62
+ :width 200px
63
+ :padding 30px 0
64
+ :margin-top -30px
65
+
66
+ a
67
+ :margin 0 20px 0 0
68
+ :padding 10px 0
69
+ :display block
70
+ :font-size 14px
71
+ :font-weight bold
72
+ :text-align center
73
+ :color #{!black}
74
+ :background #C3EAFB
75
+ :border 2px solid #B5D9EA
76
+
77
+ &:hover
78
+ :background-color #E2F4FD
79
+ :border-color #97BDCF
80
+
81
+ // Second Level
82
+
83
+ li
84
+ :width 100%
85
+ :clear left
86
+ :margin-top 0
87
+ :padding 10px 0 0 0
88
+
89
+ &:first-child
90
+ :padding-top 30px
91
+
92
+ a
93
+ :background-color #CEE3AC
94
+ :border-color #B8DA83
95
+
96
+ &:link, &:visited
97
+
98
+ &:before
99
+ :color #8FAF5C
100
+
101
+ // Third Level
102
+
103
+ ul
104
+ :margin 0
105
+ :width 100%
106
+ :float right
107
+
108
+ li
109
+ :padding 5px 0
110
+
111
+ &:first-child
112
+ :padding 15px 0 5px 0
113
+
114
+ a
115
+ :background-color #FFF7AA
116
+ :border-color #E3CA4B
117
+ :font-size 12px
118
+ :padding 5px 0
119
+ :margin-right 10%
120
+ :width 70%
121
+ :float right
122
+
123
+ &:link, &:visited
124
+
125
+ &:before
126
+ :color #CCAE14
127
+ :font-size 9px
@@ -0,0 +1 @@
1
+ @import graphpaper/ie.sass
@@ -0,0 +1,4 @@
1
+ stylesheet 'screen.sass', :media => 'screen, projection'
2
+ stylesheet 'partials/_base.sass'
3
+ stylesheet 'print.sass', :media => 'print'
4
+ stylesheet 'ie.sass', :media => 'screen, projection', :condition => "lt IE 8"
@@ -0,0 +1,65 @@
1
+ // --------------------------------------------------------------------
2
+ // Graphpaper Base File
3
+ // ========================
4
+ //
5
+ // Use this define the styles for common elements throughout your site
6
+ // and import any other supporting Sass files.
7
+ //
8
+ // --------------------------------------------------------------------
9
+
10
+ // Step 1. Initialize Your Grid
11
+ //
12
+ // Relevant Mixin
13
+ //
14
+ // +grid-container(center = true, add_padding_if_not_centered = true)
15
+ //
16
+ // In order to initialize the Graphpaper grid module, you need to mix
17
+ // +grid-container into the element that contains the content of your
18
+ // page.
19
+ //
20
+ // Example (uncomment and modify for your own use)
21
+ //
22
+ // #pageContainer
23
+ // +grid-container
24
+ //
25
+ // If you wish to align your grid container to the left of the page
26
+ // and add padding based on the values in partials/_config.sass,
27
+ // +grid-container has two vailable arguments.
28
+ //
29
+ // The first argument sets positioning of the grid. Graphpaper's
30
+ // default behavior is to center the element on the page. If you wish
31
+ // to align the element to the left of the page, set the first
32
+ // argument to false.
33
+ //
34
+ // #pageContainer
35
+ // +grid-container(false)
36
+ //
37
+ // Aligning the container to the left will automatically add a
38
+ // :padding-left property to the element equal to the value of
39
+ // !graphpaper_grid_padding in partials/_config.sass
40
+ //
41
+ // To disable the padding, add a second "false" argument to grid-container
42
+ //
43
+ // #pageContainer
44
+ // +grid-container(false, false)
45
+ //
46
+
47
+ // Step 2. Style Common Site Elements
48
+ //
49
+ // Below, style common elements that appear across your site. Examples
50
+ // may include page headers, global navigation, or site footers.
51
+
52
+
53
+ // Step 3. Layout the Rest of Your Site
54
+ //
55
+ // Graphpaper's recommendation is to set the id element of each page on
56
+ // your site to the same name as the sass file that will style it. Scope
57
+ // all elements under body#id_name for an easy way keep your project
58
+ // maintainable. Generally, this id name will be the section of the site
59
+ // the content falls under. Examples include "home", "archives", and
60
+ // "contact".
61
+ //
62
+ // If this recommendation works for you, import those files below. Order
63
+ // will not matter since scoping under the body tag should eleminiate any
64
+ // issues that may arise from commonly named elements across different
65
+ // sections of your site.
@@ -0,0 +1,23 @@
1
+ // --------------------------------------------------------------------
2
+ // Graphpaper Configuration
3
+ // ========================
4
+ //
5
+ // These are values for the default Graphpaper grid. They will produce
6
+ // the standard 950px Blueprint layout.
7
+ //
8
+ // The !graphpaper_grid_padding value is not used unless you opt to
9
+ // left align your site by mixing +grid-container(false) in which
10
+ // case, it will apply the value to the :padding-left property of
11
+ // the element containing the grid.
12
+ //
13
+ // --------------------------------------------------------------------
14
+
15
+ !graphpaper_grid_columns = 24
16
+ !graphpaper_grid_width = 30px
17
+ !graphpaper_grid_margin = 10px
18
+ !graphpaper_grid_padding = 10px
19
+
20
+ // If this is your first time in this file, your next step will probably
21
+ // be in partials/_base.sass. There Graphpaper will walk you through
22
+ // applying the grid on your site and recommend some best practicies that
23
+ // will make it easier to work with Graphpaper.
@@ -0,0 +1 @@
1
+ @import graphpaper/print.sass
@@ -0,0 +1,2 @@
1
+ @imoprt partials/base.sass
2
+ @import graphpaper/screen.sass
@@ -0,0 +1,34 @@
1
+ @import graphpaper/modules/sitemap.sass
2
+
3
+ // Use the template below to quickly build a sitemap.
4
+ //
5
+ // <!DOCTYPE html>
6
+ // <html>
7
+ // <head>
8
+ // <title>Sample Sitemap</title>
9
+ // <link rel="stylesheet" type="text/css" href="stylesheets/sitemap.css" media="screen, projection">
10
+ // </head>
11
+ // <body id="sitemap">
12
+ // <ul>
13
+ // <li><a href="#">Section 1</a></li>
14
+ // <li>
15
+ // <a href="#">Section 2</a>
16
+ // <ul>
17
+ // <li><a href="#">Sub-Section 1</a></li>
18
+ // <li>
19
+ // <a href="#">Sub-Section 2</a>
20
+ // <ul>
21
+ // <li><a href="#">Sub-Sub-Section 1</a></li>
22
+ // <li><a href="#">Sub-Sub-Section 2</a></li>
23
+ // </ul>
24
+ // </li>
25
+ // <li><a href="#">Sub-Section 3</a></li>
26
+ // </ul>
27
+ // </li>
28
+ // <li><a href="#">Sub-Section 4</a></li>
29
+ // </ul>
30
+ // </body>
31
+ // </html>
32
+
33
+ body
34
+ +build-sitemap
metadata ADDED
@@ -0,0 +1,73 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: alexcabrera-graphpaper
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.2.3
5
+ platform: ruby
6
+ authors:
7
+ - Alex Cabrera
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+
12
+ date: 2009-07-11 00:00:00 -07:00
13
+ default_executable:
14
+ dependencies: []
15
+
16
+ description: A great starting point for projects that makes no design assumptions.
17
+ email: alex@policus.com
18
+ executables: []
19
+
20
+ extensions: []
21
+
22
+ extra_rdoc_files:
23
+ - README.markdown
24
+ files:
25
+ - README.markdown
26
+ - Rakefile
27
+ - VERSION.yml
28
+ - graphpaper.gemspec
29
+ - lib/graphpaper.rb
30
+ - stylesheets/_graphpaper.sass
31
+ - stylesheets/graphpaper/_ie.sass
32
+ - stylesheets/graphpaper/_print.sass
33
+ - stylesheets/graphpaper/_screen.sass
34
+ - stylesheets/graphpaper/modules/_colors.sass
35
+ - stylesheets/graphpaper/modules/_grid.sass
36
+ - stylesheets/graphpaper/modules/_lists.sass
37
+ - stylesheets/graphpaper/modules/_reset.sass
38
+ - stylesheets/graphpaper/modules/_sitemap.sass
39
+ - templates/project/ie.sass
40
+ - templates/project/manifest.rb
41
+ - templates/project/partials/_base.sass
42
+ - templates/project/partials/_config.sass
43
+ - templates/project/print.sass
44
+ - templates/project/screen.sass
45
+ - templates/project/sitemap.sass
46
+ has_rdoc: false
47
+ homepage: http://github.com/alexcabrera/graphpaper
48
+ post_install_message:
49
+ rdoc_options:
50
+ - --charset=UTF-8
51
+ require_paths:
52
+ - lib
53
+ required_ruby_version: !ruby/object:Gem::Requirement
54
+ requirements:
55
+ - - ">="
56
+ - !ruby/object:Gem::Version
57
+ version: "0"
58
+ version:
59
+ required_rubygems_version: !ruby/object:Gem::Requirement
60
+ requirements:
61
+ - - ">="
62
+ - !ruby/object:Gem::Version
63
+ version: "0"
64
+ version:
65
+ requirements: []
66
+
67
+ rubyforge_project:
68
+ rubygems_version: 1.2.0
69
+ signing_key:
70
+ specification_version: 3
71
+ summary: A Sass library for use with the Compass stylesheet authoring framework.
72
+ test_files: []
73
+