sempli-website-lib 7.1.0-beta.2 → 7.1.0-beta.4

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.
Files changed (224) hide show
  1. package/README.md +25 -25
  2. package/assets/fonts/Lato/Lato-Black.ttf +0 -0
  3. package/assets/fonts/Lato/Lato-BlackItalic.ttf +0 -0
  4. package/assets/fonts/Lato/Lato-Bold.ttf +0 -0
  5. package/assets/fonts/Lato/Lato-BoldItalic.ttf +0 -0
  6. package/assets/fonts/Lato/Lato-Hairline.ttf +0 -0
  7. package/assets/fonts/Lato/Lato-HairlineItalic.ttf +0 -0
  8. package/assets/fonts/Lato/Lato-Italic.ttf +0 -0
  9. package/assets/fonts/Lato/Lato-Light.ttf +0 -0
  10. package/assets/fonts/Lato/Lato-LightItalic.ttf +0 -0
  11. package/assets/fonts/Lato/Lato-Regular.ttf +0 -0
  12. package/assets/fonts/Lato/OFL.txt +0 -0
  13. package/assets/interface/documents.svg +136 -136
  14. package/assets/interface/icons/alert-success.svg +17 -17
  15. package/assets/interface/icons/arrow-left.svg +8 -8
  16. package/assets/interface/icons/arrow-right-02.svg +10 -10
  17. package/assets/interface/icons/arrow-right.svg +8 -8
  18. package/assets/interface/icons/basic-check-magenta.svg +1 -1
  19. package/assets/interface/icons/bulb-example.svg +20 -20
  20. package/assets/interface/icons/bulb-tip.svg +32 -32
  21. package/assets/interface/icons/check-green-circle-large.svg +23 -23
  22. package/assets/interface/icons/check-green.svg +16 -16
  23. package/assets/interface/icons/check-purple.svg +20 -20
  24. package/assets/interface/icons/cloud-download.svg +20 -20
  25. package/assets/interface/icons/document-pdf.svg +13 -13
  26. package/assets/interface/icons/document-review.svg +20 -20
  27. package/assets/interface/icons/document-status-approved.svg +21 -21
  28. package/assets/interface/icons/document-status-empty.svg +18 -18
  29. package/assets/interface/icons/document-status-error.svg +23 -23
  30. package/assets/interface/icons/document-status-success.svg +19 -19
  31. package/assets/interface/icons/eye-action.svg +1 -1
  32. package/assets/interface/icons/hand-stop.svg +19 -19
  33. package/assets/interface/icons/happy-01.svg +0 -0
  34. package/assets/interface/icons/happy-02.svg +0 -0
  35. package/assets/interface/icons/happy-03.svg +0 -0
  36. package/assets/interface/icons/happy-04.svg +0 -0
  37. package/assets/interface/icons/happy-05.svg +0 -0
  38. package/assets/interface/icons/heart.svg +13 -13
  39. package/assets/interface/icons/intercom-messenger-icon.svg +1 -1
  40. package/assets/interface/icons/lock-icon.svg +1 -1
  41. package/assets/interface/icons/mail-circle.svg +32 -32
  42. package/assets/interface/icons/mail-edit.svg +20 -20
  43. package/assets/interface/icons/pen-edit.svg +22 -22
  44. package/assets/interface/icons/plus-circle.svg +22 -22
  45. package/assets/interface/icons/question-sign.svg +10 -10
  46. package/assets/interface/icons/shield.svg +31 -31
  47. package/assets/interface/icons/signature-modal-approved.svg +17 -17
  48. package/assets/interface/icons/signature-modal-waiting.svg +23 -23
  49. package/assets/interface/icons/signature-pending.svg +25 -25
  50. package/assets/interface/icons/signature-step-active.svg +19 -19
  51. package/assets/interface/icons/signature-step-completed.svg +19 -19
  52. package/assets/interface/icons/signature-step-default.svg +19 -19
  53. package/assets/interface/icons/skull.svg +23 -23
  54. package/assets/interface/icons/step-incomplete.svg +18 -18
  55. package/assets/interface/icons/trash-delete.svg +20 -20
  56. package/assets/interface/icons/warning-sign.svg +22 -22
  57. package/assets/interface/icons/x-circle.svg +14 -14
  58. package/assets/interface/sempli_2.0/17-dale_superpoderes.jpeg +0 -0
  59. package/assets/interface/sempli_2.0/17-dale_superpoderes.webp +0 -0
  60. package/assets/interface/sempli_2.0/5-seguridad-y-control-min.png +0 -0
  61. package/assets/interface/sempli_2.0/5-seguridad-y-control-min.webp +0 -0
  62. package/assets/interface/sempli_2.0/7-financia-tu-capital-de-trabajo2-01.webp +0 -0
  63. package/assets/interface/sempli_2.0/7-financia-tu-capital-de-trabajo2.webp +0 -0
  64. package/assets/interface/sempli_2.0/credito-a-termino.jpg +0 -0
  65. package/assets/interface/sempli_2.0/credito-a-termino.webp +0 -0
  66. package/assets/interface/sempli_2.0/credito-flexi-sub-img.jpg +0 -0
  67. package/assets/interface/sempli_2.0/credito-flexi-sub-img.webp +0 -0
  68. package/assets/interface/sempli_2.0/dale_superpoderes.jpg +0 -0
  69. package/assets/interface/sempli_2.0/dale_superpoderes.webp +0 -0
  70. package/assets/interface/sempli_2.0/flexi-01.webp +0 -0
  71. package/assets/interface/sempli_2.0/video-hero-main.mp4 +0 -0
  72. package/assets/interface/sempli_2.0/video-main.mp4 +0 -0
  73. package/assets/interface/sempli_2.0/video-main.webm +0 -0
  74. package/esm2022/lib/sempli-website-lib.module.mjs +5 -5
  75. package/esm2022/public-api.mjs +1 -1
  76. package/fesm2022/sempli-website-lib.mjs +4 -4
  77. package/fesm2022/sempli-website-lib.mjs.map +1 -1
  78. package/package.json +1 -1
  79. package/styles/_main.scss +2 -2
  80. package/styles/master-app.scss +17839 -18114
  81. package/styles/master-landing.scss +20644 -20834
  82. package/styles/modules/_functions.scss +37 -37
  83. package/styles/modules/_mixins.scss +68 -68
  84. package/styles/modules/_variables.scss +54 -54
  85. package/styles/partials/_base.scss +277 -277
  86. package/styles/partials/_buttons.scss +446 -453
  87. package/styles/partials/_fonts.scss +83 -83
  88. package/styles/partials/_forms.scss +839 -1107
  89. package/styles/partials/_icons.scss +12 -12
  90. package/styles/partials/_layout.scss +149 -149
  91. package/styles/partials/_modals.scss +254 -254
  92. package/styles/partials/_panels.scss +51 -51
  93. package/styles/partials/_progress-bars.scss +60 -60
  94. package/styles/partials/_tooltips.scss +128 -128
  95. package/styles/partials/_videos.scss +32 -32
  96. package/styles/partials/animations.scss +155 -155
  97. package/styles/partials/app/_blocks.scss +101 -101
  98. package/styles/partials/app/_cards.scss +155 -155
  99. package/styles/partials/app/_general.scss +1193 -1193
  100. package/styles/partials/app/_header.scss +713 -713
  101. package/styles/partials/app/_layout.scss +219 -219
  102. package/styles/partials/app/_my-account.scss +203 -203
  103. package/styles/partials/app/_my-loan-applications.scss +165 -165
  104. package/styles/partials/app/_my-products.scss +1019 -1019
  105. package/styles/partials/app/_signatures.scss +16 -16
  106. package/styles/partials/landing/_footer.scss +234 -234
  107. package/styles/partials/landing/_general.scss +2612 -2527
  108. package/styles/partials/landing/_header.scss +968 -968
  109. package/styles/partials/landing/_hero-wrappers.scss +650 -650
  110. package/styles/vendor/_animate.scss +3 -3
  111. package/styles/vendor/_compass.scss +4 -4
  112. package/styles/vendor/_lemonade.scss +37 -37
  113. package/styles/vendor/_modules_export.scss +11212 -11212
  114. package/styles/vendor/_normalize.scss +341 -341
  115. package/styles/vendor/animation/_animate.scss +31 -31
  116. package/styles/vendor/animation/_core.scss +127 -127
  117. package/styles/vendor/animation/_shared.scss +21 -21
  118. package/styles/vendor/animation/animate/_attention-seekers.scss +151 -151
  119. package/styles/vendor/animation/animate/_bouncing.scss +2 -2
  120. package/styles/vendor/animation/animate/_classes.scss +21 -21
  121. package/styles/vendor/animation/animate/_fading.scss +2 -2
  122. package/styles/vendor/animation/animate/_flippers.scss +87 -87
  123. package/styles/vendor/animation/animate/_lightspeed.scss +23 -23
  124. package/styles/vendor/animation/animate/_rotating.scss +3 -3
  125. package/styles/vendor/animation/animate/_specials.scss +42 -42
  126. package/styles/vendor/animation/animate/bouncing/_bouncing-entrances.scss +68 -68
  127. package/styles/vendor/animation/animate/bouncing/_bouncing-exits.scss +60 -60
  128. package/styles/vendor/animation/animate/fading/_fading-entrances.scss +86 -86
  129. package/styles/vendor/animation/animate/fading/_fading-exits.scss +86 -86
  130. package/styles/vendor/animation/animate/rotating/_rotating-entrances.scss +58 -58
  131. package/styles/vendor/animation/animate/rotating/_rotating-exits.scss +58 -58
  132. package/styles/vendor/compass/_css3.scss +21 -21
  133. package/styles/vendor/compass/_functions.scss +7 -7
  134. package/styles/vendor/compass/_layout.scss +3 -3
  135. package/styles/vendor/compass/_reset-legacy.scss +3 -3
  136. package/styles/vendor/compass/_reset.scss +3 -3
  137. package/styles/vendor/compass/_support.scss +40 -40
  138. package/styles/vendor/compass/_typography.scss +4 -4
  139. package/styles/vendor/compass/_utilities.scss +9 -9
  140. package/styles/vendor/compass/css3/_animation.scss +2 -2
  141. package/styles/vendor/compass/css3/_appearance.scss +16 -16
  142. package/styles/vendor/compass/css3/_background-clip.scss +43 -43
  143. package/styles/vendor/compass/css3/_background-origin.scss +42 -42
  144. package/styles/vendor/compass/css3/_background-size.scss +26 -26
  145. package/styles/vendor/compass/css3/_border-radius.scss +130 -130
  146. package/styles/vendor/compass/css3/_box-shadow.scss +76 -76
  147. package/styles/vendor/compass/css3/_box-sizing.scss +18 -18
  148. package/styles/vendor/compass/css3/_box.scss +110 -110
  149. package/styles/vendor/compass/css3/_columns.scss +157 -157
  150. package/styles/vendor/compass/css3/_filter.scss +24 -24
  151. package/styles/vendor/compass/css3/_flexbox.scss +86 -86
  152. package/styles/vendor/compass/css3/_font-face.scss +48 -48
  153. package/styles/vendor/compass/css3/_hyphenation.scss +77 -77
  154. package/styles/vendor/compass/css3/_images.scss +133 -133
  155. package/styles/vendor/compass/css3/_inline-block.scss +22 -22
  156. package/styles/vendor/compass/css3/_opacity.scss +19 -19
  157. package/styles/vendor/compass/css3/_pie.scss +73 -73
  158. package/styles/vendor/compass/css3/_regions.scss +21 -21
  159. package/styles/vendor/compass/css3/_shared.scss +38 -38
  160. package/styles/vendor/compass/css3/_text-shadow.scss +88 -88
  161. package/styles/vendor/compass/css3/_transform-legacy.scss +87 -87
  162. package/styles/vendor/compass/css3/_transform.scss +598 -598
  163. package/styles/vendor/compass/css3/_transition.scss +222 -222
  164. package/styles/vendor/compass/css3/_user-interface.scss +47 -47
  165. package/styles/vendor/compass/functions/_colors.scss +37 -37
  166. package/styles/vendor/compass/functions/_constants.scss +18 -18
  167. package/styles/vendor/compass/functions/_cross_browser_support.scss +72 -72
  168. package/styles/vendor/compass/functions/_display.scss +36 -36
  169. package/styles/vendor/compass/functions/_font_files.scss +95 -95
  170. package/styles/vendor/compass/functions/_gradient_support.scss +14 -14
  171. package/styles/vendor/compass/functions/_lists.scss +90 -90
  172. package/styles/vendor/compass/layout/_grid-background.scss +178 -178
  173. package/styles/vendor/compass/layout/_sticky-footer.scss +23 -23
  174. package/styles/vendor/compass/layout/_stretching.scss +23 -23
  175. package/styles/vendor/compass/reset/_utilities-legacy.scss +135 -135
  176. package/styles/vendor/compass/reset/_utilities.scss +142 -142
  177. package/styles/vendor/compass/typography/_links.scss +3 -3
  178. package/styles/vendor/compass/typography/_lists.scss +4 -4
  179. package/styles/vendor/compass/typography/_text.scss +4 -4
  180. package/styles/vendor/compass/typography/_vertical_rhythm.scss +229 -229
  181. package/styles/vendor/compass/typography/links/_hover-link.scss +5 -5
  182. package/styles/vendor/compass/typography/links/_link-colors.scss +28 -28
  183. package/styles/vendor/compass/typography/links/_unstyled-link.scss +7 -7
  184. package/styles/vendor/compass/typography/lists/_bullets.scss +34 -34
  185. package/styles/vendor/compass/typography/lists/_horizontal-list.scss +61 -61
  186. package/styles/vendor/compass/typography/lists/_inline-block-list.scss +50 -50
  187. package/styles/vendor/compass/typography/lists/_inline-list.scss +44 -44
  188. package/styles/vendor/compass/typography/text/_ellipsis.scss +25 -25
  189. package/styles/vendor/compass/typography/text/_force-wrap.scss +12 -12
  190. package/styles/vendor/compass/typography/text/_nowrap.scss +2 -2
  191. package/styles/vendor/compass/typography/text/_replacement.scss +68 -68
  192. package/styles/vendor/compass/utilities/_general.scss +6 -6
  193. package/styles/vendor/compass/utilities/_links.scss +5 -5
  194. package/styles/vendor/compass/utilities/_lists.scss +6 -6
  195. package/styles/vendor/compass/utilities/_print.scss +17 -17
  196. package/styles/vendor/compass/utilities/_sprites.scss +2 -2
  197. package/styles/vendor/compass/utilities/_tables.scss +3 -3
  198. package/styles/vendor/compass/utilities/_text.scss +5 -5
  199. package/styles/vendor/compass/utilities/color/_contrast.scss +27 -27
  200. package/styles/vendor/compass/utilities/general/_clearfix.scss +44 -44
  201. package/styles/vendor/compass/utilities/general/_float.scss +29 -29
  202. package/styles/vendor/compass/utilities/general/_hacks.scss +47 -47
  203. package/styles/vendor/compass/utilities/general/_min.scss +16 -16
  204. package/styles/vendor/compass/utilities/general/_reset.scss +2 -2
  205. package/styles/vendor/compass/utilities/general/_tabs.scss +1 -1
  206. package/styles/vendor/compass/utilities/general/_tag-cloud.scss +18 -18
  207. package/styles/vendor/compass/utilities/links/_hover-link.scss +3 -3
  208. package/styles/vendor/compass/utilities/links/_link-colors.scss +3 -3
  209. package/styles/vendor/compass/utilities/links/_unstyled-link.scss +3 -3
  210. package/styles/vendor/compass/utilities/lists/_bullets.scss +3 -3
  211. package/styles/vendor/compass/utilities/lists/_horizontal-list.scss +3 -3
  212. package/styles/vendor/compass/utilities/lists/_inline-block-list.scss +3 -3
  213. package/styles/vendor/compass/utilities/lists/_inline-list.scss +3 -3
  214. package/styles/vendor/compass/utilities/sprites/_base.scss +65 -65
  215. package/styles/vendor/compass/utilities/sprites/_sprite-img.scss +78 -78
  216. package/styles/vendor/compass/utilities/tables/_alternating-rows-and-columns.scss +22 -22
  217. package/styles/vendor/compass/utilities/tables/_borders.scss +33 -33
  218. package/styles/vendor/compass/utilities/tables/_scaffolding.scss +9 -9
  219. package/styles/vendor/compass/utilities/text/_ellipsis.scss +3 -3
  220. package/styles/vendor/compass/utilities/text/_nowrap.scss +3 -3
  221. package/styles/vendor/compass/utilities/text/_replacement.scss +3 -3
  222. package/assets/interface/icons/check-circle.svg +0 -1
  223. package/assets/interface/icons/x-circle-alert.svg +0 -1
  224. package/core/intelli-styles.js +0 -55
