atomic_sass 0.1.0 → 0.2.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +32 -7
- data/lib/atomic_sass.rb +50 -32
- data/lib/atomic_sass/settings.rb +26 -0
- data/lib/atomic_sass/templates/settings.tt +3 -0
- data/lib/atomic_sass/version.rb +1 -1
- metadata +4 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 359cd22f219b0555718424532f55ffd2a14cb5a7
|
4
|
+
data.tar.gz: b74f06af7c898384b90c901fc5a67dc405a68418
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 98089e94bf3543085a74e0504a580bdfc4b140c78a7a48b88f4b2deacd1d266a7a96476c3ae8685279deb67579eac1e01496499cdbe95a36ba1db788e91f552f
|
7
|
+
data.tar.gz: 6b5bf3361b8cacf945c596fa2c8655c995d109dbfdbc7eb9b395a48b009b8333c6f7465990558f81cdb315bb2750e530d8d4b12e5badfc9bb40d4538725e2b75
|
data/README.md
CHANGED
@@ -2,6 +2,7 @@
|
|
2
2
|
|
3
3
|
Generators that make [atomic design](http://coding.smashingmagazine.com/2013/08/02/other-interface-atomic-design-sass/) with SASS easy.
|
4
4
|
|
5
|
+
![](http://f.cl.ly/items/0T1v2y3z330O2i2L2M0v/out_gif.gif)
|
5
6
|
|
6
7
|
## Installation
|
7
8
|
|
@@ -17,11 +18,24 @@ Initialize your project
|
|
17
18
|
atom init
|
18
19
|
```
|
19
20
|
|
20
|
-
|
21
|
+
This creates a yaml file where you can specify:
|
22
|
+
- the source directory
|
23
|
+
- the destination directory
|
24
|
+
- your preferred sass syntax (scss or sass)
|
21
25
|
|
22
|
-
|
23
|
-
|
24
|
-
|
26
|
+
After the settings are set the way you like you can build the initial file structure with
|
27
|
+
|
28
|
+
```bash
|
29
|
+
atom build
|
30
|
+
```
|
31
|
+
|
32
|
+
Now you are ready to start styling.
|
33
|
+
|
34
|
+
Generate your documents by passing the appropriate flag then an array of new document names
|
35
|
+
|
36
|
+
- quark `atom generate --quark header nav footer aside`
|
37
|
+
- utility `atom generate -u clearfix`
|
38
|
+
- atom `atom g --atom input button`
|
25
39
|
- molecules `atom g -m seachbar top_nav`
|
26
40
|
|
27
41
|
or a few at once
|
@@ -29,20 +43,31 @@ or a few at once
|
|
29
43
|
atom g -a input button -q header nav footer -m seachbar top_nav
|
30
44
|
```
|
31
45
|
|
32
|
-
|
46
|
+
specify which molecules will use your atom at generation
|
33
47
|
( -i is short for --include )
|
34
48
|
```bash
|
35
49
|
atom g -a input button -i seachbar
|
36
50
|
```
|
37
51
|
|
38
|
-
|
52
|
+
or include some atoms in a quark (or quarks)
|
39
53
|
```bash
|
40
54
|
atom g -q header
|
41
55
|
atom g -a text_shadow --include-quark header
|
42
56
|
```
|
43
57
|
|
44
|
-
|
58
|
+
nested routes are automatically resolved too, so nest all you like
|
45
59
|
```bash
|
46
60
|
atom g -m header/searchbar
|
47
61
|
atom g -a typography/textfields/input -i header/searchbar
|
48
62
|
```
|
63
|
+
|
64
|
+
|
65
|
+
Compile to css with
|
66
|
+
```bash
|
67
|
+
atom compile
|
68
|
+
```
|
69
|
+
|
70
|
+
or compile and watch for changes with
|
71
|
+
```bash
|
72
|
+
atom compile --watch
|
73
|
+
```
|
data/lib/atomic_sass.rb
CHANGED
@@ -1,16 +1,23 @@
|
|
1
1
|
require "atomic_sass/version"
|
2
|
+
require "atomic_sass/settings"
|
2
3
|
require 'active_support/core_ext/string/inflections'
|
3
4
|
require 'sass'
|
4
5
|
require 'sass/exec'
|
5
6
|
require 'thor'
|
7
|
+
require 'yaml'
|
6
8
|
|
7
9
|
module AtomicSass
|
8
10
|
class SassGenerator < Thor
|
9
11
|
map 'g' => :generate
|
10
12
|
include Thor::Actions
|
11
13
|
|
12
|
-
desc 'init', '
|
14
|
+
desc 'init', 'Render settings file'
|
13
15
|
def init
|
16
|
+
template('settings.tt', '.atomic_sass.yml')
|
17
|
+
end
|
18
|
+
|
19
|
+
desc 'build', 'Generate base structure for atomic sass'
|
20
|
+
def build
|
14
21
|
build_base_structure
|
15
22
|
end
|
16
23
|
|
@@ -22,19 +29,19 @@ module AtomicSass
|
|
22
29
|
def generate
|
23
30
|
_only_file_options.each do |key, values|
|
24
31
|
values.each do |value|
|
25
|
-
file_path, enclosing_dirs = _extract_and_create_dirs(value, "
|
26
|
-
create_sass_doc("
|
32
|
+
file_path, enclosing_dirs = _extract_and_create_dirs(value, "#{settings.source_dir}/#{key.pluralize}")
|
33
|
+
create_sass_doc("#{settings.source_dir}/#{key.pluralize}/#{enclosing_dirs}_#{file_path}", key)
|
27
34
|
end
|
28
35
|
append_to_manifest(key, values)
|
29
36
|
end
|
30
37
|
_include_atoms(_only_include_options, options[:atom]) if _only_include_options && options[:atom]
|
31
38
|
end
|
32
39
|
|
33
|
-
desc '
|
40
|
+
desc 'compile', 'Compile the sass to css'
|
34
41
|
method_option :watch, type: :boolean, aliases: %W[ -w ]
|
35
|
-
def
|
42
|
+
def compile
|
36
43
|
if options[:watch]
|
37
|
-
|
44
|
+
_compile_sass(true)
|
38
45
|
else
|
39
46
|
_compile_sass
|
40
47
|
end
|
@@ -42,21 +49,27 @@ module AtomicSass
|
|
42
49
|
|
43
50
|
no_commands do
|
44
51
|
|
52
|
+
def settings
|
53
|
+
@settings ||= AtomicSass::Settings.new
|
54
|
+
end
|
55
|
+
|
45
56
|
def create_sass_doc(path, key)
|
57
|
+
ext = settings.sass_syntax
|
46
58
|
if not key.match /molecule|quark/
|
47
|
-
create_file(path)
|
59
|
+
create_file("#{path}.#{ext}")
|
48
60
|
else
|
49
|
-
create_file(path) do
|
61
|
+
create_file("#{path}.#{ext}") do
|
50
62
|
["//--- BEGIN IMPORTS", "//--- END IMPORTS", "\n"].join("\n")
|
51
63
|
end
|
52
64
|
end
|
53
65
|
end
|
54
66
|
|
55
67
|
def append_to_manifest(manifest_type, generated_filenames)
|
68
|
+
ext = settings.sass_syntax
|
56
69
|
unless manifest_type == 'atom'
|
57
|
-
inject_into_file("
|
70
|
+
inject_into_file("#{settings.source_dir}/#{manifest_type.pluralize}/#{manifest_type}_manifest.#{ext}", before: "\n//--- END IMPORTS") do
|
58
71
|
generated_filenames.map do |filename|
|
59
|
-
|
72
|
+
_sass_import(filename)
|
60
73
|
end.join("\n").prepend("\n")
|
61
74
|
end
|
62
75
|
end
|
@@ -65,41 +78,36 @@ module AtomicSass
|
|
65
78
|
def build_base_structure
|
66
79
|
entries = %w[ utility quark molecule atom ]
|
67
80
|
manifest_entries = entries.reject { |e| e == 'atom' }
|
68
|
-
empty_directory(
|
69
|
-
empty_directory(
|
81
|
+
empty_directory(settings.source_dir)
|
82
|
+
empty_directory(settings.dest_dir)
|
70
83
|
_build_application_sass(manifest_entries)
|
71
84
|
_build_empty_dirs(entries)
|
72
85
|
_build_manifest_entries(manifest_entries)
|
73
86
|
end
|
74
87
|
|
75
|
-
def _compile_sass
|
76
|
-
|
77
|
-
|
88
|
+
def _compile_sass(watch = false)
|
89
|
+
ext = settings.sass_syntax
|
90
|
+
if ext == 'sass'
|
91
|
+
::Sass::Exec::Sass.new(%W[ #{settings.source_dir}/application.#{ext}:#{settings.dest_dir}/application.css ]).parse
|
92
|
+
::Sass::Exec::Sass.new(%W[ #{settings.source_dir}/application.#{ext}:#{settings.dest_dir}/application.css ]).parse if watch
|
78
93
|
else
|
79
|
-
|
80
|
-
|
81
|
-
end
|
82
|
-
|
83
|
-
|
84
|
-
def _compile_and_watch_sass
|
85
|
-
_compile_sass
|
86
|
-
puts "Watching for changes to application.sass"
|
87
|
-
unless ::Sass::Exec::Sass.new(%w[ --watch sass/application.sass:css/application.css ]).parse
|
88
|
-
puts "Failed to watch sass"
|
94
|
+
::Sass::Exec::Scss.new(%W[ #{settings.source_dir}/application.#{ext}:#{settings.dest_dir}/application.css ]).parse
|
95
|
+
::Sass::Exec::Scss.new(%W[ #{settings.source_dir}/application.#{ext}:#{settings.dest_dir}/application.css ]).parse if watch
|
89
96
|
end
|
90
97
|
end
|
91
98
|
|
92
99
|
def _build_application_sass(entries)
|
93
|
-
|
100
|
+
ext = settings.sass_syntax
|
101
|
+
create_file("#{settings.source_dir}/application.#{ext}") do
|
94
102
|
entries.map do |entry|
|
95
|
-
"
|
103
|
+
_sass_import("#{entry.pluralize}/#{entry}_manifest")
|
96
104
|
end.join("\n")
|
97
105
|
end
|
98
106
|
end
|
99
107
|
|
100
108
|
def _build_empty_dirs(entries)
|
101
109
|
entries.each do |entry|
|
102
|
-
empty_directory("
|
110
|
+
empty_directory("#{settings.source_dir}/#{entry.pluralize}")
|
103
111
|
end
|
104
112
|
end
|
105
113
|
|
@@ -110,8 +118,9 @@ module AtomicSass
|
|
110
118
|
end
|
111
119
|
|
112
120
|
def _build_manifest_entries(entries)
|
121
|
+
ext = settings.sass_syntax
|
113
122
|
entries.each do |entry|
|
114
|
-
template("#{entry}_manifest.tt", "
|
123
|
+
template("#{entry}_manifest.tt", "#{settings.source_dir}/#{entry.pluralize}/#{entry}_manifest.#{ext}")
|
115
124
|
end
|
116
125
|
end
|
117
126
|
|
@@ -125,18 +134,27 @@ module AtomicSass
|
|
125
134
|
end
|
126
135
|
|
127
136
|
def _include_atoms(include_types, atoms)
|
137
|
+
ext = settings.sass_syntax
|
128
138
|
include_types.each do |type, filenames|
|
129
139
|
filenames.each do |filename|
|
130
|
-
file_path, enclosing_dirs = _extract_and_create_dirs(filename, "
|
131
|
-
inject_into_file("
|
140
|
+
file_path, enclosing_dirs = _extract_and_create_dirs(filename, "#{settings.source_dir}/#{type.pluralize}")
|
141
|
+
inject_into_file("#{settings.source_dir}/#{type.pluralize}/#{enclosing_dirs}_#{file_path}.#{ext}", before: "\n//--- END IMPORTS") do
|
132
142
|
atoms.map do |atom|
|
133
|
-
"
|
143
|
+
_sass_import("../#{_escape_file_path(enclosing_dirs)}atoms/#{atom}")
|
134
144
|
end.join("\n").prepend("\n")
|
135
145
|
end
|
136
146
|
end
|
137
147
|
end
|
138
148
|
end
|
139
149
|
|
150
|
+
def _sass_import(file_path)
|
151
|
+
if settings.sass_syntax == 'sass'
|
152
|
+
return "@import #{file_path}"
|
153
|
+
else
|
154
|
+
return "@import \"#{file_path}\";"
|
155
|
+
end
|
156
|
+
end
|
157
|
+
|
140
158
|
def _only_file_options
|
141
159
|
options.reject { |key, value| key.match /include/ }
|
142
160
|
end
|
@@ -0,0 +1,26 @@
|
|
1
|
+
module AtomicSass
|
2
|
+
class Settings
|
3
|
+
attr_reader :settings
|
4
|
+
|
5
|
+
def initialize
|
6
|
+
@settings = YAML.load_file('.atomic_sass.yml')
|
7
|
+
end
|
8
|
+
|
9
|
+
def source_dir
|
10
|
+
@settings['source_dir'] || 'sass'
|
11
|
+
end
|
12
|
+
|
13
|
+
def dest_dir
|
14
|
+
@settings['dest_dir'] || 'css'
|
15
|
+
end
|
16
|
+
|
17
|
+
def sass_syntax
|
18
|
+
if @settings['sass_syntax']
|
19
|
+
raise "invalid sass syntax specified" unless @settings['sass_syntax'].match /scss|sass/
|
20
|
+
return @settings['sass_syntax']
|
21
|
+
else
|
22
|
+
return 'sass'
|
23
|
+
end
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
data/lib/atomic_sass/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: atomic_sass
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.2.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Travis Staton
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2013-10-
|
11
|
+
date: 2013-10-02 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: sass
|
@@ -96,8 +96,10 @@ files:
|
|
96
96
|
- atomic_sass.gemspec
|
97
97
|
- bin/atom
|
98
98
|
- lib/atomic_sass.rb
|
99
|
+
- lib/atomic_sass/settings.rb
|
99
100
|
- lib/atomic_sass/templates/molecule_manifest.tt
|
100
101
|
- lib/atomic_sass/templates/quark_manifest.tt
|
102
|
+
- lib/atomic_sass/templates/settings.tt
|
101
103
|
- lib/atomic_sass/templates/utility_manifest.tt
|
102
104
|
- lib/atomic_sass/version.rb
|
103
105
|
homepage: ''
|