nail_polish 0.2.9 → 0.3.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/javascripts/nail_polish/events.js +0 -15
- data/app/assets/javascripts/nail_polish/view.js +4 -11
- data/app/assets/javascripts/nail_polish/widget/dropdown.js +2 -2
- data/app/assets/javascripts/nail_polish/widget/menu.js +2 -2
- data/app/assets/stylesheets/nail_polish/base.scss +2 -1
- data/app/assets/stylesheets/nail_polish/base/grid.scss +4 -0
- data/app/assets/stylesheets/nail_polish/base/mixins.scss +61 -1
- data/app/assets/stylesheets/nail_polish/base/widgets/modal.scss +35 -0
- data/app/assets/stylesheets/nail_polish/base/widgets/panels.scss +13 -3
- data/app/assets/stylesheets/nail_polish/desktop.scss +1 -0
- data/app/assets/stylesheets/nail_polish/desktop/widgets/modal.scss +3 -0
- data/app/assets/stylesheets/nail_polish/tablet_and_desktop.scss +0 -1
- data/lib/nail_polish/version.rb +1 -1
- metadata +15 -15
- data/README.rdoc +0 -27
- data/app/assets/stylesheets/nail_polish/tablet_and_desktop/widgets/modal.scss +0 -5
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 7942b77d9c027c55a16d69d19e1d9621e96668ce
|
|
4
|
+
data.tar.gz: 1a0103189b1c0400b2a4187ff8c5e99c339ac16c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: e656e2cc235d269bb5b08a4d61b92f353c21d71da55782a714576ed900b8087dc1f46154b5bb01cca981bfa7240ea8c1906d0cfdef5b49d475be30893aa4daab
|
|
7
|
+
data.tar.gz: 5eae2ecdf00aa5c1a839179691c0cddb164711dce1b2eae4a0e480e8bd62fd27f7e9647cdfb4b7e9d8b8a48b859f7a2919bb84e6bdd0c8e7f175c277af8cecec
|
|
@@ -1,17 +1,4 @@
|
|
|
1
1
|
NailPolish.Events = {
|
|
2
|
-
isTouch: function() {
|
|
3
|
-
// taken from Modernizr: http://modernizr.com/license
|
|
4
|
-
return (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch);
|
|
5
|
-
},
|
|
6
|
-
|
|
7
|
-
isWindowsTouch: function() {
|
|
8
|
-
if (/Windows.NT.6/i.test(navigator.userAgent)){
|
|
9
|
-
return true;
|
|
10
|
-
}
|
|
11
|
-
return false;
|
|
12
|
-
},
|
|
13
|
-
startEvent: 'touchstart',
|
|
14
|
-
|
|
15
2
|
publisher: _.extend({}, Backbone.Events),
|
|
16
3
|
|
|
17
4
|
publish: function (event, args) {
|
|
@@ -26,5 +13,3 @@ NailPolish.Events = {
|
|
|
26
13
|
this.publisher.off(event, callback, context);
|
|
27
14
|
}
|
|
28
15
|
};
|
|
29
|
-
|
|
30
|
-
NailPolish.Events['click'] = NailPolish.Events.isTouch() ? NailPolish.Events.startEvent+' ' : 'click ';
|
|
@@ -49,24 +49,17 @@ NailPolish.View = Backbone.View.extend(_.extend(_.clone(NailPolish.SubviewManage
|
|
|
49
49
|
},
|
|
50
50
|
|
|
51
51
|
events: function () {
|
|
52
|
-
if (NailPolish.Events.isTouch() && !NailPolish.Events.isWindowsTouch()) {
|
|
53
|
-
var eventSet = {};
|
|
54
|
-
|
|
55
|
-
_.each(_.keys(this.addListeners), function (eventKey) {
|
|
56
|
-
var key = eventKey.replace('click', NailPolish.Events.startEvent);
|
|
57
|
-
eventSet[key] = this.addListeners[eventKey];
|
|
58
|
-
}.bind(this));
|
|
59
|
-
|
|
60
|
-
return eventSet;
|
|
61
|
-
}
|
|
62
52
|
return this.addListeners;
|
|
63
53
|
},
|
|
64
54
|
|
|
65
55
|
renderTemplate: function () {
|
|
66
|
-
var
|
|
56
|
+
var templateName = _.isFunction(this.templateName) ? this.templateName() : this.templateName;
|
|
57
|
+
|
|
58
|
+
var template = HoganTemplates[templateName];
|
|
67
59
|
if (!template) {
|
|
68
60
|
return;
|
|
69
61
|
}
|
|
62
|
+
|
|
70
63
|
var rendered = template.render(this.presenter(), this.partials());
|
|
71
64
|
this.$el.html(rendered);
|
|
72
65
|
},
|
|
@@ -38,11 +38,11 @@ NailPolish.Widget.Dropdown = NailPolish.View.extend({
|
|
|
38
38
|
|
|
39
39
|
showMenu: function() {
|
|
40
40
|
this.$el.find(this.menuSelector).removeClass(this.hiddenClass);
|
|
41
|
-
$('body').on(
|
|
41
|
+
$('body').on('click', this.hideMenu.bind(this));
|
|
42
42
|
},
|
|
43
43
|
|
|
44
44
|
removeBodyListener: function() {
|
|
45
|
-
$('body').off(
|
|
45
|
+
$('body').off('click', this.hideMenu.bind(this));
|
|
46
46
|
},
|
|
47
47
|
|
|
48
48
|
renderTemplate: function () {
|
|
@@ -31,7 +31,7 @@ NailPolish.Widget.Menu = NailPolish.View.extend({
|
|
|
31
31
|
this.$('.menu-trigger').addClass("selected");
|
|
32
32
|
this.$('.menu-items').css("display", "block");
|
|
33
33
|
this.onBodyClick = this.hideMenu.bind(this);
|
|
34
|
-
$('body').on(
|
|
34
|
+
$('body').on('click', this.onBodyClick);
|
|
35
35
|
e.stopPropagation();
|
|
36
36
|
e.preventDefault();
|
|
37
37
|
},
|
|
@@ -49,7 +49,7 @@ NailPolish.Widget.Menu = NailPolish.View.extend({
|
|
|
49
49
|
|
|
50
50
|
removeBodyListener: function() {
|
|
51
51
|
if(this.onBodyClick){
|
|
52
|
-
$('body').off(
|
|
52
|
+
$('body').off('click', this.onBodyClick);
|
|
53
53
|
this.onBodyClick = undefined;
|
|
54
54
|
}
|
|
55
55
|
},
|
|
@@ -37,4 +37,64 @@
|
|
|
37
37
|
@mixin input-margin-fix {
|
|
38
38
|
margin-left: -$input-side-padding;
|
|
39
39
|
margin-top: -$input-top-padding;
|
|
40
|
-
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
@mixin up-arrow($size, $border-size, $left-pos, $background-color, $border-color) {
|
|
43
|
+
.up-arrow {
|
|
44
|
+
position: relative;
|
|
45
|
+
background: $background-color;
|
|
46
|
+
|
|
47
|
+
&:after, &:before {
|
|
48
|
+
bottom: 100%;
|
|
49
|
+
left: $left-pos;
|
|
50
|
+
border: solid transparent;
|
|
51
|
+
content: " ";
|
|
52
|
+
height: 0;
|
|
53
|
+
width: 0;
|
|
54
|
+
position: absolute;
|
|
55
|
+
pointer-events: none;
|
|
56
|
+
}
|
|
57
|
+
&:after {
|
|
58
|
+
border-color: transparent;
|
|
59
|
+
border-bottom-color: $background-color;
|
|
60
|
+
border-width: $size;
|
|
61
|
+
margin-left: -$size;
|
|
62
|
+
}
|
|
63
|
+
&:before {
|
|
64
|
+
border-color: transparent;
|
|
65
|
+
border-bottom-color: $border-color;
|
|
66
|
+
border-width: $size + $border-size;
|
|
67
|
+
margin-left: -($size + $border-size);
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
@mixin down-arrow($size, $border-size, $left-pos, $background-color, $border-color) {
|
|
73
|
+
.down-arrow {
|
|
74
|
+
position: relative;
|
|
75
|
+
background: $background-color;
|
|
76
|
+
|
|
77
|
+
&:after, &:before {
|
|
78
|
+
top: 100%;
|
|
79
|
+
left: $left-pos;
|
|
80
|
+
border: solid transparent;
|
|
81
|
+
content: " ";
|
|
82
|
+
height: 0;
|
|
83
|
+
width: 0;
|
|
84
|
+
position: absolute;
|
|
85
|
+
pointer-events: none;
|
|
86
|
+
}
|
|
87
|
+
&:after {
|
|
88
|
+
border-color: transparent;
|
|
89
|
+
border-top-color: $background-color;
|
|
90
|
+
border-width: $size;
|
|
91
|
+
margin-left: -$size;
|
|
92
|
+
}
|
|
93
|
+
&:before {
|
|
94
|
+
border-color: transparent;
|
|
95
|
+
border-top-color: $border-color;
|
|
96
|
+
border-width: $size + $border-size;
|
|
97
|
+
margin-left: -($size + $border-size);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
.modal {
|
|
2
|
+
margin: $spacing auto;
|
|
3
|
+
max-width: 300px;
|
|
4
|
+
position: relative;
|
|
5
|
+
z-index: 10100;
|
|
6
|
+
|
|
7
|
+
@include border-radius;
|
|
8
|
+
|
|
9
|
+
background: transparent;
|
|
10
|
+
> * {
|
|
11
|
+
background: $light-color;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
> .inner {
|
|
15
|
+
padding: $spacing * 2;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.close-icon {
|
|
19
|
+
background: transparent image-url('nail_polish/elements/close_icon.png') no-repeat;
|
|
20
|
+
margin-top: $spacing;
|
|
21
|
+
height: 15px;
|
|
22
|
+
width: 15px;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.light-close-icon {
|
|
26
|
+
background: transparent image-url('nail_polish/elements/white_close_icon.png') no-repeat;
|
|
27
|
+
margin-top: $spacing;
|
|
28
|
+
width: 15px;
|
|
29
|
+
height: 15px;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
&.l-modal {
|
|
33
|
+
margin: 0 auto;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
@@ -1,7 +1,11 @@
|
|
|
1
|
+
@mixin standard-panel {
|
|
2
|
+
@include bordered;
|
|
3
|
+
@include border-radius($border-radius-size);
|
|
4
|
+
}
|
|
5
|
+
|
|
1
6
|
.panel {
|
|
2
7
|
background-color: $light-color;
|
|
3
|
-
@include
|
|
4
|
-
@include bordered;
|
|
8
|
+
@include standard-panel;
|
|
5
9
|
@include box-shadow(3px 3px 0 rgba(0,0,0,0.07));
|
|
6
10
|
}
|
|
7
11
|
|
|
@@ -12,4 +16,10 @@
|
|
|
12
16
|
&.lightest {
|
|
13
17
|
background-color: $light-color;
|
|
14
18
|
}
|
|
15
|
-
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.disabled-panel {
|
|
22
|
+
background-color: opacify($neutral-superlight-color, 0);
|
|
23
|
+
@include standard-panel;
|
|
24
|
+
opacity: 0.5;
|
|
25
|
+
}
|
data/lib/nail_polish/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: nail_polish
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.3.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Kane Baccigalupi
|
|
@@ -10,7 +10,7 @@ authors:
|
|
|
10
10
|
autorequire:
|
|
11
11
|
bindir: bin
|
|
12
12
|
cert_chain: []
|
|
13
|
-
date: 2014-
|
|
13
|
+
date: 2014-09-10 00:00:00.000000000 Z
|
|
14
14
|
dependencies:
|
|
15
15
|
- !ruby/object:Gem::Dependency
|
|
16
16
|
name: rails
|
|
@@ -159,9 +159,6 @@ executables: []
|
|
|
159
159
|
extensions: []
|
|
160
160
|
extra_rdoc_files: []
|
|
161
161
|
files:
|
|
162
|
-
- MIT-LICENSE
|
|
163
|
-
- README.rdoc
|
|
164
|
-
- Rakefile
|
|
165
162
|
- app/assets/images/nail_polish/backgrounds/black-0_5.png
|
|
166
163
|
- app/assets/images/nail_polish/backgrounds/blue-0_5.png
|
|
167
164
|
- app/assets/images/nail_polish/backgrounds/dark_bg.png
|
|
@@ -173,11 +170,10 @@ files:
|
|
|
173
170
|
- app/assets/images/nail_polish/elements/no_image.png
|
|
174
171
|
- app/assets/images/nail_polish/elements/white_close_icon.png
|
|
175
172
|
- app/assets/images/nail_polish/elements/white_down_arrow.png
|
|
176
|
-
- app/assets/javascripts/nail_polish.js
|
|
177
173
|
- app/assets/javascripts/nail_polish/app.js
|
|
178
|
-
- app/assets/javascripts/nail_polish/events.js
|
|
179
174
|
- app/assets/javascripts/nail_polish/events/flasher.js
|
|
180
175
|
- app/assets/javascripts/nail_polish/events/redirector.js
|
|
176
|
+
- app/assets/javascripts/nail_polish/events.js
|
|
181
177
|
- app/assets/javascripts/nail_polish/model.js
|
|
182
178
|
- app/assets/javascripts/nail_polish/models/dropdown.js
|
|
183
179
|
- app/assets/javascripts/nail_polish/models/menu.js
|
|
@@ -198,13 +194,14 @@ files:
|
|
|
198
194
|
- app/assets/javascripts/nail_polish/utils/subview_manager.js
|
|
199
195
|
- app/assets/javascripts/nail_polish/utils/text.js
|
|
200
196
|
- app/assets/javascripts/nail_polish/validator.js
|
|
201
|
-
- app/assets/javascripts/nail_polish/view.js
|
|
202
197
|
- app/assets/javascripts/nail_polish/view/parent_finder.js
|
|
198
|
+
- app/assets/javascripts/nail_polish/view.js
|
|
203
199
|
- app/assets/javascripts/nail_polish/views/form.js
|
|
204
200
|
- app/assets/javascripts/nail_polish/widget/dropdown.js
|
|
205
201
|
- app/assets/javascripts/nail_polish/widget/flash.js
|
|
206
202
|
- app/assets/javascripts/nail_polish/widget/menu.js
|
|
207
203
|
- app/assets/javascripts/nail_polish/widget/modal.js
|
|
204
|
+
- app/assets/javascripts/nail_polish.js
|
|
208
205
|
- app/assets/javascripts/nail_polish_legacy_base.js
|
|
209
206
|
- app/assets/javascripts/nail_polish_modern_base.js
|
|
210
207
|
- app/assets/javascripts/nail_polish_widgets.js
|
|
@@ -214,7 +211,6 @@ files:
|
|
|
214
211
|
- app/assets/javascripts/vendor/underscore.js
|
|
215
212
|
- app/assets/javascripts/vendor/zepto.cookie.js
|
|
216
213
|
- app/assets/javascripts/vendor/zepto.js
|
|
217
|
-
- app/assets/stylesheets/nail_polish/base.scss
|
|
218
214
|
- app/assets/stylesheets/nail_polish/base/buttons.scss
|
|
219
215
|
- app/assets/stylesheets/nail_polish/base/colors.scss
|
|
220
216
|
- app/assets/stylesheets/nail_polish/base/form_elements.scss
|
|
@@ -226,25 +222,29 @@ files:
|
|
|
226
222
|
- app/assets/stylesheets/nail_polish/base/typography_and_tags.scss
|
|
227
223
|
- app/assets/stylesheets/nail_polish/base/variables.scss
|
|
228
224
|
- app/assets/stylesheets/nail_polish/base/widgets/drop_down_menu.scss
|
|
225
|
+
- app/assets/stylesheets/nail_polish/base/widgets/modal.scss
|
|
229
226
|
- app/assets/stylesheets/nail_polish/base/widgets/panels.scss
|
|
230
|
-
- app/assets/stylesheets/nail_polish/
|
|
227
|
+
- app/assets/stylesheets/nail_polish/base.scss
|
|
231
228
|
- app/assets/stylesheets/nail_polish/desktop/grid.scss
|
|
232
229
|
- app/assets/stylesheets/nail_polish/desktop/layout.scss
|
|
233
230
|
- app/assets/stylesheets/nail_polish/desktop/oo_styles.scss
|
|
234
231
|
- app/assets/stylesheets/nail_polish/desktop/widgets/menu.scss
|
|
235
|
-
- app/assets/stylesheets/nail_polish/
|
|
232
|
+
- app/assets/stylesheets/nail_polish/desktop/widgets/modal.scss
|
|
233
|
+
- app/assets/stylesheets/nail_polish/desktop.scss
|
|
236
234
|
- app/assets/stylesheets/nail_polish/tablet/grid.scss
|
|
237
235
|
- app/assets/stylesheets/nail_polish/tablet/oo_styles.scss
|
|
238
|
-
- app/assets/stylesheets/nail_polish/
|
|
236
|
+
- app/assets/stylesheets/nail_polish/tablet.scss
|
|
239
237
|
- app/assets/stylesheets/nail_polish/tablet_and_desktop/typography_and_tags.scss
|
|
240
238
|
- app/assets/stylesheets/nail_polish/tablet_and_desktop/variables.scss
|
|
241
|
-
- app/assets/stylesheets/nail_polish/tablet_and_desktop
|
|
239
|
+
- app/assets/stylesheets/nail_polish/tablet_and_desktop.scss
|
|
242
240
|
- config/initializers/nail_polish.rb
|
|
243
241
|
- config/routes.rb
|
|
244
|
-
- lib/nail_polish.rb
|
|
245
242
|
- lib/nail_polish/engine.rb
|
|
246
243
|
- lib/nail_polish/version.rb
|
|
244
|
+
- lib/nail_polish.rb
|
|
247
245
|
- lib/tasks/nail_polish_tasks.rake
|
|
246
|
+
- MIT-LICENSE
|
|
247
|
+
- Rakefile
|
|
248
248
|
homepage: http://github.com/socialchorus/nail_polish
|
|
249
249
|
licenses: []
|
|
250
250
|
metadata: {}
|
|
@@ -264,7 +264,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
264
264
|
version: '0'
|
|
265
265
|
requirements: []
|
|
266
266
|
rubyforge_project:
|
|
267
|
-
rubygems_version: 2.
|
|
267
|
+
rubygems_version: 2.0.14
|
|
268
268
|
signing_key:
|
|
269
269
|
specification_version: 4
|
|
270
270
|
summary: NailPolish is a Backbone/OOCSS engine for your Rails 4 app
|
data/README.rdoc
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
= NailPolish: SocialChorus/SocialChorus OO Frontend
|
|
2
|
-
|
|
3
|
-
NailPolish is a frontend framework used by the SocialCoders at SocialChorus. With NailPolish, SocialCoders provide a modified version of OOCSS and a set of Backbone
|
|
4
|
-
conventions.
|
|
5
|
-
|
|
6
|
-
== TODO
|
|
7
|
-
* Hogan compilation for performance
|
|
8
|
-
* template in page render to prevent large resources
|
|
9
|
-
* widgets
|
|
10
|
-
* Dropdown menu
|
|
11
|
-
* back button
|
|
12
|
-
* modal
|
|
13
|
-
* form view
|
|
14
|
-
* model view
|
|
15
|
-
* collection view
|
|
16
|
-
* generators
|
|
17
|
-
- view
|
|
18
|
-
- template
|
|
19
|
-
- presenter
|
|
20
|
-
- specs for presenter and view
|
|
21
|
-
* js models
|
|
22
|
-
* simplified CSS
|
|
23
|
-
|
|
24
|
-
== Development
|
|
25
|
-
The current jasmine gem does not play well with engines.
|
|
26
|
-
To modify and test javascript, go into the spec/dummy directory and then
|
|
27
|
-
run `rake jasmine` or `rake jasmine:ci`.
|