fortitude-sass 0.3.0 → 0.3.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/Gemfile.lock +1 -1
- data/Rakefile +1 -0
- data/app/assets/javascripts/fortitude/jquery/blocks/shade.js +21 -33
- data/app/assets/javascripts/fortitude/jquery/generic/measure-scrollbar.js +13 -0
- data/app/assets/javascripts/fortitude/jquery/generic/screen-lock.js +17 -0
- data/app/assets/javascripts/fortitude/jquery/generic/viewport.js +2 -0
- data/app/assets/javascripts/fortitude/jquery/generic/wait-for-animation.js +101 -0
- data/app/assets/stylesheets/fortitude/blocks/_shade.scss +0 -29
- data/app/assets/stylesheets/fortitude/trumps/_screen-lock.scss +6 -0
- data/app/assets/stylesheets/fortitude.scss +1 -0
- data/bower.json +1 -1
- data/lib/fortitude-sass/version.rb +1 -1
- metadata +22 -18
- data/app/assets/javascripts/fortitude/jquery/generic/transition-end.js +0 -50
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a7436c147b4fcdbbf7548ad64efe3619ccc42973
|
|
4
|
+
data.tar.gz: da94a30daca3aeba14a8ad5c40718600c8504acd
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6cedeae44283f73e93104a5bf8110a6793137ddfe0a19c26a693e452e9b48828d1f7836f49f3ab3899e9b573f5dcc1c18205e4909dd97cbea48afa2da853da16
|
|
7
|
+
data.tar.gz: e9c688af29612fd7d8bd40e7e81f1a1ff5fc26370b46d4c0d97b2f1de99de21b077a77d88bb1bdd4496d43a841bb185e6bb793121659a7883501ab4455ce83e8
|
data/Gemfile.lock
CHANGED
data/Rakefile
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
require 'bundler/gem_tasks'
|
|
@@ -1,43 +1,31 @@
|
|
|
1
1
|
(function($) {
|
|
2
2
|
'use strict';
|
|
3
|
-
var $html = $('html');
|
|
4
|
-
|
|
5
|
-
function transitionEndOpen() {
|
|
6
|
-
var $html = $('html');
|
|
7
|
-
$html.removeClass('html--shade--is-transitioning');
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
function transitionEndClose() {
|
|
11
|
-
var $html = $('html');
|
|
12
|
-
$html.removeClass('html--shade--is-transitioning');
|
|
13
|
-
$(document).trigger('close:ft:shade');
|
|
14
|
-
}
|
|
15
|
-
|
|
16
3
|
$(document).
|
|
17
4
|
on('open:ft:shade', '.shade', function(event) {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
// watch the transitionEnd event to remove the transitioning class.
|
|
30
|
-
$this.transitionEnd(transitionEndOpen);
|
|
5
|
+
var $this = $(this);
|
|
6
|
+
if(!$this.hasClass('shade--is-active')) {
|
|
7
|
+
$this
|
|
8
|
+
.addClass('shade--is-active')
|
|
9
|
+
.addClass($this.data().showClass)
|
|
10
|
+
.show()
|
|
11
|
+
.waitForAnimation()
|
|
12
|
+
.then(function() {
|
|
13
|
+
$this.removeClass($this.data().showClass);
|
|
14
|
+
});
|
|
31
15
|
}
|
|
32
16
|
}).
|
|
33
17
|
on('close:ft:shade', '.shade', function(event) {
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
$
|
|
37
|
-
addClass(
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
18
|
+
var $this = $(this);
|
|
19
|
+
if($this.hasClass('shade--is-active')) {
|
|
20
|
+
$this
|
|
21
|
+
.addClass($this.data().hideClass)
|
|
22
|
+
.waitForAnimation()
|
|
23
|
+
.then(function() {
|
|
24
|
+
$this
|
|
25
|
+
.hide()
|
|
26
|
+
.removeClass('shade--is-active')
|
|
27
|
+
.removeClass($this.data().hideClass);
|
|
28
|
+
});
|
|
41
29
|
}
|
|
42
30
|
}).
|
|
43
31
|
on('click.ft.shade.data-api', '.shade', function(event) {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
(function($) {
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
$.measureScrollBar = function() {
|
|
5
|
+
var $body = $('body');
|
|
6
|
+
var element = document.createElement('div');
|
|
7
|
+
element.setAttribute('style', 'position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll;');
|
|
8
|
+
$body.append(element);
|
|
9
|
+
var scrollbarWidth = element.offsetWidth - element.clientWidth;
|
|
10
|
+
$body.get(0).removeChild(element);
|
|
11
|
+
return scrollbarWidth;
|
|
12
|
+
};
|
|
13
|
+
})(jQuery);
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
(function($) {
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
$.screenLock = function(locking) {
|
|
5
|
+
var $html = $('html');
|
|
6
|
+
var $body = $('body');
|
|
7
|
+
|
|
8
|
+
if (locking) {
|
|
9
|
+
$html.addClass('html--is-locked');
|
|
10
|
+
$body.css({paddingRight: $.measureScrollBar()});
|
|
11
|
+
} else {
|
|
12
|
+
$html.removeClass('html--is-locked');
|
|
13
|
+
$body.css({paddingRight: ''});
|
|
14
|
+
}
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
})(jQuery);
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
(function ($) {
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
function transition() {
|
|
5
|
+
var el = document.createElement('fortitude');
|
|
6
|
+
|
|
7
|
+
var eventNames = {
|
|
8
|
+
WebkitTransition : 'webkitTransitionEnd',
|
|
9
|
+
MozTransition : 'transitionend',
|
|
10
|
+
OTransition : 'oTransitionEnd otransitionend',
|
|
11
|
+
transition : 'transitionend'
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
var durationNames = {
|
|
15
|
+
WebkitTransition : '-webkit-transition-duration',
|
|
16
|
+
MozTransition : 'transition-duration',
|
|
17
|
+
OTransition : '-o-transition-duration',
|
|
18
|
+
transition : 'transition-duration'
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
for (var name in eventNames) {
|
|
22
|
+
if (el.style[name] !== undefined) {
|
|
23
|
+
return { end: eventNames[name], duration: durationNames[name] };
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
return false;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
function animation() {
|
|
31
|
+
var el = document.createElement('fortitude');
|
|
32
|
+
|
|
33
|
+
var eventNames = {
|
|
34
|
+
WebkitAnimation : 'webkitAnimationEnd',
|
|
35
|
+
MozAnimation : 'animationend',
|
|
36
|
+
OAnimation : 'oAnimationEnd oanimationend',
|
|
37
|
+
animation : 'animationend'
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
var durationNames = {
|
|
41
|
+
WebkitAnimation : '-webkit-animation-duration',
|
|
42
|
+
MozAnimation : 'animationDuration',
|
|
43
|
+
OAnimation : '-o-animation-duration',
|
|
44
|
+
animation : 'animation-duration'
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
for (var name in eventNames) {
|
|
48
|
+
if (el.style[name] !== undefined) {
|
|
49
|
+
return { end: eventNames[name], duration: durationNames[name] };
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
return false;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
var transitionData = transition();
|
|
57
|
+
var animationData = animation();
|
|
58
|
+
|
|
59
|
+
function parseDuration(duration) {
|
|
60
|
+
var split = duration.split(/(ms|s)/, 2);
|
|
61
|
+
var result = split[1] === "ms" ? parseFloat(split[0]) : parseFloat(split[0]) * 1000;
|
|
62
|
+
return result || 0;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
$.fn.waitForAnimation = function(options, callback) {
|
|
66
|
+
var self = this;
|
|
67
|
+
var called = false;
|
|
68
|
+
var $this = $(self);
|
|
69
|
+
var defaults = {
|
|
70
|
+
type: 'animation'
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
var options = $.extend({}, defaults, options);
|
|
74
|
+
if (options.type === 'animation') {
|
|
75
|
+
var eventType = animationData.end;
|
|
76
|
+
var duration = parseDuration(getComputedStyle($this.get(0), null)[animationData.duration]);
|
|
77
|
+
} else if (options.type === 'transition') {
|
|
78
|
+
var eventType = transitionData.end;
|
|
79
|
+
var duration = parseDuration(getComputedStyle($this.get(0), null)[transitionData.duration]);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
var defer = $.Deferred(function( defer ) {
|
|
83
|
+
var _callback = function() {
|
|
84
|
+
called = true;
|
|
85
|
+
$this.off(eventType, _callback);
|
|
86
|
+
if (timeoutId) {
|
|
87
|
+
clearTimeout(timeoutId);
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
defer.resolve();
|
|
91
|
+
};
|
|
92
|
+
|
|
93
|
+
$this.on(eventType, _callback);
|
|
94
|
+
var timeoutId = setTimeout(_callback, duration);
|
|
95
|
+
|
|
96
|
+
}).promise();
|
|
97
|
+
|
|
98
|
+
return defer.done( callback );
|
|
99
|
+
|
|
100
|
+
};
|
|
101
|
+
})(jQuery);
|
|
@@ -6,46 +6,17 @@ $fortitude-shade-background-color: rgba(0,0,0, 0.3) !default;
|
|
|
6
6
|
$fortitude-shade-transition-speed: 0.3s !default;
|
|
7
7
|
|
|
8
8
|
@mixin fortitude-shade {
|
|
9
|
-
transition: opacity $fortitude-shade-transition-speed ease-in-out;
|
|
10
9
|
display: none;
|
|
11
10
|
position: fixed;
|
|
12
11
|
top: 0;
|
|
13
12
|
right: 0;
|
|
14
13
|
bottom: 0;
|
|
15
14
|
left: 0;
|
|
16
|
-
overflow: hidden;
|
|
17
|
-
-webkit-overflow-scrolling: touch;
|
|
18
|
-
-moz-overflow-scrolling: touch;
|
|
19
|
-
-ms-overflow-scrolling: touch;
|
|
20
|
-
overflow-scrolling: touch;
|
|
21
|
-
opacity: 0;
|
|
22
15
|
@if $fortitude-shade-background-color {
|
|
23
16
|
background-color: $fortitude-shade-background-color;
|
|
24
17
|
}
|
|
25
18
|
}
|
|
26
19
|
|
|
27
|
-
@mixin fortitude-html--shade--is-transitioning($selector: ".#{$fortitude-namespace}shade") {
|
|
28
|
-
#{$selector} {
|
|
29
|
-
display: block;
|
|
30
|
-
opacity: 0;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
@mixin fortitude-html--shade--is-active($selector: ".#{$fortitude-namespace}shade") {
|
|
35
|
-
#{$selector} {
|
|
36
|
-
display: block;
|
|
37
|
-
opacity: 1;
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
20
|
.#{$fortitude-namespace}shade {
|
|
42
21
|
@include fortitude-shade;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
.#{$fortitude-namespace}html--shade--is-transitioning {
|
|
46
|
-
@include fortitude-html--shade--is-transitioning;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
.#{$fortitude-namespace}html--shade--is-active {
|
|
50
|
-
@include fortitude-html--shade--is-active;
|
|
51
22
|
}
|
data/bower.json
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: fortitude-sass
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.3.
|
|
4
|
+
version: 0.3.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Aaron Reisman
|
|
@@ -14,70 +14,70 @@ dependencies:
|
|
|
14
14
|
name: sass
|
|
15
15
|
requirement: !ruby/object:Gem::Requirement
|
|
16
16
|
requirements:
|
|
17
|
-
- -
|
|
17
|
+
- - ">="
|
|
18
18
|
- !ruby/object:Gem::Version
|
|
19
19
|
version: '0'
|
|
20
20
|
type: :runtime
|
|
21
21
|
prerelease: false
|
|
22
22
|
version_requirements: !ruby/object:Gem::Requirement
|
|
23
23
|
requirements:
|
|
24
|
-
- -
|
|
24
|
+
- - ">="
|
|
25
25
|
- !ruby/object:Gem::Version
|
|
26
26
|
version: '0'
|
|
27
27
|
- !ruby/object:Gem::Dependency
|
|
28
28
|
name: autoprefixer-rails
|
|
29
29
|
requirement: !ruby/object:Gem::Requirement
|
|
30
30
|
requirements:
|
|
31
|
-
- -
|
|
31
|
+
- - ">="
|
|
32
32
|
- !ruby/object:Gem::Version
|
|
33
33
|
version: '0'
|
|
34
34
|
type: :runtime
|
|
35
35
|
prerelease: false
|
|
36
36
|
version_requirements: !ruby/object:Gem::Requirement
|
|
37
37
|
requirements:
|
|
38
|
-
- -
|
|
38
|
+
- - ">="
|
|
39
39
|
- !ruby/object:Gem::Version
|
|
40
40
|
version: '0'
|
|
41
41
|
- !ruby/object:Gem::Dependency
|
|
42
42
|
name: thor
|
|
43
43
|
requirement: !ruby/object:Gem::Requirement
|
|
44
44
|
requirements:
|
|
45
|
-
- -
|
|
45
|
+
- - ">="
|
|
46
46
|
- !ruby/object:Gem::Version
|
|
47
47
|
version: '0'
|
|
48
48
|
type: :runtime
|
|
49
49
|
prerelease: false
|
|
50
50
|
version_requirements: !ruby/object:Gem::Requirement
|
|
51
51
|
requirements:
|
|
52
|
-
- -
|
|
52
|
+
- - ">="
|
|
53
53
|
- !ruby/object:Gem::Version
|
|
54
54
|
version: '0'
|
|
55
55
|
- !ruby/object:Gem::Dependency
|
|
56
56
|
name: aruba
|
|
57
57
|
requirement: !ruby/object:Gem::Requirement
|
|
58
58
|
requirements:
|
|
59
|
-
- - ~>
|
|
59
|
+
- - "~>"
|
|
60
60
|
- !ruby/object:Gem::Version
|
|
61
61
|
version: '0.4'
|
|
62
62
|
type: :development
|
|
63
63
|
prerelease: false
|
|
64
64
|
version_requirements: !ruby/object:Gem::Requirement
|
|
65
65
|
requirements:
|
|
66
|
-
- - ~>
|
|
66
|
+
- - "~>"
|
|
67
67
|
- !ruby/object:Gem::Version
|
|
68
68
|
version: '0.4'
|
|
69
69
|
- !ruby/object:Gem::Dependency
|
|
70
70
|
name: rake
|
|
71
71
|
requirement: !ruby/object:Gem::Requirement
|
|
72
72
|
requirements:
|
|
73
|
-
- -
|
|
73
|
+
- - ">="
|
|
74
74
|
- !ruby/object:Gem::Version
|
|
75
75
|
version: '0'
|
|
76
76
|
type: :development
|
|
77
77
|
prerelease: false
|
|
78
78
|
version_requirements: !ruby/object:Gem::Requirement
|
|
79
79
|
requirements:
|
|
80
|
-
- -
|
|
80
|
+
- - ">="
|
|
81
81
|
- !ruby/object:Gem::Version
|
|
82
82
|
version: '0'
|
|
83
83
|
description: |
|
|
@@ -90,18 +90,21 @@ executables:
|
|
|
90
90
|
extensions: []
|
|
91
91
|
extra_rdoc_files: []
|
|
92
92
|
files:
|
|
93
|
-
- .gitignore
|
|
94
|
-
- .npmignore
|
|
95
|
-
- .scss-lint.yml
|
|
93
|
+
- ".gitignore"
|
|
94
|
+
- ".npmignore"
|
|
95
|
+
- ".scss-lint.yml"
|
|
96
96
|
- Gemfile
|
|
97
97
|
- Gemfile.lock
|
|
98
98
|
- README.md
|
|
99
|
+
- Rakefile
|
|
99
100
|
- app/assets/javascripts/fortitude.jquery.js
|
|
100
101
|
- app/assets/javascripts/fortitude/jquery/blocks/flashbar.js
|
|
101
102
|
- app/assets/javascripts/fortitude/jquery/blocks/select-input.js
|
|
102
103
|
- app/assets/javascripts/fortitude/jquery/blocks/shade.js
|
|
103
|
-
- app/assets/javascripts/fortitude/jquery/generic/
|
|
104
|
+
- app/assets/javascripts/fortitude/jquery/generic/measure-scrollbar.js
|
|
105
|
+
- app/assets/javascripts/fortitude/jquery/generic/screen-lock.js
|
|
104
106
|
- app/assets/javascripts/fortitude/jquery/generic/viewport.js
|
|
107
|
+
- app/assets/javascripts/fortitude/jquery/generic/wait-for-animation.js
|
|
105
108
|
- app/assets/javascripts/fortitude/jquery/index.js
|
|
106
109
|
- app/assets/stylesheets/fortitude.scss
|
|
107
110
|
- app/assets/stylesheets/fortitude/base/_hr.scss
|
|
@@ -145,6 +148,7 @@ files:
|
|
|
145
148
|
- app/assets/stylesheets/fortitude/trumps/_responsive-margin.scss
|
|
146
149
|
- app/assets/stylesheets/fortitude/trumps/_responsive-padding.scss
|
|
147
150
|
- app/assets/stylesheets/fortitude/trumps/_responsive-text.scss
|
|
151
|
+
- app/assets/stylesheets/fortitude/trumps/_screen-lock.scss
|
|
148
152
|
- bin/fortitude
|
|
149
153
|
- bower.json
|
|
150
154
|
- config.rb
|
|
@@ -170,17 +174,17 @@ require_paths:
|
|
|
170
174
|
- lib
|
|
171
175
|
required_ruby_version: !ruby/object:Gem::Requirement
|
|
172
176
|
requirements:
|
|
173
|
-
- -
|
|
177
|
+
- - ">="
|
|
174
178
|
- !ruby/object:Gem::Version
|
|
175
179
|
version: '0'
|
|
176
180
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
177
181
|
requirements:
|
|
178
|
-
- -
|
|
182
|
+
- - ">="
|
|
179
183
|
- !ruby/object:Gem::Version
|
|
180
184
|
version: '0'
|
|
181
185
|
requirements: []
|
|
182
186
|
rubyforge_project: fortitude-sass
|
|
183
|
-
rubygems_version: 2.
|
|
187
|
+
rubygems_version: 2.2.2
|
|
184
188
|
signing_key:
|
|
185
189
|
specification_version: 4
|
|
186
190
|
summary: Fortitude Sass Framework
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
(function ($) {
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
function transitionEnd() {
|
|
5
|
-
var el = document.createElement('fortitude');
|
|
6
|
-
|
|
7
|
-
var transEndEventNames = {
|
|
8
|
-
WebkitTransition : 'webkitTransitionEnd',
|
|
9
|
-
MozTransition : 'transitionend',
|
|
10
|
-
OTransition : 'oTransitionEnd otransitionend',
|
|
11
|
-
transition : 'transitionend'
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
for (var name in transEndEventNames) {
|
|
15
|
-
if (el.style[name] !== undefined) {
|
|
16
|
-
return { end: transEndEventNames[name] };
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
return false;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
function parseTansitionDuration(duration) {
|
|
24
|
-
var split = duration.split(/(ms|s)/, 2);
|
|
25
|
-
var result = split[1] === "ms" ? parseFloat(split[0]) : parseFloat(split[0]) * 1000;
|
|
26
|
-
return result || 0;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
$.support.transition = transitionEnd()
|
|
31
|
-
|
|
32
|
-
$.fn.transitionEnd = function (callback) {
|
|
33
|
-
var self = this;
|
|
34
|
-
var called = false;
|
|
35
|
-
var $this = $(self);
|
|
36
|
-
var duration = parseTansitionDuration(getComputedStyle($this.get(0), null).transitionDuration);
|
|
37
|
-
var _callback = function () {
|
|
38
|
-
called = true;
|
|
39
|
-
$this.off($.support.transition.end, _callback);
|
|
40
|
-
if (timeoutId) {
|
|
41
|
-
clearTimeout(timeoutId);
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
callback.apply(self, arguments);
|
|
45
|
-
};
|
|
46
|
-
$this.on($.support.transition.end, _callback);
|
|
47
|
-
var timeoutId = setTimeout(_callback, duration);
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
})(jQuery);
|