@@ -1,31 +1,31 @@
1
- // ---------------------------------------------------------------------------
2
- // Animations from Animate.css
3
- // Author : Dan Eden
4
- // URL : http://daneden.me/animate/
5
- //
6
- // Attention seekers
7
- // - flash bounce shake tada swing wobble pulse
8
- // Fading entrances
9
- // - fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpBig fadeInDownBig fadeInLeftBig fadeInRightBig
10
- // Fading exits
11
- // - fadeOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight fadeOutUpBig fadeOutDownBig fadeOutLeftBig fadeOutRightBig
12
- // Bouncing entrances
13
- // - bounceIn bounceInDown bounceInUp bounceInLeft bounceInRight
14
- // Bouncing exits
15
- // - bounceOut bounceOutDown bounceOutUp bounceOutLeft bounceOutRight
16
- // Rotating entrances
17
- // - rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight
18
- // Rotating exits
19
- // - rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight
20
- // Lightspeed
21
- // - lightSpeedIn lightSpeedOut
22
- // Specials
23
- // - hinge rollIn rollOut
24
- // ---------------------------------------------------------------------------
25
- @import "animate/attention-seekers";
26
- @import "animate/bouncing";
27
- @import "animate/fading";
28
- @import "animate/flippers";
29
- @import "animate/lightspeed";
30
- @import "animate/rotating";
31
- @import "animate/specials";
1
+ // ---------------------------------------------------------------------------
2
+ // Animations from Animate.css
3
+ // Author : Dan Eden
4
+ // URL : http://daneden.me/animate/
5
+ //
6
+ // Attention seekers
7
+ // - flash bounce shake tada swing wobble pulse
8
+ // Fading entrances
9
+ // - fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpBig fadeInDownBig fadeInLeftBig fadeInRightBig
10
+ // Fading exits
11
+ // - fadeOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight fadeOutUpBig fadeOutDownBig fadeOutLeftBig fadeOutRightBig
12
+ // Bouncing entrances
13
+ // - bounceIn bounceInDown bounceInUp bounceInLeft bounceInRight
14
+ // Bouncing exits
15
+ // - bounceOut bounceOutDown bounceOutUp bounceOutLeft bounceOutRight
16
+ // Rotating entrances
17
+ // - rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight
18
+ // Rotating exits
19
+ // - rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight
20
+ // Lightspeed
21
+ // - lightSpeedIn lightSpeedOut
22
+ // Specials
23
+ // - hinge rollIn rollOut
24
+ // ---------------------------------------------------------------------------
25
+ @import "animate/attention-seekers";
26
+ @import "animate/bouncing";
27
+ @import "animate/fading";
28
+ @import "animate/flippers";
29
+ @import "animate/lightspeed";
30
+ @import "animate/rotating";
31
+ @import "animate/specials";
@@ -1,127 +1,127 @@
1
- @import "shared";
2
-
3
- // CSS Animations.
4
-
5
- // Apply an animation property and value with the correct browser support
6
- @mixin animation-support($property, $value) {
7
- @include experimental($property, $value, -moz, -webkit, -o, -ms, not -khtml, official); }
8
-
9
- // Name of any animation as a string.
10
- $default-animation-name : false !default;
11
-
12
- // Duration of the entire animation in seconds.
13
- $default-animation-duration : false !default;
14
-
15
- // Delay for start of animation in seconds.
16
- $default-animation-delay : false !default;
17
-
18
- // The timing function(s) to be used between keyframes. [ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier($number, $number, $number, $number)]
19
- $default-animation-timing-function : false !default;
20
-
21
- // The number of times an animation cycle is played. [infinite | $number]
22
- $default-animation-iteration-count : false !default;
23
-
24
- // Whether or not the animation should play in reverse on alternate cycles. [normal | alternate]
25
- $default-animation-direction : false !default;
26
-
27
- // What values are applied by the animation outside the time it is executing. [none | forwards | backwards | both]
28
- $default-animation-fill-mode : false !default;
29
-
30
- // Whether the animation is running or paused. [running | paused]
31
- $default-animation-play-state : false !default;
32
-
33
- // Create a named animation sequence that can be applied to elements later.
34
- //
35
- // $name - The name of your animation.
36
- // @content - The keyframes of the animation.
37
- @mixin keyframes(
38
- $name,
39
- $moz: $experimental-support-for-mozilla,
40
- $webkit: $experimental-support-for-webkit,
41
- $o: $experimental-support-for-opera,
42
- $ms: $experimental-support-for-microsoft,
43
- $khtml: $experimental-support-for-khtml,
44
- $official: true
45
- ) {
46
- @if $moz {
47
- @include with-only-support-for($moz: true) {
48
- @-moz-keyframes #{$name} { @content; }
49
- }
50
- }
51
- @if $webkit {
52
- @include with-only-support-for($webkit: true) {
53
- @-webkit-keyframes #{$name} { @content; }
54
- }
55
- }
56
- @if $o {
57
- @include with-only-support-for($o: true) {
58
- @-o-keyframes #{$name} { @content; }
59
- }
60
- }
61
- @if $ms {
62
- @include with-only-support-for($ms: true) {
63
- @-ms-keyframes #{$name} { @content; }
64
- }
65
- }
66
- @if $khtml {
67
- @include with-only-support-for($khtml: true) {
68
- @-khtml-keyframes #{$name} { @content; }
69
- }
70
- }
71
- @if $official {
72
- @include with-only-support-for {
73
- @keyframes #{$name} { @content; }
74
- }
75
- }
76
- }
77
-
78
- // Apply 1-10 animation names.
79
- @mixin animation-name($name-1: $default-animation-name, $name-2: false, $name-3: false, $name-4: false, $name-5: false, $name-6: false, $name-7: false, $name-8: false, $name-9: false, $name-10: false) {
80
- $name: compact($name-1, $name-2, $name-3, $name-4, $name-5, $name-6, $name-7, $name-8, $name-9, $name-10);
81
- @include animation-support(animation-name, $name); }
82
-
83
- // Apply 1-10 animation durations.
84
- @mixin animation-duration($duration-1: $default-animation-duration, $duration-2: false, $duration-3: false, $duration-4: false, $duration-5: false, $duration-6: false, $duration-7: false, $duration-8: false, $duration-9: false, $duration-10: false) {
85
- $duration: compact($duration-1, $duration-2, $duration-3, $duration-4, $duration-5, $duration-6, $duration-7, $duration-8, $duration-9, $duration-10);
86
- @include animation-support(animation-duration, $duration); }
87
-
88
- // Apply 1-10 animation delays.
89
- @mixin animation-delay($delay-1: $default-animation-delay, $delay-2: false, $delay-3: false, $delay-4: false, $delay-5: false, $delay-6: false, $delay-7: false, $delay-8: false, $delay-9: false, $delay-10: false) {
90
- $delay: compact($delay-1, $delay-2, $delay-3, $delay-4, $delay-5, $delay-6, $delay-7, $delay-8, $delay-9, $delay-10);
91
- @include animation-support(animation-delay, $delay); }
92
-
93
- // Apply 1-10 animation timing functions.
94
- @mixin animation-timing-function($function-1: $default-animation-timing-function, $function-2: false, $function-3: false, $function-4: false, $function-5: false, $function-6: false, $function-7: false, $function-8: false, $function-9: false, $function-10: false) {
95
- $function: compact($function-1, $function-2, $function-3, $function-4, $function-5, $function-6, $function-7, $function-8, $function-9, $function-10);
96
- @include animation-support(animation-timing-function, $function); }
97
-
98
- // Apply 1-10 animation iteration counts.
99
- @mixin animation-iteration-count($count-1: $default-animation-iteration-count, $count-2: false, $count-3: false, $count-4: false, $count-5: false, $count-6: false, $count-7: false, $count-8: false, $count-9: false, $count-10: false) {
100
- $count: compact($count-1, $count-2, $count-3, $count-4, $count-5, $count-6, $count-7, $count-8, $count-9, $count-10);
101
- @include animation-support(animation-iteration-count, $count); }
102
-
103
- // Apply 1-10 animation directions.
104
- @mixin animation-direction($direction-1: $default-animation-direction, $direction-2: false, $direction-3: false, $direction-4: false, $direction-5: false, $direction-6: false, $direction-7: false, $direction-8: false, $direction-9: false, $direction-10: false) {
105
- $direction: compact($direction-1, $direction-2, $direction-3, $direction-4, $direction-5, $direction-6, $direction-7, $direction-8, $direction-9, $direction-10);
106
- @include animation-support(animation-direction, $direction); }
107
-
108
- // Apply 1-10 animation fill modes.
109
- @mixin animation-fill-mode($mode-1: $default-animation-fill-mode, $mode-2: false, $mode-3: false, $mode-4: false, $mode-5: false, $mode-6: false, $mode-7: false, $mode-8: false, $mode-9: false, $mode-10: false) {
110
- $mode: compact($mode-1, $mode-2, $mode-3, $mode-4, $mode-5, $mode-6, $mode-7, $mode-8, $mode-9, $mode-10);
111
- @include animation-support(animation-fill-mode, $mode); }
112
-
113
- // Apply 1-10 animation play states.
114
- @mixin animation-play-state($state-1: $default-animation-play-state, $state-2: false, $state-3: false, $state-4: false, $state-5: false, $state-6: false, $state-7: false, $state-8: false, $state-9: false, $state-10: false) {
115
- $state: compact($state-1, $state-2, $state-3, $state-4, $state-5, $state-6, $state-7, $state-8, $state-9, $state-10);
116
- @include animation-support(animation-play-state, $state); }
117
-
118
- // Shortcut to apply a named animation to an element, with all the settings.
119
- //
120
- // $animation-1 : Name and settings for the first animation. [<values> | default]
121
- // ...
122
- // $animation-10 : Name and settings for the tenth animation. <values>
123
- @mixin animation($animation-1: default, $animation-2: false, $animation-3: false, $animation-4: false, $animation-5: false, $animation-6: false, $animation-7: false, $animation-8: false, $animation-9: false, $animation-10: false) {
124
- @if $animation-1 == default {
125
- $animation-1: -compass-space-list(compact($default-animation-name, $default-animation-duration, $default-animation-timing-function, $default-animation-delay, $default-animation-iteration-count, $default-animation-direction, $default-animation-fill-mode, $default-animation-play-state)); }
126
- $animation: compact($animation-1, $animation-2, $animation-3, $animation-4, $animation-5, $animation-6, $animation-7, $animation-8, $animation-9, $animation-10);
127
- @include animation-support(animation, $animation); }
1
+ @import "shared";
2
+
3
+ // CSS Animations.
4
+
5
+ // Apply an animation property and value with the correct browser support
6
+ @mixin animation-support($property, $value) {
7
+ @include experimental($property, $value, -moz, -webkit, -o, -ms, not -khtml, official); }
8
+
9
+ // Name of any animation as a string.
10
+ $default-animation-name : false !default;
11
+
12
+ // Duration of the entire animation in seconds.
13
+ $default-animation-duration : false !default;
14
+
15
+ // Delay for start of animation in seconds.
16
+ $default-animation-delay : false !default;
17
+
18
+ // The timing function(s) to be used between keyframes. [ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier($number, $number, $number, $number)]
19
+ $default-animation-timing-function : false !default;
20
+
21
+ // The number of times an animation cycle is played. [infinite | $number]
22
+ $default-animation-iteration-count : false !default;
23
+
24
+ // Whether or not the animation should play in reverse on alternate cycles. [normal | alternate]
25
+ $default-animation-direction : false !default;
26
+
27
+ // What values are applied by the animation outside the time it is executing. [none | forwards | backwards | both]
28
+ $default-animation-fill-mode : false !default;
29
+
30
+ // Whether the animation is running or paused. [running | paused]
31
+ $default-animation-play-state : false !default;
32
+
33
+ // Create a named animation sequence that can be applied to elements later.
34
+ //
35
+ // $name - The name of your animation.
36
+ // @content - The keyframes of the animation.
37
+ @mixin keyframes(
38
+ $name,
39
+ $moz: $experimental-support-for-mozilla,
40
+ $webkit: $experimental-support-for-webkit,
41
+ $o: $experimental-support-for-opera,
42
+ $ms: $experimental-support-for-microsoft,
43
+ $khtml: $experimental-support-for-khtml,
44
+ $official: true
45
+ ) {
46
+ @if $moz {
47
+ @include with-only-support-for($moz: true) {
48
+ @-moz-keyframes #{$name} { @content; }
49
+ }
50
+ }
51
+ @if $webkit {
52
+ @include with-only-support-for($webkit: true) {
53
+ @-webkit-keyframes #{$name} { @content; }
54
+ }
55
+ }
56
+ @if $o {
57
+ @include with-only-support-for($o: true) {
58
+ @-o-keyframes #{$name} { @content; }
59
+ }
60
+ }
61
+ @if $ms {
62
+ @include with-only-support-for($ms: true) {
63
+ @-ms-keyframes #{$name} { @content; }
64
+ }
65
+ }
66
+ @if $khtml {
67
+ @include with-only-support-for($khtml: true) {
68
+ @-khtml-keyframes #{$name} { @content; }
69
+ }
70
+ }
71
+ @if $official {
72
+ @include with-only-support-for {
73
+ @keyframes #{$name} { @content; }
74
+ }
75
+ }
76
+ }
77
+
78
+ // Apply 1-10 animation names.
79
+ @mixin animation-name($name-1: $default-animation-name, $name-2: false, $name-3: false, $name-4: false, $name-5: false, $name-6: false, $name-7: false, $name-8: false, $name-9: false, $name-10: false) {
80
+ $name: compact($name-1, $name-2, $name-3, $name-4, $name-5, $name-6, $name-7, $name-8, $name-9, $name-10);
81
+ @include animation-support(animation-name, $name); }
82
+
83
+ // Apply 1-10 animation durations.
84
+ @mixin animation-duration($duration-1: $default-animation-duration, $duration-2: false, $duration-3: false, $duration-4: false, $duration-5: false, $duration-6: false, $duration-7: false, $duration-8: false, $duration-9: false, $duration-10: false) {
85
+ $duration: compact($duration-1, $duration-2, $duration-3, $duration-4, $duration-5, $duration-6, $duration-7, $duration-8, $duration-9, $duration-10);
86
+ @include animation-support(animation-duration, $duration); }
87
+
88
+ // Apply 1-10 animation delays.
89
+ @mixin animation-delay($delay-1: $default-animation-delay, $delay-2: false, $delay-3: false, $delay-4: false, $delay-5: false, $delay-6: false, $delay-7: false, $delay-8: false, $delay-9: false, $delay-10: false) {
90
+ $delay: compact($delay-1, $delay-2, $delay-3, $delay-4, $delay-5, $delay-6, $delay-7, $delay-8, $delay-9, $delay-10);
91
+ @include animation-support(animation-delay, $delay); }
92
+
93
+ // Apply 1-10 animation timing functions.
94
+ @mixin animation-timing-function($function-1: $default-animation-timing-function, $function-2: false, $function-3: false, $function-4: false, $function-5: false, $function-6: false, $function-7: false, $function-8: false, $function-9: false, $function-10: false) {
95
+ $function: compact($function-1, $function-2, $function-3, $function-4, $function-5, $function-6, $function-7, $function-8, $function-9, $function-10);
96
+ @include animation-support(animation-timing-function, $function); }
97
+
98
+ // Apply 1-10 animation iteration counts.
99
+ @mixin animation-iteration-count($count-1: $default-animation-iteration-count, $count-2: false, $count-3: false, $count-4: false, $count-5: false, $count-6: false, $count-7: false, $count-8: false, $count-9: false, $count-10: false) {
100
+ $count: compact($count-1, $count-2, $count-3, $count-4, $count-5, $count-6, $count-7, $count-8, $count-9, $count-10);
101
+ @include animation-support(animation-iteration-count, $count); }
102
+
103
+ // Apply 1-10 animation directions.
104
+ @mixin animation-direction($direction-1: $default-animation-direction, $direction-2: false, $direction-3: false, $direction-4: false, $direction-5: false, $direction-6: false, $direction-7: false, $direction-8: false, $direction-9: false, $direction-10: false) {
105
+ $direction: compact($direction-1, $direction-2, $direction-3, $direction-4, $direction-5, $direction-6, $direction-7, $direction-8, $direction-9, $direction-10);
106
+ @include animation-support(animation-direction, $direction); }
107
+
108
+ // Apply 1-10 animation fill modes.
109
+ @mixin animation-fill-mode($mode-1: $default-animation-fill-mode, $mode-2: false, $mode-3: false, $mode-4: false, $mode-5: false, $mode-6: false, $mode-7: false, $mode-8: false, $mode-9: false, $mode-10: false) {
110
+ $mode: compact($mode-1, $mode-2, $mode-3, $mode-4, $mode-5, $mode-6, $mode-7, $mode-8, $mode-9, $mode-10);
111
+ @include animation-support(animation-fill-mode, $mode); }
112
+
113
+ // Apply 1-10 animation play states.
114
+ @mixin animation-play-state($state-1: $default-animation-play-state, $state-2: false, $state-3: false, $state-4: false, $state-5: false, $state-6: false, $state-7: false, $state-8: false, $state-9: false, $state-10: false) {
115
+ $state: compact($state-1, $state-2, $state-3, $state-4, $state-5, $state-6, $state-7, $state-8, $state-9, $state-10);
116
+ @include animation-support(animation-play-state, $state); }
117
+
118
+ // Shortcut to apply a named animation to an element, with all the settings.
119
+ //
120
+ // $animation-1 : Name and settings for the first animation. [<values> | default]
121
+ // ...
122
+ // $animation-10 : Name and settings for the tenth animation. <values>
123
+ @mixin animation($animation-1: default, $animation-2: false, $animation-3: false, $animation-4: false, $animation-5: false, $animation-6: false, $animation-7: false, $animation-8: false, $animation-9: false, $animation-10: false) {
124
+ @if $animation-1 == default {
125
+ $animation-1: -compass-space-list(compact($default-animation-name, $default-animation-duration, $default-animation-timing-function, $default-animation-delay, $default-animation-iteration-count, $default-animation-direction, $default-animation-fill-mode, $default-animation-play-state)); }
126
+ $animation: compact($animation-1, $animation-2, $animation-3, $animation-4, $animation-5, $animation-6, $animation-7, $animation-8, $animation-9, $animation-10);
127
+ @include animation-support(animation, $animation); }
@@ -1,22 +1,22 @@
1
- @mixin set-experimental-support($moz: false, $webkit: false, $ms: false, $o: false, $khtml: false) {
2
- $experimental-support-for-mozilla: $moz;
3
- $experimental-support-for-webkit: $webkit;
4
- $experimental-support-for-microsoft: $ms;
5
- $experimental-support-for-opera: $o;
6
- $experimental-support-for-khtml: $khtml;
7
- }
8
-
9
- @mixin with-only-support-for($moz: false, $webkit: false, $ms: false, $o: false, $khtml: false) {
10
- // Capture the current state
11
- $original-moz: $experimental-support-for-mozilla;
12
- $original-webkit: $experimental-support-for-webkit;
13
- $original-o: $experimental-support-for-opera;
14
- $original-ms: $experimental-support-for-microsoft;
15
- $original-khtml: $experimental-support-for-khtml;
16
-
17
- @include set-experimental-support($moz, $webkit, $ms, $o, $khtml);
18
-
19
- @content;
20
-
21
- @include set-experimental-support($original-moz, $original-webkit, $original-ms, $original-o, $original-khtml);
1
+ @mixin set-experimental-support($moz: false, $webkit: false, $ms: false, $o: false, $khtml: false) {
2
+ $experimental-support-for-mozilla: $moz;
3
+ $experimental-support-for-webkit: $webkit;
4
+ $experimental-support-for-microsoft: $ms;
5
+ $experimental-support-for-opera: $o;
6
+ $experimental-support-for-khtml: $khtml;
7
+ }
8
+
9
+ @mixin with-only-support-for($moz: false, $webkit: false, $ms: false, $o: false, $khtml: false) {
10
+ // Capture the current state
11
+ $original-moz: $experimental-support-for-mozilla;
12
+ $original-webkit: $experimental-support-for-webkit;
13
+ $original-o: $experimental-support-for-opera;
14
+ $original-ms: $experimental-support-for-microsoft;
15
+ $original-khtml: $experimental-support-for-khtml;
16
+
17
+ @include set-experimental-support($moz, $webkit, $ms, $o, $khtml);
18
+
19
+ @content;
20
+
21
+ @include set-experimental-support($original-moz, $original-webkit, $original-ms, $original-o, $original-khtml);
22
22
  }