css_shapes 0.8.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.
@@ -0,0 +1,52 @@
1
+ square:
2
+ - ['red']
3
+ - ['rgba(120, 120, 120, 0.8)', '120px']
4
+ - ['#fab444', '80px']
5
+ rectangle:
6
+ - ['red']
7
+ - ['red', '120px', '10px']
8
+ circle:
9
+ - ['red']
10
+ - ['#ff0', '2em']
11
+ oval:
12
+ - ['red']
13
+ - ['#000', '60px', '10px']
14
+ triangle-up:
15
+ - ['red']
16
+ triangle-down:
17
+ - ['red']
18
+ triangle-left:
19
+ - ['red']
20
+ triangle-right:
21
+ - ['red']
22
+ - ['#5F0', '180px', '30px']
23
+ triangle-topleft:
24
+ - ['red']
25
+ triangle-topright:
26
+ - ['red']
27
+ triangle-bottomleft:
28
+ - ['red']
29
+ triangle-bottomright:
30
+ - ['red']
31
+ parallelogram:
32
+ - ['red']
33
+ - ['#fab444', '40px', '120px', '40deg']
34
+ trapezoid:
35
+ - ['red']
36
+ star-six:
37
+ - ['red']
38
+ star-five:
39
+ - ['red']
40
+ - ['#000', '40px']
41
+ pentagon:
42
+ - ['red']
43
+ - ['#0f0', '88px']
44
+ - ['#00f', '128px']
45
+ hexagon:
46
+ - ['red']
47
+ octagon:
48
+ - ['red', '#fff']
49
+ heart:
50
+ - ['red']
51
+ infinity:
52
+ - ['red']
@@ -0,0 +1,73 @@
1
+ <!doctype html>
2
+ <html>
3
+ <head>
4
+ <style>
5
+ body { font-family: 'Helvetica', 'Verdana', sans-serif; }
6
+ .container { width: 960px; margin: 0 auto; }
7
+ h1 {
8
+ font-family: 'Arial Rounded MT Bold', 'Verdana', 'Helvetica', sans-serif;
9
+ padding: 10px;
10
+ background: #ddd;
11
+ border-bottom: #ccc 1px solid;
12
+ }
13
+ style[contenteditable] {
14
+ display: block;
15
+ white-space: pre;
16
+ background: #333;
17
+ color: white;
18
+ font: 12px Monaco;
19
+ padding: 10px;
20
+ height: 50px;
21
+ overflow: hidden;
22
+ margin-bottom: 20px;
23
+ }
24
+ .star-five style[contenteditable],
25
+ .pentagon style[contenteditable],
26
+ .hexagon style[contenteditable] {
27
+ margin-bottom: 40px;
28
+ }
29
+ .samples {
30
+ list-style: none;
31
+ margin: 0;
32
+ padding: 0;
33
+ }
34
+ .samples li {
35
+ width: 300px;
36
+ padding: 10px;
37
+ display: inline-block;
38
+ vertical-align: top;
39
+ border-right: 1px #bbb dashed;
40
+ }
41
+ .samples li:last-child {
42
+ border: 0;
43
+ }
44
+ .shape {
45
+ margin: 0 auto 40px;
46
+ }
47
+ </style>
48
+ </head>
49
+ <body>
50
+ <div id='container'>
51
+ <% @shapes.each do |shape| %>
52
+ <section class='<%= shape.name %>'>
53
+ <header><h1><%= shape.name %></h1></header>
54
+ <dl>
55
+ <% shape.params.each do |param| %>
56
+ <dt><%= param.name %></dt>
57
+ <dd><%= param.default? ? 'Optional' : 'Required' %></dd>
58
+ <% end %>
59
+ </dl>
60
+ <ul class='samples'>
61
+ <% shape_samples(shape).each do |sample| %>
62
+ <li>
63
+ <style><%= sample.css %></style>
64
+ <style contenteditable><%= sample.scss %></style>
65
+ <div id='<%= sample.dom_id %>' class='shape <%= shape.name %>'></div>
66
+ </li>
67
+ <% end %>
68
+ </ul>
69
+ </section>
70
+ <% end %>
71
+ </div>
72
+ </body>
73
+ </html>
data/lib/css_shapes.rb ADDED
@@ -0,0 +1,13 @@
1
+ module CSSShapes
2
+
3
+ def self.root
4
+ @root ||= File.expand_path('..', __FILE__)
5
+ end
6
+
7
+ autoload :Example, root + '/css_shapes/example'
8
+ autoload :Source, root + '/css_shapes/source'
9
+ autoload :VERSION, root + '/css_shapes/version'
10
+
11
+ require(root + '/css_shapes/railtie') if defined?(Rails)
12
+
13
+ end
@@ -0,0 +1,88 @@
1
+ require 'erb'
2
+
3
+ module CSSShapes
4
+ class Example
5
+
6
+ def self.write(filename)
7
+ new.write(filename)
8
+ end
9
+
10
+ def initialize
11
+ @shapes = Source.shapes
12
+ end
13
+
14
+ def write(filename)
15
+ File.open(filename, 'w') do |f|
16
+ f.write document
17
+ end
18
+ end
19
+
20
+ def shape_samples(shape)
21
+ (samples[shape.name] || []).map.with_index do |args, idx|
22
+ ShapeSample.new(idx + 1, shape, args)
23
+ end
24
+ end
25
+
26
+ private
27
+
28
+ def default_arg_string(shape)
29
+ parts = []
30
+ shape.params.each do |param|
31
+ unless param.default?
32
+ case param.name
33
+ when 'color'
34
+ parts << '#f00'
35
+ else
36
+ raise ArgumentError, "Don't know how to fill #{param.name}"
37
+ end
38
+ end
39
+ end
40
+ parts.join(', ')
41
+ end
42
+
43
+ def document
44
+ @document ||= template.result(binding)
45
+ end
46
+
47
+ def samples
48
+ @samples ||= YAML.load(File.read(samples_filename))
49
+ end
50
+
51
+ def samples_filename
52
+ File.expand_path('../example/src/samples.yml', CSSShapes.root)
53
+ end
54
+
55
+ def template
56
+ ERB.new(File.read(template_filename))
57
+ end
58
+
59
+ def template_filename
60
+ File.expand_path('../example/src/template.erb', CSSShapes.root)
61
+ end
62
+
63
+ class ShapeSample
64
+
65
+ def initialize(count, shape, args)
66
+ @count = count
67
+ @shape = shape
68
+ @args = args
69
+ end
70
+
71
+ def css
72
+ Sass.compile(Source.contents + "\n" + scss(dom_id), :syntax => :scss)
73
+ end
74
+
75
+ def scss(on_dom_id = 'shape')
76
+ ["##{on_dom_id} {",
77
+ " @include #{@shape.name}(#{@args.join(', ')});",
78
+ "}"].join("\n")
79
+ end
80
+
81
+ def dom_id
82
+ "shape_sample_#{@shape.name}_#{@count}"
83
+ end
84
+
85
+ end
86
+
87
+ end
88
+ end
@@ -0,0 +1,12 @@
1
+ module CSSShapes
2
+ class Railtie < Rails::Railtie
3
+ railtie_name :css_shapes
4
+ config.before_configuration do
5
+ Rails.configuration.assets.paths += Dir[File.expand_path('../assets',
6
+ CSSShapes.root)]
7
+ end
8
+ rake_tasks do
9
+ load "css_shapes/tasks/css_shapes.rake"
10
+ end
11
+ end
12
+ end
@@ -0,0 +1,59 @@
1
+ require 'sass'
2
+
3
+ module CSSShapes
4
+
5
+ module Source
6
+
7
+ def self.contents
8
+ @data ||= File.read(File.expand_path('../assets/_shapes.scss',
9
+ CSSShapes.root))
10
+ end
11
+
12
+ def self.shapes
13
+ return @shapes if @shapes
14
+ sass = Sass::Engine.new(contents, :syntax => :scss)
15
+ tree = sass.to_tree
16
+ @shapes = []
17
+ tree.children.each do |mixin_node|
18
+ Shape.new(mixin_node.name).tap do |shape|
19
+ mixin_node.args.each do |var, default|
20
+ shape.add_param(var.name, default)
21
+ end
22
+ @shapes << shape
23
+ end
24
+ end
25
+ @shapes
26
+ end
27
+
28
+ class Shape
29
+
30
+ attr_reader :name
31
+ def initialize(name)
32
+ @name = name
33
+ end
34
+
35
+ def params
36
+ @params ||= []
37
+ end
38
+
39
+ def add_param(name, default)
40
+ Param.new(name, default).tap do |param|
41
+ params << param
42
+ end
43
+ end
44
+
45
+ class Param
46
+ attr_reader :name, :default
47
+ def initialize(name, default)
48
+ @name = name
49
+ @default = default
50
+ end
51
+ def default?
52
+ @default
53
+ end
54
+ end
55
+
56
+ end
57
+
58
+ end
59
+ end
@@ -0,0 +1,14 @@
1
+ namespace :css_shapes do
2
+
3
+ desc "List available shapes and parameters"
4
+ task :list do
5
+ CSSShapes::Source.shapes.each do |shape|
6
+ puts shape.name
7
+ shape.params.each do |param|
8
+ puts "* #{param.name} (#{param.default? ? 'Optional' : 'Required'})"
9
+ end
10
+ end
11
+ end
12
+
13
+ end
14
+
@@ -0,0 +1,3 @@
1
+ module CSSShapes
2
+ VERSION = "0.8.0"
3
+ end
metadata ADDED
@@ -0,0 +1,79 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: css_shapes
3
+ version: !ruby/object:Gem::Version
4
+ prerelease: false
5
+ segments:
6
+ - 0
7
+ - 8
8
+ - 0
9
+ version: 0.8.0
10
+ platform: ruby
11
+ authors:
12
+ - Bruce Williams
13
+ autorequire:
14
+ bindir: bin
15
+ cert_chain: []
16
+
17
+ date: 2011-08-13 00:00:00 -04:00
18
+ default_executable:
19
+ dependencies: []
20
+
21
+ description: "SCSS library for shapes. Sources: http://css-tricks.com/examples/ShapesOfCSS/, ..."
22
+ email:
23
+ - bruce@codefluency.com
24
+ executables: []
25
+
26
+ extensions: []
27
+
28
+ extra_rdoc_files: []
29
+
30
+ files:
31
+ - .gitignore
32
+ - Gemfile
33
+ - README.md
34
+ - Rakefile
35
+ - assets/_shapes.scss
36
+ - css_shapes.gemspec
37
+ - example/example.html
38
+ - example/src/samples.yml
39
+ - example/src/template.erb
40
+ - lib/css_shapes.rb
41
+ - lib/css_shapes/example.rb
42
+ - lib/css_shapes/railtie.rb
43
+ - lib/css_shapes/source.rb
44
+ - lib/css_shapes/tasks/css_shapes.rake
45
+ - lib/css_shapes/version.rb
46
+ has_rdoc: true
47
+ homepage: http://github.com/bruce/css_shapes
48
+ licenses: []
49
+
50
+ post_install_message:
51
+ rdoc_options: []
52
+
53
+ require_paths:
54
+ - lib
55
+ required_ruby_version: !ruby/object:Gem::Requirement
56
+ none: false
57
+ requirements:
58
+ - - ">="
59
+ - !ruby/object:Gem::Version
60
+ segments:
61
+ - 0
62
+ version: "0"
63
+ required_rubygems_version: !ruby/object:Gem::Requirement
64
+ none: false
65
+ requirements:
66
+ - - ">="
67
+ - !ruby/object:Gem::Version
68
+ segments:
69
+ - 0
70
+ version: "0"
71
+ requirements: []
72
+
73
+ rubyforge_project:
74
+ rubygems_version: 1.3.7
75
+ signing_key:
76
+ specification_version: 3
77
+ summary: Provides SCSS for various CSS shapes
78
+ test_files: []
79
+