app_sleuth 0.0.1.pre
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.
- data/.gitignore +25 -0
- data/Gemfile +7 -0
- data/LICENSE +22 -0
- data/README.md +29 -0
- data/Rakefile +2 -0
- data/app_sleuth.gemspec +20 -0
- data/bin/app_sleuth +20 -0
- data/config.ru +10 -0
- data/lib/app_sleuth.rb +10 -0
- data/lib/app_sleuth/colors.rb +36 -0
- data/lib/app_sleuth/fonts.rb +108 -0
- data/lib/app_sleuth/server.rb +22 -0
- data/lib/app_sleuth/server/assets/css/style.css +910 -0
- data/lib/app_sleuth/server/assets/js/libs/jquery-1.7.1.js +9266 -0
- data/lib/app_sleuth/server/assets/js/libs/jquery-1.7.1.min.js +4 -0
- data/lib/app_sleuth/server/assets/js/libs/modernizr-2.5.3.min.js +4 -0
- data/lib/app_sleuth/server/assets/js/plugins.js +11 -0
- data/lib/app_sleuth/server/assets/js/script.js +26 -0
- data/lib/app_sleuth/server/assets/sass/_boilerplate.scss +88 -0
- data/lib/app_sleuth/server/assets/sass/_marcotte-grid.scss +206 -0
- data/lib/app_sleuth/server/assets/sass/_normalize.scss +504 -0
- data/lib/app_sleuth/server/assets/sass/_print.scss +19 -0
- data/lib/app_sleuth/server/assets/sass/mixins/_mixins.scss +136 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_button.scss +170 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_font-family.scss +30 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_html5-input-types.scss +36 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_non-semantic-helpers.scss +58 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_position.scss +30 -0
- data/lib/app_sleuth/server/assets/sass/mixins/addons/_timing-functions.scss +32 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_animation.scss +171 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_appearance.scss +7 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_background-clip.scss +10 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_background-image.scss +147 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_background-origin.scss +10 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_background-size.scss +15 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_border-image.scss +7 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_border-radius.scss +59 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_box-shadow.scss +16 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_box-sizing.scss +8 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_columns.scss +67 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_flex-box.scss +67 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_font-smoothing.scss +9 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_inline-block.scss +10 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_linear-gradient.scss +41 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_radial-gradient.scss +31 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_transform.scss +57 -0
- data/lib/app_sleuth/server/assets/sass/mixins/css3/_transition.scss +104 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_deprecated-webkit-gradient.scss +36 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_linear-gradient.scss +23 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_modular-scale.scss +40 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_radial-gradient.scss +15 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_render-gradients.scss +14 -0
- data/lib/app_sleuth/server/assets/sass/mixins/functions/_tint-shade.scss +9 -0
- data/lib/app_sleuth/server/assets/sass/mixins/hacks/_ie.scss +37 -0
- data/lib/app_sleuth/server/assets/sass/style.scss +219 -0
- data/lib/app_sleuth/server/views/colors.html.erb +44 -0
- data/lib/app_sleuth/version.rb +3 -0
- metadata +124 -0
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
// Box-Shadow Mixin Requires Sass v3.1.1+
|
|
2
|
+
@mixin box-shadow ($shadow-1,
|
|
3
|
+
$shadow-2: false, $shadow-3: false,
|
|
4
|
+
$shadow-4: false, $shadow-5: false,
|
|
5
|
+
$shadow-6: false, $shadow-7: false,
|
|
6
|
+
$shadow-8: false, $shadow-9: false)
|
|
7
|
+
{
|
|
8
|
+
$full: compact($shadow-1, $shadow-2, $shadow-3, $shadow-4,
|
|
9
|
+
$shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9);
|
|
10
|
+
|
|
11
|
+
-webkit-box-shadow: $full;
|
|
12
|
+
-moz-box-shadow: $full;
|
|
13
|
+
-ms-box-shadow: $full;
|
|
14
|
+
-o-box-shadow: $full;
|
|
15
|
+
box-shadow: $full;
|
|
16
|
+
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
@mixin columns($arg: auto) {
|
|
2
|
+
// <column-count> || <column-width>
|
|
3
|
+
-webkit-columns: $arg;
|
|
4
|
+
-moz-columns: $arg;
|
|
5
|
+
columns: $arg;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
@mixin column-count($int: auto) {
|
|
9
|
+
// auto || integer
|
|
10
|
+
-webkit-column-count: $int;
|
|
11
|
+
-moz-column-count: $int;
|
|
12
|
+
column-count: $int;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
@mixin column-gap($length: normal) {
|
|
16
|
+
// normal || length
|
|
17
|
+
-webkit-column-gap: $length;
|
|
18
|
+
-moz-column-gap: $length;
|
|
19
|
+
column-gap: $length;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
@mixin column-fill($arg: auto) {
|
|
23
|
+
// auto || length
|
|
24
|
+
-webkit-columns-fill: $arg;
|
|
25
|
+
-moz-columns-fill: $arg;
|
|
26
|
+
columns-fill: $arg;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
@mixin column-rule($arg) {
|
|
30
|
+
// <border-width> || <border-style> || <color>
|
|
31
|
+
-webkit-column-rule: $arg;
|
|
32
|
+
-moz-column-rule: $arg;
|
|
33
|
+
column-rule: $arg;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
@mixin column-rule-color($color) {
|
|
37
|
+
-webkit-column-rule-color: $color;
|
|
38
|
+
-moz-column-rule-color: $color;
|
|
39
|
+
column-rule-color: $color;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
@mixin column-rule-style($style: none) {
|
|
43
|
+
// none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid
|
|
44
|
+
-webkit-column-rule-style: $style;
|
|
45
|
+
-moz-column-rule-style: $style;
|
|
46
|
+
column-rule-style: $style;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
@mixin column-rule-width ($width: none) {
|
|
50
|
+
-webkit-column-rule-width: $width;
|
|
51
|
+
-moz-column-rule-width: $width;
|
|
52
|
+
column-rule-width: $width;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
@mixin column-span($arg: none) {
|
|
56
|
+
// none || all
|
|
57
|
+
-webkit-column-span: $arg;
|
|
58
|
+
-moz-column-span: $arg;
|
|
59
|
+
column-span: $arg;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
@mixin column-width($length: auto) {
|
|
63
|
+
// auto || length
|
|
64
|
+
-webkit-column-width: $length;
|
|
65
|
+
-moz-column-width: $length;
|
|
66
|
+
column-width: $length;
|
|
67
|
+
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
// CSS3 Flexible Box Model and property defaults
|
|
2
|
+
|
|
3
|
+
// Custom shorthand notation for flexbox
|
|
4
|
+
@mixin box($orient: inline-axis, $pack: start, $align: stretch) {
|
|
5
|
+
@include display-box;
|
|
6
|
+
@include box-orient($orient);
|
|
7
|
+
@include box-pack($pack);
|
|
8
|
+
@include box-align($align);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
@mixin display-box {
|
|
12
|
+
display: -webkit-box;
|
|
13
|
+
display: -moz-box;
|
|
14
|
+
display: box;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
@mixin box-orient($orient: inline-axis) {
|
|
18
|
+
// horizontal|vertical|inline-axis|block-axis|inherit
|
|
19
|
+
-webkit-box-orient: $orient;
|
|
20
|
+
-moz-box-orient: $orient;
|
|
21
|
+
box-orient: $orient;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
@mixin box-pack($pack: start) {
|
|
25
|
+
// start|end|center|justify
|
|
26
|
+
-webkit-box-pack: $pack;
|
|
27
|
+
-moz-box-pack: $pack;
|
|
28
|
+
box-pack: $pack;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@mixin box-align($align: stretch) {
|
|
32
|
+
// start|end|center|baseline|stretch
|
|
33
|
+
-webkit-box-align: $align;
|
|
34
|
+
-moz-box-align: $align;
|
|
35
|
+
box-align: $align;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@mixin box-direction($direction: normal) {
|
|
39
|
+
// normal|reverse|inherit
|
|
40
|
+
-webkit-box-direction: $direction;
|
|
41
|
+
-moz-box-direction: $direction;
|
|
42
|
+
box-direction: $direction;
|
|
43
|
+
}
|
|
44
|
+
@mixin box-lines($lines: single) {
|
|
45
|
+
// single|multiple
|
|
46
|
+
-webkit-box-lines: $lines;
|
|
47
|
+
-moz-box-lines: $lines;
|
|
48
|
+
box-lines: $lines;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
@mixin box-ordinal-group($integer: 1) {
|
|
52
|
+
-webkit-box-ordinal-group: $integer;
|
|
53
|
+
-moz-box-ordinal-group: $integer;
|
|
54
|
+
box-ordinal-group: $integer;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
@mixin box-flex($value: 0.0) {
|
|
58
|
+
-webkit-box-flex: $value;
|
|
59
|
+
-moz-box-flex: $value;
|
|
60
|
+
box-flex: $value;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
@mixin box-flex-group($integer: 1) {
|
|
64
|
+
-webkit-box-flex-group: $integer;
|
|
65
|
+
-moz-box-flex-group: $integer;
|
|
66
|
+
box-flex-group: $integer;
|
|
67
|
+
}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
@mixin linear-gradient($pos, $G1, $G2: false,
|
|
2
|
+
$G3: false, $G4: false,
|
|
3
|
+
$G5: false, $G6: false,
|
|
4
|
+
$G7: false, $G8: false,
|
|
5
|
+
$G9: false, $G10: false,
|
|
6
|
+
$fallback: false) {
|
|
7
|
+
// Detect what type of value exists in $pos
|
|
8
|
+
$pos-type: type-of(nth($pos, 1));
|
|
9
|
+
|
|
10
|
+
// If $pos is missing from mixin, reassign vars and add default position
|
|
11
|
+
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
|
12
|
+
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
|
13
|
+
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
|
14
|
+
$pos: top; // Default position
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
|
18
|
+
|
|
19
|
+
// Set $G1 as the default fallback color
|
|
20
|
+
$fallback-color: nth($G1, 1);
|
|
21
|
+
|
|
22
|
+
// If $fallback is a color use that color as the fallback color
|
|
23
|
+
@if (type-of($fallback) == color) or ($fallback == "transparent") {
|
|
24
|
+
$fallback-color: $fallback;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
background-color: $fallback-color;
|
|
28
|
+
background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0
|
|
29
|
+
background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome
|
|
30
|
+
background-image: -moz-linear-gradient($pos, $full);
|
|
31
|
+
background-image: -ms-linear-gradient($pos, $full);
|
|
32
|
+
background-image: -o-linear-gradient($pos, $full);
|
|
33
|
+
background-image: unquote("linear-gradient(#{$pos}, #{$full})");
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
// Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well.
|
|
38
|
+
// @include linear-gradient(#color1, color2);
|
|
39
|
+
// @include linear-gradient(#color1, #color2, $fallback:#color3);
|
|
40
|
+
// @include linear-gradient(top, #color1 0%, #color2 50%);
|
|
41
|
+
// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #color1 50%, #color2 51%, #color3 100%);
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
// Requires Sass 3.1+
|
|
2
|
+
@mixin radial-gradient($pos, $shape-size,
|
|
3
|
+
$G1, $G2,
|
|
4
|
+
$G3: false, $G4: false,
|
|
5
|
+
$G5: false, $G6: false,
|
|
6
|
+
$G7: false, $G8: false,
|
|
7
|
+
$G9: false, $G10: false,
|
|
8
|
+
$fallback: false) {
|
|
9
|
+
|
|
10
|
+
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
|
11
|
+
|
|
12
|
+
// Set $G1 as the default fallback color
|
|
13
|
+
$fallback-color: nth($G1, 1);
|
|
14
|
+
|
|
15
|
+
// If $fallback is a color use that color as the fallback color
|
|
16
|
+
@if (type-of($fallback) == color) or ($fallback == "transparent") {
|
|
17
|
+
$fallback-color: $fallback;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
background-color: $fallback-color;
|
|
21
|
+
background-image: deprecated-webkit-gradient(radial, $full); // Safari <= 5.0
|
|
22
|
+
background-image: -webkit-radial-gradient($pos, $shape-size, $full);
|
|
23
|
+
background-image: -moz-radial-gradient($pos, $shape-size, $full);
|
|
24
|
+
background-image: -ms-radial-gradient($pos, $shape-size, $full);
|
|
25
|
+
background-image: -o-radial-gradient($pos, $shape-size, $full);
|
|
26
|
+
background-image: unquote("radial-gradient(#{$pos}, #{$shape-size}, #{$full})");
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Usage: Gradient position and shape-size are required. Color stops are optional.
|
|
30
|
+
// @include radial-gradient(50% 50%, circle cover, #color1, #color2);
|
|
31
|
+
// @include radial-gradient(50% 50%, circle cover, $grayLightest 10%, #color1 30%, #color2);
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
@mixin transform($property: none) {
|
|
2
|
+
// none | <transform-function>
|
|
3
|
+
-webkit-transform: $property;
|
|
4
|
+
-moz-transform: $property;
|
|
5
|
+
-ms-transform: $property;
|
|
6
|
+
-o-transform: $property;
|
|
7
|
+
transform: $property;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
@mixin transform-origin($axes: 50%) {
|
|
11
|
+
// x-axis - left | center | right | length | %
|
|
12
|
+
// y-axis - top | center | bottom | length | %
|
|
13
|
+
// z-axis - length
|
|
14
|
+
-webkit-transform-origin: $axes;
|
|
15
|
+
-moz-transform-origin: $axes;
|
|
16
|
+
-ms-transform-origin: $axes;
|
|
17
|
+
-o-transform-origin: $axes;
|
|
18
|
+
transform-origin: $axes;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
// Transformations
|
|
23
|
+
@mixin rotate($degrees) {
|
|
24
|
+
-webkit-transform: rotate($degrees);
|
|
25
|
+
-moz-transform: rotate($degrees);
|
|
26
|
+
-ms-transform: rotate($degrees);
|
|
27
|
+
-o-transform: rotate($degrees);
|
|
28
|
+
transform: rotate($degrees);
|
|
29
|
+
}
|
|
30
|
+
@mixin scale($ratio) {
|
|
31
|
+
-webkit-transform: scale($ratio);
|
|
32
|
+
-moz-transform: scale($ratio);
|
|
33
|
+
-ms-transform: scale($ratio);
|
|
34
|
+
-o-transform: scale($ratio);
|
|
35
|
+
transform: scale($ratio);
|
|
36
|
+
}
|
|
37
|
+
@mixin translate($x: 0, $y: 0) {
|
|
38
|
+
-webkit-transform: translate($x, $y);
|
|
39
|
+
-moz-transform: translate($x, $y);
|
|
40
|
+
-ms-transform: translate($x, $y);
|
|
41
|
+
-o-transform: translate($x, $y);
|
|
42
|
+
transform: translate($x, $y);
|
|
43
|
+
}
|
|
44
|
+
@mixin skew($x: 0, $y: 0) {
|
|
45
|
+
-webkit-transform: translate($x, $y);
|
|
46
|
+
-moz-transform: translate($x, $y);
|
|
47
|
+
-ms-transform: translate($x, $y);
|
|
48
|
+
-o-transform: translate($x, $y);
|
|
49
|
+
transform: translate($x, $y);
|
|
50
|
+
}
|
|
51
|
+
@mixin skew($x: 0, $y: 0) {
|
|
52
|
+
-webkit-transform: skew($x, $y);
|
|
53
|
+
-moz-transform: skew($x, $y);
|
|
54
|
+
-ms-transform: skew($x, $y);
|
|
55
|
+
-o-transform: skew($x, $y);
|
|
56
|
+
transform: skew($x, $y);
|
|
57
|
+
}
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable.
|
|
2
|
+
// Example: @include transition (all, 2.0s, ease-in-out);
|
|
3
|
+
// @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s));
|
|
4
|
+
// @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s));
|
|
5
|
+
|
|
6
|
+
@mixin transition ($property: all, $duration: 0.15s, $timing-function: ease-out, $delay: 0) {
|
|
7
|
+
|
|
8
|
+
// Detect # of args passed into each variable
|
|
9
|
+
$length-of-property: length($property);
|
|
10
|
+
$length-of-duration: length($duration);
|
|
11
|
+
$length-of-timing-function: length($timing-function);
|
|
12
|
+
$length-of-delay: length($delay);
|
|
13
|
+
|
|
14
|
+
@if $length-of-property > 1 {
|
|
15
|
+
@include transition-property(zip($property)); }
|
|
16
|
+
@else {
|
|
17
|
+
@include transition-property( $property);
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@if $length-of-duration > 1 {
|
|
21
|
+
@include transition-duration(zip($duration)); }
|
|
22
|
+
@else {
|
|
23
|
+
@include transition-duration( $duration);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
@if $length-of-timing-function > 1 {
|
|
27
|
+
@include transition-timing-function(zip($timing-function)); }
|
|
28
|
+
@else {
|
|
29
|
+
@include transition-timing-function( $timing-function);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
@if $length-of-delay > 1 {
|
|
33
|
+
@include transition-delay(zip($delay)); }
|
|
34
|
+
@else {
|
|
35
|
+
@include transition-delay( $delay);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
@mixin transition-property ($prop-1: all,
|
|
41
|
+
$prop-2: false, $prop-3: false,
|
|
42
|
+
$prop-4: false, $prop-5: false,
|
|
43
|
+
$prop-6: false, $prop-7: false,
|
|
44
|
+
$prop-8: false, $prop-9: false)
|
|
45
|
+
{
|
|
46
|
+
$full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5,
|
|
47
|
+
$prop-6, $prop-7, $prop-8, $prop-9);
|
|
48
|
+
|
|
49
|
+
-webkit-transition-property: $full;
|
|
50
|
+
-moz-transition-property: $full;
|
|
51
|
+
-ms-transition-property: $full;
|
|
52
|
+
-o-transition-property: $full;
|
|
53
|
+
transition-property: $full;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
@mixin transition-duration ($time-1: 0,
|
|
57
|
+
$time-2: false, $time-3: false,
|
|
58
|
+
$time-4: false, $time-5: false,
|
|
59
|
+
$time-6: false, $time-7: false,
|
|
60
|
+
$time-8: false, $time-9: false)
|
|
61
|
+
{
|
|
62
|
+
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
|
63
|
+
$time-6, $time-7, $time-8, $time-9);
|
|
64
|
+
|
|
65
|
+
-webkit-transition-duration: $full;
|
|
66
|
+
-moz-transition-duration: $full;
|
|
67
|
+
-ms-transition-duration: $full;
|
|
68
|
+
-o-transition-duration: $full;
|
|
69
|
+
transition-duration: $full;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
@mixin transition-timing-function ($motion-1: ease,
|
|
73
|
+
$motion-2: false, $motion-3: false,
|
|
74
|
+
$motion-4: false, $motion-5: false,
|
|
75
|
+
$motion-6: false, $motion-7: false,
|
|
76
|
+
$motion-8: false, $motion-9: false)
|
|
77
|
+
{
|
|
78
|
+
$full: compact($motion-1, $motion-2, $motion-3, $motion-4, $motion-5,
|
|
79
|
+
$motion-6, $motion-7, $motion-8, $motion-9);
|
|
80
|
+
|
|
81
|
+
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
|
|
82
|
+
-webkit-transition-timing-function: $full;
|
|
83
|
+
-moz-transition-timing-function: $full;
|
|
84
|
+
-ms-transition-timing-function: $full;
|
|
85
|
+
-o-transition-timing-function: $full;
|
|
86
|
+
transition-timing-function: $full;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
@mixin transition-delay ($time-1: 0,
|
|
90
|
+
$time-2: false, $time-3: false,
|
|
91
|
+
$time-4: false, $time-5: false,
|
|
92
|
+
$time-6: false, $time-7: false,
|
|
93
|
+
$time-8: false, $time-9: false)
|
|
94
|
+
{
|
|
95
|
+
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
|
96
|
+
$time-6, $time-7, $time-8, $time-9);
|
|
97
|
+
|
|
98
|
+
-webkit-transition-delay: $full;
|
|
99
|
+
-moz-transition-delay: $full;
|
|
100
|
+
-ms-transition-delay: $full;
|
|
101
|
+
-o-transition-delay: $full;
|
|
102
|
+
transition-delay: $full;
|
|
103
|
+
}
|
|
104
|
+
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// Render Deprecated Webkit Gradient - Linear || Radial
|
|
2
|
+
//************************************************************************//
|
|
3
|
+
@function deprecated-webkit-gradient($type, $full) {
|
|
4
|
+
$gradient-list: ();
|
|
5
|
+
$gradient: false;
|
|
6
|
+
$full-length: length($full);
|
|
7
|
+
$percentage: false;
|
|
8
|
+
$gradient-type: $type;
|
|
9
|
+
|
|
10
|
+
@for $i from 1 through $full-length {
|
|
11
|
+
$gradient: nth($full, $i);
|
|
12
|
+
|
|
13
|
+
@if length($gradient) == 2 {
|
|
14
|
+
$color-stop: color-stop(nth($gradient, 2), nth($gradient, 1));
|
|
15
|
+
$gradient-list: join($gradient-list, $color-stop, comma);
|
|
16
|
+
}
|
|
17
|
+
@else {
|
|
18
|
+
@if $i == $full-length {
|
|
19
|
+
$percentage: 100%;
|
|
20
|
+
}
|
|
21
|
+
@else {
|
|
22
|
+
$percentage: ($i - 1) * (100 / ($full-length - 1)) + "%";
|
|
23
|
+
}
|
|
24
|
+
$color-stop: color-stop(unquote($percentage), $gradient);
|
|
25
|
+
$gradient-list: join($gradient-list, $color-stop, comma);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
@if $type == radial {
|
|
30
|
+
$gradient: -webkit-gradient(radial, center center, 0, center center, 460, $gradient-list);
|
|
31
|
+
}
|
|
32
|
+
@else if $type == linear {
|
|
33
|
+
$gradient: -webkit-gradient(linear, left top, left bottom, $gradient-list);
|
|
34
|
+
}
|
|
35
|
+
@return $gradient;
|
|
36
|
+
}
|