spike 0.1.0
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/.document +5 -0
- data/.gitignore +21 -0
- data/.gitmodules +6 -0
- data/LICENSE +20 -0
- data/README.md +45 -0
- data/Rakefile +56 -0
- data/VERSION +1 -0
- data/bin/spike +5 -0
- data/lib/initializers/960.rb +33 -0
- data/lib/initializers/jquery.rb +1 -0
- data/lib/spike.rb +61 -0
- data/lib/template/app.css +0 -0
- data/lib/template/css/960/README.txt +52 -0
- data/lib/template/css/960/code/css/960.css +1 -0
- data/lib/template/css/960/code/css/960_24_col.css +1 -0
- data/lib/template/css/960/code/css/reset.css +1 -0
- data/lib/template/css/960/code/css/rtl_960.css +1 -0
- data/lib/template/css/960/code/css/rtl_960_24_col.css +1 -0
- data/lib/template/css/960/code/css/rtl_text.css +1 -0
- data/lib/template/css/960/code/css/text.css +1 -0
- data/lib/template/css/960/code/css/uncompressed/960.css +628 -0
- data/lib/template/css/960/code/css/uncompressed/960_24_col.css +599 -0
- data/lib/template/css/960/code/css/uncompressed/demo.css +47 -0
- data/lib/template/css/960/code/css/uncompressed/reset.css +53 -0
- data/lib/template/css/960/code/css/uncompressed/rtl_960.css +628 -0
- data/lib/template/css/960/code/css/uncompressed/rtl_960_24_col.css +599 -0
- data/lib/template/css/960/code/css/uncompressed/rtl_text.css +84 -0
- data/lib/template/css/960/code/css/uncompressed/text.css +84 -0
- data/lib/template/css/960/code/demo.html +538 -0
- data/lib/template/css/960/code/demo_24_col.html +411 -0
- data/lib/template/css/960/code/img/12_col.gif +0 -0
- data/lib/template/css/960/code/img/16_col.gif +0 -0
- data/lib/template/css/960/code/img/24_col.gif +0 -0
- data/lib/template/css/960/code/rtl_demo.html +538 -0
- data/lib/template/css/960/code/rtl_demo_24_col.html +411 -0
- data/lib/template/css/960/fireworks_extension/960.gs Grid Commands.mxp +0 -0
- data/lib/template/css/960/fireworks_extension/_source/12 columns.jsf +26 -0
- data/lib/template/css/960/fireworks_extension/_source/16 columns.jsf +26 -0
- data/lib/template/css/960/fireworks_extension/_source/24 columns.jsf +26 -0
- data/lib/template/css/960/fireworks_extension/_source/960.gs Grid Commands.mxi +22 -0
- data/lib/template/css/960/licenses/GPL_license.txt +674 -0
- data/lib/template/css/960/licenses/MIT_license.txt +20 -0
- data/lib/template/css/960/sketch_sheets/960_sketch.pdf +0 -0
- data/lib/template/css/960/templates/acorn/960_grid_12_col.acorn +0 -0
- data/lib/template/css/960/templates/acorn/960_grid_16_col.acorn +0 -0
- data/lib/template/css/960/templates/acorn/960_grid_24_col.acorn +0 -0
- data/lib/template/css/960/templates/corel_draw/960_grid_12_col.cdt +0 -0
- data/lib/template/css/960/templates/corel_draw/960_grid_16_col.cdt +0 -0
- data/lib/template/css/960/templates/corel_draw/960_grid_24_col.cdt +0 -0
- data/lib/template/css/960/templates/expression_design/960_grid_12_col.design +0 -0
- data/lib/template/css/960/templates/expression_design/960_grid_16_col.design +0 -0
- data/lib/template/css/960/templates/expression_design/960_grid_24_col.design +0 -0
- data/lib/template/css/960/templates/fireworks/960_grid_12_col.png +0 -0
- data/lib/template/css/960/templates/fireworks/960_grid_16_col.png +0 -0
- data/lib/template/css/960/templates/fireworks/960_grid_24_col.png +0 -0
- data/lib/template/css/960/templates/flash/960_grid_12_col.fla +0 -0
- data/lib/template/css/960/templates/flash/960_grid_16_col.fla +0 -0
- data/lib/template/css/960/templates/flash/960_grid_24_col.fla +0 -0
- data/lib/template/css/960/templates/gimp/960_grid_12_col.xcf +0 -0
- data/lib/template/css/960/templates/gimp/960_grid_16_col.xcf +0 -0
- data/lib/template/css/960/templates/gimp/960_grid_24_col.xcf +0 -0
- data/lib/template/css/960/templates/illustrator/960_grid_12_col.ai +372 -0
- data/lib/template/css/960/templates/illustrator/960_grid_16_col.ai +361 -0
- data/lib/template/css/960/templates/indesign/960_grid_12_col.inx +1197 -0
- data/lib/template/css/960/templates/indesign/960_grid_16_col.inx +1214 -0
- data/lib/template/css/960/templates/inkscape/960_grid_12_col.svg +217 -0
- data/lib/template/css/960/templates/inkscape/960_grid_16_col.svg +265 -0
- data/lib/template/css/960/templates/inkscape/960_grid_24_col.svg +174 -0
- data/lib/template/css/960/templates/omnigraffle/960_graffle.graffle +0 -0
- data/lib/template/css/960/templates/photoshop/960_grid_12_col.psd +0 -0
- data/lib/template/css/960/templates/photoshop/960_grid_16_col.psd +0 -0
- data/lib/template/css/960/templates/photoshop/960_grid_24_col.psd +0 -0
- data/lib/template/css/960/templates/visio/960_visio.vsd +0 -0
- data/lib/template/css/blueprint/AUTHORS.textile +42 -0
- data/lib/template/css/blueprint/CHANGELOG +159 -0
- data/lib/template/css/blueprint/LICENSE +22 -0
- data/lib/template/css/blueprint/README.textile +81 -0
- data/lib/template/css/blueprint/TUTORIAL.textile +206 -0
- data/lib/template/css/blueprint/blueprint/ie.css +35 -0
- data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/cross.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/key.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/tick.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/buttons/readme.txt +32 -0
- data/lib/template/css/blueprint/blueprint/plugins/buttons/screen.css +97 -0
- data/lib/template/css/blueprint/blueprint/plugins/fancy-type/readme.txt +14 -0
- data/lib/template/css/blueprint/blueprint/plugins/fancy-type/screen.css +71 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/doc.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/email.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/external.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/feed.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/im.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/pdf.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/visited.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/xls.png +0 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/readme.txt +18 -0
- data/lib/template/css/blueprint/blueprint/plugins/link-icons/screen.css +40 -0
- data/lib/template/css/blueprint/blueprint/plugins/rtl/readme.txt +10 -0
- data/lib/template/css/blueprint/blueprint/plugins/rtl/screen.css +110 -0
- data/lib/template/css/blueprint/blueprint/print.css +29 -0
- data/lib/template/css/blueprint/blueprint/screen.css +258 -0
- data/lib/template/css/blueprint/blueprint/src/forms.css +65 -0
- data/lib/template/css/blueprint/blueprint/src/grid.css +280 -0
- data/lib/template/css/blueprint/blueprint/src/grid.png +0 -0
- data/lib/template/css/blueprint/blueprint/src/ie.css +76 -0
- data/lib/template/css/blueprint/blueprint/src/print.css +85 -0
- data/lib/template/css/blueprint/blueprint/src/reset.css +45 -0
- data/lib/template/css/blueprint/blueprint/src/typography.css +106 -0
- data/lib/template/css/blueprint/lib/blueprint/blueprint.rb +39 -0
- data/lib/template/css/blueprint/lib/blueprint/compressor.rb +290 -0
- data/lib/template/css/blueprint/lib/blueprint/core_ext.rb +39 -0
- data/lib/template/css/blueprint/lib/blueprint/css_parser.rb +72 -0
- data/lib/template/css/blueprint/lib/blueprint/custom_layout.rb +72 -0
- data/lib/template/css/blueprint/lib/blueprint/grid.css.erb +146 -0
- data/lib/template/css/blueprint/lib/blueprint/grid_builder.rb +63 -0
- data/lib/template/css/blueprint/lib/blueprint/namespace.rb +38 -0
- data/lib/template/css/blueprint/lib/blueprint/semantic_class_names.rb +64 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/COPYRIGHT.html +93 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/JIGSAW_COPYRIGHT +64 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/README.html +83 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/XERCES_COPYING.txt +56 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/css-validator-javadoc.jar +0 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/css-validator.jar +0 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/jigsaw.jar +0 -0
- data/lib/template/css/blueprint/lib/blueprint/validate/xerces.jar +0 -0
- data/lib/template/css/blueprint/lib/blueprint/validator.rb +49 -0
- data/lib/template/css/blueprint/lib/compress.rb +167 -0
- data/lib/template/css/blueprint/lib/settings.example.yml +33 -0
- data/lib/template/css/blueprint/lib/validate.rb +15 -0
- data/lib/template/css/blueprint/templates/psd/fixed-width.psd +0 -0
- data/lib/template/css/blueprint/tests/index.html +83 -0
- data/lib/template/css/blueprint/tests/parts/elements.html +247 -0
- data/lib/template/css/blueprint/tests/parts/forms.html +191 -0
- data/lib/template/css/blueprint/tests/parts/grid.html +163 -0
- data/lib/template/css/blueprint/tests/parts/sample.html +75 -0
- data/lib/template/css/blueprint/tests/parts/test-small.jpg +0 -0
- data/lib/template/css/blueprint/tests/parts/test.jpg +0 -0
- data/lib/template/css/blueprint/tests/parts/valid.png +0 -0
- data/lib/template/index.html +16 -0
- data/spike.gemspec +190 -0
- data/test/helper.rb +10 -0
- data/test/test_spike.rb +7 -0
- metadata +227 -0
@@ -0,0 +1,39 @@
|
|
1
|
+
class String
|
2
|
+
# see if string has any content
|
3
|
+
def blank?; self.length.zero?; end
|
4
|
+
|
5
|
+
# strip space after :, remove newlines, replace multiple spaces with only one space, remove comments
|
6
|
+
def strip_space!
|
7
|
+
replace self.gsub(/:\s*/, ":").gsub(/\n/, "").gsub(/\s+/, " ").gsub(/(\/\*).*?(\*\/)/, "")
|
8
|
+
end
|
9
|
+
|
10
|
+
# remove newlines, insert space after comma, replace two spaces with one space after comma
|
11
|
+
def strip_selector_space!
|
12
|
+
replace self.gsub(/\n/, "").gsub(",", ", ").gsub(", ", ", ")
|
13
|
+
end
|
14
|
+
|
15
|
+
# remove leading whitespace, remove end whitespace
|
16
|
+
def strip_side_space!
|
17
|
+
replace self.gsub(/^\s+/, "").gsub(/\s+$/, $/)
|
18
|
+
end
|
19
|
+
end
|
20
|
+
|
21
|
+
class NilClass
|
22
|
+
def blank?
|
23
|
+
true
|
24
|
+
end
|
25
|
+
end
|
26
|
+
|
27
|
+
class File
|
28
|
+
# string output from file
|
29
|
+
def self.path_to_string(path)
|
30
|
+
File.new(path).read
|
31
|
+
end
|
32
|
+
|
33
|
+
# saves a string to a specified file path
|
34
|
+
def self.string_to_file(string, path)
|
35
|
+
directory = File.dirname(path)
|
36
|
+
FileUtils.mkdir_p directory unless File.directory?(directory)
|
37
|
+
File.open(path, "w") { |f| f << string }
|
38
|
+
end
|
39
|
+
end
|
@@ -0,0 +1,72 @@
|
|
1
|
+
module Blueprint
|
2
|
+
# Strips out most whitespace and can return a hash or string of parsed data
|
3
|
+
class CSSParser
|
4
|
+
attr_accessor :namespace
|
5
|
+
attr_reader :css_output, :raw_data
|
6
|
+
|
7
|
+
# ==== Options
|
8
|
+
# * <tt>css_string</tt> String of CSS data
|
9
|
+
# * <tt>options</tt>
|
10
|
+
# * <tt>:namespace</tt> -- Namespace to use when generating output
|
11
|
+
def initialize(css_string = "", options = {})
|
12
|
+
@raw_data = css_string
|
13
|
+
@namespace = options[:namespace] || ""
|
14
|
+
compress(@raw_data)
|
15
|
+
end
|
16
|
+
|
17
|
+
# returns string of CSS which can be saved to a file or otherwise
|
18
|
+
def to_s
|
19
|
+
@css_output
|
20
|
+
end
|
21
|
+
|
22
|
+
# returns a hash of all CSS data passed
|
23
|
+
#
|
24
|
+
# ==== Options
|
25
|
+
# * <tt>data</tt> -- CSS string; defaults to string passed into the constructor
|
26
|
+
def parse(data = nil)
|
27
|
+
data ||= @raw_data
|
28
|
+
|
29
|
+
# wrapper array holding hashes of css tags/rules
|
30
|
+
css_out = []
|
31
|
+
# clear initial spaces
|
32
|
+
data.strip_side_space!.strip_space!
|
33
|
+
|
34
|
+
# split on end of assignments
|
35
|
+
data.split('}').each_with_index do |assignments, index|
|
36
|
+
# split again to separate tags from rules
|
37
|
+
tags, styles = assignments.split('{').map{|a| a.strip_side_space!}
|
38
|
+
unless styles.blank?
|
39
|
+
# clean up tags and apply namespaces as needed
|
40
|
+
tags.strip_selector_space!
|
41
|
+
tags.gsub!(/\./, ".#{namespace}") unless namespace.blank?
|
42
|
+
|
43
|
+
# split on semicolon to iterate through each rule
|
44
|
+
rules = []
|
45
|
+
styles.split(";").each do |key_val_pair|
|
46
|
+
unless key_val_pair.nil?
|
47
|
+
# split by property/val and append to rules array with correct declaration
|
48
|
+
property, value = key_val_pair.split(":", 2).map {|kv| kv.strip_side_space! }
|
49
|
+
break unless property && value
|
50
|
+
rules << "#{property}:#{value};"
|
51
|
+
end
|
52
|
+
end
|
53
|
+
# now keeps track of index as hashes don't keep track of position
|
54
|
+
# (which will be fixed in Ruby 1.9)
|
55
|
+
unless tags.blank? || rules.to_s.blank?
|
56
|
+
css_out << {:tags => tags, :rules => rules.join, :idx => index}
|
57
|
+
end
|
58
|
+
end
|
59
|
+
end
|
60
|
+
css_out
|
61
|
+
end
|
62
|
+
|
63
|
+
private
|
64
|
+
|
65
|
+
def compress(data)
|
66
|
+
@css_output = ""
|
67
|
+
parse(data).flatten.sort_by {|i| i[:idx]}.each do |line|
|
68
|
+
@css_output += "#{line[:tags]} {#{line[:rules]}}\n"
|
69
|
+
end
|
70
|
+
end
|
71
|
+
end
|
72
|
+
end
|
@@ -0,0 +1,72 @@
|
|
1
|
+
require 'erb'
|
2
|
+
module Blueprint
|
3
|
+
# Generates a custom grid file, using ERB to evaluate custom settings
|
4
|
+
class CustomLayout
|
5
|
+
# path to ERB file used for CSS template
|
6
|
+
CSS_ERB_FILE = File.join(Blueprint::LIB_PATH, 'grid.css.erb')
|
7
|
+
|
8
|
+
attr_writer :column_count, :column_width, :gutter_width, :input_padding,
|
9
|
+
:input_border
|
10
|
+
|
11
|
+
# Column count of generated CSS. Returns itself or Blueprint's default
|
12
|
+
def column_count
|
13
|
+
(@column_count || Blueprint::COLUMN_COUNT).to_i
|
14
|
+
end
|
15
|
+
|
16
|
+
# Column width (in pixels) of generated CSS. Returns itself or Blueprint's default
|
17
|
+
def column_width
|
18
|
+
(@column_width || Blueprint::COLUMN_WIDTH).to_i
|
19
|
+
end
|
20
|
+
|
21
|
+
# Gutter width (in pixels) of generated CSS. Returns itself or Blueprint's default
|
22
|
+
def gutter_width
|
23
|
+
(@gutter_width || Blueprint::GUTTER_WIDTH).to_i
|
24
|
+
end
|
25
|
+
|
26
|
+
def input_padding
|
27
|
+
(@input_padding || Blueprint::INPUT_PADDING).to_i
|
28
|
+
end
|
29
|
+
|
30
|
+
def input_border
|
31
|
+
(@input_border || Blueprint::INPUT_BORDER).to_i
|
32
|
+
end
|
33
|
+
|
34
|
+
# Returns page width (in pixels)
|
35
|
+
def page_width
|
36
|
+
column_count * (column_width + gutter_width) - gutter_width
|
37
|
+
end
|
38
|
+
|
39
|
+
# ==== Options
|
40
|
+
# * <tt>options</tt>
|
41
|
+
# * <tt>:column_count</tt> -- Sets the column count of generated CSS
|
42
|
+
# * <tt>:column_width</tt> -- Sets the column width (in pixels) of generated CSS
|
43
|
+
# * <tt>:gutter_width</tt> -- Sets the gutter width (in pixels) of generated CSS
|
44
|
+
# * <tt>:input_padding</tt> -- Sets the input padding width (in pixels) of generated CSS
|
45
|
+
# * <tt>:input_border</tt> -- Sets the border width (in pixels) of generated CSS
|
46
|
+
def initialize(options = {})
|
47
|
+
@column_count = options[:column_count]
|
48
|
+
@column_width = options[:column_width]
|
49
|
+
@gutter_width = options[:gutter_width]
|
50
|
+
@input_padding = options[:input_padding]
|
51
|
+
@input_border = options[:input_border]
|
52
|
+
end
|
53
|
+
|
54
|
+
# Boolean value if current settings are Blueprint's defaults
|
55
|
+
def default?
|
56
|
+
self.column_width == Blueprint::COLUMN_WIDTH &&
|
57
|
+
self.column_count == Blueprint::COLUMN_COUNT &&
|
58
|
+
self.gutter_width == Blueprint::GUTTER_WIDTH &&
|
59
|
+
self.input_padding == Blueprint::INPUT_PADDING &&
|
60
|
+
self.input_border == Blueprint::INPUT_BORDER
|
61
|
+
end
|
62
|
+
|
63
|
+
# Loads grid.css.erb file, binds it to current instance, and returns output
|
64
|
+
def generate_grid_css
|
65
|
+
# loads up erb template to evaluate custom widths
|
66
|
+
css = ERB::new(File.path_to_string(CustomLayout::CSS_ERB_FILE))
|
67
|
+
|
68
|
+
# bind it to this instance
|
69
|
+
css.result(binding)
|
70
|
+
end
|
71
|
+
end
|
72
|
+
end
|
@@ -0,0 +1,146 @@
|
|
1
|
+
/* --------------------------------------------------------------
|
2
|
+
|
3
|
+
grid.css
|
4
|
+
* Sets up an easy-to-use grid of 24 columns.
|
5
|
+
|
6
|
+
By default, the grid is 950px wide, with 24 columns
|
7
|
+
spanning 30px, and a 10px margin between columns.
|
8
|
+
|
9
|
+
If you need fewer or more columns, namespaces or semantic
|
10
|
+
element names, use the compressor script (lib/compress.rb)
|
11
|
+
|
12
|
+
-------------------------------------------------------------- */
|
13
|
+
|
14
|
+
/* A container should group all your columns. */
|
15
|
+
.container {
|
16
|
+
width: <%= page_width %>px;
|
17
|
+
margin: 0 auto;
|
18
|
+
}
|
19
|
+
|
20
|
+
/* Use this class on any .span-# / .container to see the grid. */
|
21
|
+
.showgrid {
|
22
|
+
background: url(src/grid.png);
|
23
|
+
}
|
24
|
+
|
25
|
+
|
26
|
+
/* Columns
|
27
|
+
-------------------------------------------------------------- */
|
28
|
+
|
29
|
+
/* Sets up basic grid floating and margin. */
|
30
|
+
.column, <%= (1..column_count).map {|c| ".span-#{c}" }.join(", ") %> {
|
31
|
+
float: left;
|
32
|
+
margin-right: <%= gutter_width %>px;
|
33
|
+
}
|
34
|
+
|
35
|
+
/* The last column in a row needs this class. */
|
36
|
+
.last { margin-right: 0; }
|
37
|
+
|
38
|
+
/* Use these classes to set the width of a column. */
|
39
|
+
.span-1 {width: <%= column_width %>px;}
|
40
|
+
<% (2..column_count-1).each do |column| %>
|
41
|
+
.span-<%= column %> {width: <%= (column_width + ((column - 1) * (column_width + gutter_width))).to_i %>px;<%= "margin-right: 0;" if column == column_count %>}<% end %>
|
42
|
+
.span-<%= column_count %> {width:<%= page_width %>px; margin-right:0;}
|
43
|
+
|
44
|
+
/* Use these classes to set the width of an input. */
|
45
|
+
<%= (1..column_count).map {|column| "input.span-#{column}, textarea.span-#{column}"}.join(", ") %> {
|
46
|
+
border-left-width: <%= input_border %>px;
|
47
|
+
border-right-width: <%= input_border %>px;
|
48
|
+
padding-left: <%= input_padding %>px;
|
49
|
+
padding-right: <%= input_padding %>px;
|
50
|
+
}
|
51
|
+
<% (1..column_count).each do |column| %>
|
52
|
+
input.span-<%= column %>, textarea.span-<%= column %> { width: <%= ((column_width + gutter_width) * (column - 1) + column_width - 2*(input_padding + input_border))%>px; }<% end %>
|
53
|
+
|
54
|
+
/* Add these to a column to append empty cols. */
|
55
|
+
<% (1..(column_count-1)).each do |column| %>
|
56
|
+
.append-<%= column %> { padding-right: <%= (column * (column_width + gutter_width)).to_i %>px;}<% end %>
|
57
|
+
|
58
|
+
/* Add these to a column to prepend empty cols. */
|
59
|
+
<% (1..(column_count-1)).each do |column| %>
|
60
|
+
.prepend-<%= column %> { padding-left: <%= (column * (column_width + gutter_width)).to_i %>px;}<% end %>
|
61
|
+
|
62
|
+
|
63
|
+
/* Border on right hand side of a column. */
|
64
|
+
.border {
|
65
|
+
padding-right: <%= (gutter_width * 0.5 - 1).to_i %>px;
|
66
|
+
margin-right: <%= (gutter_width * 0.5).to_i %>px;
|
67
|
+
border-right: 1px solid #eee;
|
68
|
+
}
|
69
|
+
|
70
|
+
/* Border with more whitespace, spans one column. */
|
71
|
+
.colborder {
|
72
|
+
padding-right: <%= (column_width + 2*gutter_width - 1)/2.to_i %>px;
|
73
|
+
margin-right: <%= (column_width + 2 * gutter_width)/2.to_i %>px;
|
74
|
+
border-right: 1px solid #eee;
|
75
|
+
}
|
76
|
+
|
77
|
+
|
78
|
+
/* Use these classes on an element to push it into the
|
79
|
+
next column, or to pull it into the previous column. */
|
80
|
+
|
81
|
+
<% (1..column_count).each do |column| %>
|
82
|
+
.pull-<%= column %> { margin-left: -<%= (column * (column_width + gutter_width)).to_i %>px; }<% end %>
|
83
|
+
|
84
|
+
<%= (1..column_count).map {|c| ".pull-#{c}" }.join(", ") %> {float: left; position:relative;}
|
85
|
+
|
86
|
+
<% (1..(column_count)).each do |column| %>
|
87
|
+
.push-<%= column %> { margin: 0 -<%= (column * (column_width + gutter_width)).to_i %>px 1.5em <%= (column * (column_width + gutter_width)).to_i %>px; }<% end %>
|
88
|
+
|
89
|
+
<%= (1..column_count).map {|c| ".push-#{c}" }.join(", ") %> {float: right; position:relative;}
|
90
|
+
|
91
|
+
|
92
|
+
/* Misc classes and elements
|
93
|
+
-------------------------------------------------------------- */
|
94
|
+
|
95
|
+
/* In case you need to add a gutter above/below an element */
|
96
|
+
.prepend-top {
|
97
|
+
margin-top:1.5em;
|
98
|
+
}
|
99
|
+
.append-bottom {
|
100
|
+
margin-bottom:1.5em;
|
101
|
+
}
|
102
|
+
|
103
|
+
/* Use a .box to create a padded box inside a column. */
|
104
|
+
.box {
|
105
|
+
padding: 1.5em;
|
106
|
+
margin-bottom: 1.5em;
|
107
|
+
background: #E5ECF9;
|
108
|
+
}
|
109
|
+
|
110
|
+
/* Use this to create a horizontal ruler across a column. */
|
111
|
+
hr {
|
112
|
+
background: #ddd;
|
113
|
+
color: #ddd;
|
114
|
+
clear: both;
|
115
|
+
float: none;
|
116
|
+
width: 100%;
|
117
|
+
height: .1em;
|
118
|
+
margin: 0 0 1.45em;
|
119
|
+
border: none;
|
120
|
+
}
|
121
|
+
|
122
|
+
hr.space {
|
123
|
+
background: #fff;
|
124
|
+
color: #fff;
|
125
|
+
visibility: hidden;
|
126
|
+
}
|
127
|
+
|
128
|
+
|
129
|
+
/* Clearing floats without extra markup
|
130
|
+
Based on How To Clear Floats Without Structural Markup by PiE
|
131
|
+
[http://www.positioniseverything.net/easyclearing.html] */
|
132
|
+
|
133
|
+
.clearfix:after, .container:after {
|
134
|
+
content: "\0020";
|
135
|
+
display: block;
|
136
|
+
height: 0;
|
137
|
+
clear: both;
|
138
|
+
visibility: hidden;
|
139
|
+
overflow:hidden;
|
140
|
+
}
|
141
|
+
.clearfix, .container {display: block;}
|
142
|
+
|
143
|
+
/* Regular clearing
|
144
|
+
apply to column that should drop below previous ones. */
|
145
|
+
|
146
|
+
.clear { clear:both; }
|
@@ -0,0 +1,63 @@
|
|
1
|
+
begin
|
2
|
+
require "rubygems"
|
3
|
+
gem "rmagick"
|
4
|
+
require "rvg/rvg"
|
5
|
+
rescue Exception => e
|
6
|
+
puts " #{"*" * 100}"
|
7
|
+
puts " **"
|
8
|
+
puts " ** Warning:"
|
9
|
+
puts " ** Could not load the Rmagick gem. Please check your installation."
|
10
|
+
puts " ** grid.png will not be generated."
|
11
|
+
puts " **"
|
12
|
+
puts " #{"*" * 100}\n"
|
13
|
+
end
|
14
|
+
|
15
|
+
module Blueprint
|
16
|
+
# Uses ImageMagick and RMagick to generate grid.png file
|
17
|
+
class GridBuilder
|
18
|
+
begin
|
19
|
+
include Magick
|
20
|
+
rescue Exception => e
|
21
|
+
end
|
22
|
+
|
23
|
+
attr_reader :column_width, :gutter_width, :output_path, :able_to_generate
|
24
|
+
|
25
|
+
# ==== Options
|
26
|
+
# * <tt>options</tt>
|
27
|
+
# * <tt>:column_width</tt> -- Width (in pixels) of current grid column
|
28
|
+
# * <tt>:gutter_width</tt> -- Width (in pixels) of current grid gutter
|
29
|
+
# * <tt>:output_path</tt> -- Output path of grid.png file
|
30
|
+
def initialize(options={})
|
31
|
+
@able_to_generate = Magick::Long_version rescue false
|
32
|
+
return unless @able_to_generate
|
33
|
+
@column_width = options[:column_width] || Blueprint::COLUMN_WIDTH
|
34
|
+
@gutter_width = options[:gutter_width] || Blueprint::GUTTER_WIDTH
|
35
|
+
@output_path = options[:output_path] || Blueprint::SOURCE_PATH
|
36
|
+
end
|
37
|
+
|
38
|
+
# generates (overwriting if necessary) grid.png image to be tiled in background
|
39
|
+
def generate!
|
40
|
+
return false unless self.able_to_generate
|
41
|
+
total_width = self.column_width + self.gutter_width
|
42
|
+
height = 18
|
43
|
+
RVG::dpi = 100
|
44
|
+
|
45
|
+
width_in_inches = (total_width.to_f/RVG::dpi).in
|
46
|
+
height_in_inches = (height.to_f/RVG::dpi).in
|
47
|
+
rvg = RVG.new(width_in_inches, height_in_inches).viewbox(0, 0, total_width, height) do |canvas|
|
48
|
+
canvas.background_fill = "white"
|
49
|
+
|
50
|
+
canvas.g do |column|
|
51
|
+
column.rect(self.column_width - 1, height).styles(:fill => "#e8effb")
|
52
|
+
end
|
53
|
+
|
54
|
+
canvas.g do |baseline|
|
55
|
+
baseline.line(0, (height - 1), total_width, (height - 1)).styles(:fill => "#e9e9e9")
|
56
|
+
end
|
57
|
+
end
|
58
|
+
|
59
|
+
FileUtils.mkdir self.output_path unless File.exists? self.output_path
|
60
|
+
rvg.draw.write(File.join(self.output_path, "grid.png"))
|
61
|
+
end
|
62
|
+
end
|
63
|
+
end
|
@@ -0,0 +1,38 @@
|
|
1
|
+
module Blueprint
|
2
|
+
class Namespace
|
3
|
+
|
4
|
+
# Read html to string, remove namespace if any,
|
5
|
+
# set the new namespace, and update the test file.
|
6
|
+
def initialize(path, namespace)
|
7
|
+
html = File.path_to_string(path)
|
8
|
+
remove_current_namespace(html)
|
9
|
+
add_namespace(html, namespace)
|
10
|
+
File.string_to_file(html, path)
|
11
|
+
end
|
12
|
+
|
13
|
+
# adds namespace to BP classes in a html file
|
14
|
+
def add_namespace(html, namespace)
|
15
|
+
html.gsub!(/(class=")([a-zA-Z0-9\-_ ]*)(")/) do |m|
|
16
|
+
classes = m.to_s.split('"')[1].split(" ")
|
17
|
+
classes.map! { |c| c = namespace + c }
|
18
|
+
'class="' + classes.join(' ') + '"'
|
19
|
+
end
|
20
|
+
html
|
21
|
+
end
|
22
|
+
|
23
|
+
# removes a namespace from a string of html
|
24
|
+
def remove_current_namespace(html)
|
25
|
+
current = current_namespace(html)
|
26
|
+
html.gsub!(current, "")
|
27
|
+
html
|
28
|
+
end
|
29
|
+
|
30
|
+
# returns current namespace in test files
|
31
|
+
# based on container class
|
32
|
+
def current_namespace(html)
|
33
|
+
html =~ /class="([\S]+)container/
|
34
|
+
current_namespace = $1 if $1
|
35
|
+
current_namespace || ""
|
36
|
+
end
|
37
|
+
end
|
38
|
+
end
|
@@ -0,0 +1,64 @@
|
|
1
|
+
module Blueprint
|
2
|
+
# parses a hash of key/value pairs, key being output CSS selectors, value
|
3
|
+
# being a list of CSS selectors to draw from
|
4
|
+
class SemanticClassNames
|
5
|
+
attr_accessor :class_assignments
|
6
|
+
attr_reader :namespace, :source_file
|
7
|
+
|
8
|
+
# ==== Options
|
9
|
+
# * <tt>options</tt>
|
10
|
+
# * <tt>:namespace</tt> -- Namespace to be used when matching CSS selectors to draw from
|
11
|
+
# * <tt>:source_file</tt> -- Source file to use as reference of CSS selectors. Defaults to Blueprint's generated screen.css
|
12
|
+
# * <tt>:class_assignments</tt> -- Hash of key/value pairs, key being output CSS selectors, value being a list of CSS selectors to draw from
|
13
|
+
def initialize(options = {})
|
14
|
+
@namespace = options[:namespace] || ""
|
15
|
+
@source_file = options[:source_file] || File.join(Blueprint::BLUEPRINT_ROOT_PATH, "screen.css")
|
16
|
+
self.class_assignments = options[:class_assignments] || {}
|
17
|
+
end
|
18
|
+
|
19
|
+
# Returns a CSS string of semantic selectors and associated styles
|
20
|
+
# ==== Options
|
21
|
+
# * <tt>assignments</tt> -- Hash of key/value pairs, key being output CSS selectors, value being a list of CSS selectors to draw from; defaults to what was passed in constructor or empty hash
|
22
|
+
def css_from_assignments(assignments = {})
|
23
|
+
assignments ||= self.class_assignments
|
24
|
+
|
25
|
+
# define a wrapper hash to hold all the new CSS assignments
|
26
|
+
output_css = {}
|
27
|
+
|
28
|
+
#loads full stylesheet into an array of hashes
|
29
|
+
blueprint_assignments = CSSParser.new(File.path_to_string(self.source_file)).parse
|
30
|
+
|
31
|
+
# iterates through each class assignment ('#footer' => '.span-24', '#header' => '.span-24')
|
32
|
+
assignments.each do |semantic_class, blueprint_classes|
|
33
|
+
# gathers all BP classes we're going to be mimicing
|
34
|
+
blueprint_classes = blueprint_classes.split(/,|\s/).select {|c| !c.blank? }.flatten.map {|c| c.strip }
|
35
|
+
classes = []
|
36
|
+
# loop through each BP class, grabbing the full hash (containing tags, index, and CSS rules)
|
37
|
+
blueprint_classes.each do |bp_class|
|
38
|
+
match = if bp_class.include?(".")
|
39
|
+
bp_class.gsub(".", ".#{self.namespace}")
|
40
|
+
else
|
41
|
+
".#{self.namespace}#{bp_class}"
|
42
|
+
end
|
43
|
+
classes << blueprint_assignments.select do |line|
|
44
|
+
line[:tags] =~ Regexp.new(/^([\w\.\-\:]+, ?)*#{match}(, ?[\w\.\-\:]+)*$/)
|
45
|
+
end.uniq
|
46
|
+
end
|
47
|
+
|
48
|
+
# clean up the array
|
49
|
+
classes = classes.flatten.uniq
|
50
|
+
|
51
|
+
# set the semantic class to the rules gathered in classes, sorted by index
|
52
|
+
# this way, the styles will be applied in the correct order from top of file to bottom
|
53
|
+
output_css[semantic_class] = "#{classes.sort_by {|i| i[:idx] }.map {|i| i[:rules] }}"
|
54
|
+
end
|
55
|
+
|
56
|
+
# return the css in proper format
|
57
|
+
css = ""
|
58
|
+
output_css.each do |tags, rules|
|
59
|
+
css += "#{tags} {#{rules}}\n"
|
60
|
+
end
|
61
|
+
css
|
62
|
+
end
|
63
|
+
end
|
64
|
+
end
|