spike 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- 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
|