alexcabrera-graphpaper 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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
+