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,222 +1,222 @@
1
- @import "shared";
2
- @import "../functions";
3
-
4
- // CSS Transitions
5
- // Currently only works in Webkit.
6
- //
7
- // * expected in CSS3, FireFox 3.6/7 and Opera Presto 2.3
8
- // * We'll be prepared.
9
- //
10
- // Including this submodule sets following defaults for the mixins:
11
- //
12
- // $default-transition-property : all
13
- // $default-transition-duration : 1s
14
- // $default-transition-function : false
15
- // $default-transition-delay : false
16
- //
17
- // Override them if you like. Timing-function and delay are set to false for browser defaults (ease, 0s).
18
-
19
- $default-transition-property: all !default;
20
-
21
- $default-transition-duration: 1s !default;
22
-
23
- $default-transition-function: false !default;
24
-
25
- $default-transition-delay: false !default;
26
-
27
- $transitionable-prefixed-values: transform, transform-origin !default;
28
-
29
- // One or more properties to transition
30
- //
31
- // * for multiple, use a comma-delimited list
32
- // * also accepts "all" or "none"
33
-
34
- @mixin transition-property($property-1: $default-transition-property,
35
- $property-2 : false,
36
- $property-3 : false,
37
- $property-4 : false,
38
- $property-5 : false,
39
- $property-6 : false,
40
- $property-7 : false,
41
- $property-8 : false,
42
- $property-9 : false,
43
- $property-10: false
44
- ) {
45
- @if type-of($property-1) == string { $property-1: unquote($property-1); }
46
- $properties: compact($property-1, $property-2, $property-3, $property-4, $property-5, $property-6, $property-7, $property-8, $property-9, $property-10);
47
- @if $experimental-support-for-webkit { -webkit-transition-property : prefixed-for-transition(-webkit, $properties); }
48
- @if $experimental-support-for-mozilla { -moz-transition-property : prefixed-for-transition(-moz, $properties); }
49
- @if $experimental-support-for-opera { -o-transition-property : prefixed-for-transition(-o, $properties); }
50
- transition-property : $properties;
51
- }
52
-
53
- // One or more durations in seconds
54
- //
55
- // * for multiple, use a comma-delimited list
56
- // * these durations will affect the properties in the same list position
57
-
58
- @mixin transition-duration($duration-1: $default-transition-duration,
59
- $duration-2 : false,
60
- $duration-3 : false,
61
- $duration-4 : false,
62
- $duration-5 : false,
63
- $duration-6 : false,
64
- $duration-7 : false,
65
- $duration-8 : false,
66
- $duration-9 : false,
67
- $duration-10: false
68
- ) {
69
- @if type-of($duration-1) == string { $duration-1: unquote($duration-1); }
70
- $durations: compact($duration-1, $duration-2, $duration-3, $duration-4, $duration-5, $duration-6, $duration-7, $duration-8, $duration-9, $duration-10);
71
- @include experimental(transition-duration, $durations,
72
- -moz, -webkit, -o, not(-ms), not(-khtml), official
73
- );
74
- }
75
-
76
- // One or more timing functions
77
- //
78
- // * [ ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier(x1, y1, x2, y2)]
79
- // * For multiple, use a comma-delimited list
80
- // * These functions will effect the properties in the same list position
81
-
82
- @mixin transition-timing-function($function-1: $default-transition-function,
83
- $function-2 : false,
84
- $function-3 : false,
85
- $function-4 : false,
86
- $function-5 : false,
87
- $function-6 : false,
88
- $function-7 : false,
89
- $function-8 : false,
90
- $function-9 : false,
91
- $function-10: false
92
- ) {
93
- $function-1: unquote($function-1);
94
- $functions: compact($function-1, $function-2, $function-3, $function-4, $function-5, $function-6, $function-7, $function-8, $function-9, $function-10);
95
- @include experimental(transition-timing-function, $functions,
96
- -moz, -webkit, -o, not(-ms), not(-khtml), official
97
- );
98
- }
99
-
100
- // One or more transition-delays in seconds
101
- //
102
- // * for multiple, use a comma-delimited list
103
- // * these delays will effect the properties in the same list position
104
-
105
- @mixin transition-delay($delay-1: $default-transition-delay,
106
- $delay-2 : false,
107
- $delay-3 : false,
108
- $delay-4 : false,
109
- $delay-5 : false,
110
- $delay-6 : false,
111
- $delay-7 : false,
112
- $delay-8 : false,
113
- $delay-9 : false,
114
- $delay-10: false
115
- ) {
116
- @if type-of($delay-1) == string { $delay-1: unquote($delay-1); }
117
- $delays: compact($delay-1, $delay-2, $delay-3, $delay-4, $delay-5, $delay-6, $delay-7, $delay-8, $delay-9, $delay-10);
118
- @include experimental(transition-delay, $delays,
119
- -moz, -webkit, -o, not(-ms), not(-khtml), official
120
- );
121
- }
122
-
123
- // Transition all-in-one shorthand
124
-
125
- @mixin single-transition(
126
- $property: $default-transition-property,
127
- $duration: $default-transition-duration,
128
- $function: $default-transition-function,
129
- $delay: $default-transition-delay
130
- ) {
131
- @include transition(compact($property $duration $function $delay));
132
- }
133
-
134
- @mixin transition(
135
- $transition-1 : default,
136
- $transition-2 : false,
137
- $transition-3 : false,
138
- $transition-4 : false,
139
- $transition-5 : false,
140
- $transition-6 : false,
141
- $transition-7 : false,
142
- $transition-8 : false,
143
- $transition-9 : false,
144
- $transition-10: false
145
- ) {
146
- @if $transition-1 == default {
147
- $transition-1 : compact($default-transition-property $default-transition-duration $default-transition-function $default-transition-delay);
148
- }
149
- $transitions: false;
150
- @if type-of($transition-1) == list and type-of(nth($transition-1,1)) == list {
151
- $transitions: join($transition-1, compact($transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10), comma);
152
- } @else {
153
- $transitions : compact($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10);
154
- }
155
- $delays: comma-list();
156
- $has-delays: false;
157
- $webkit-value: comma-list();
158
- $moz-value: comma-list();
159
- $o-value: comma-list();
160
-
161
- // This block can be made considerably simpler at the point in time that
162
- // we no longer need to deal with the differences in how delays are treated.
163
- @each $transition in $transitions {
164
- // Extract the values from the list
165
- // (this would be cleaner if nth took a 3rd argument to provide a default value).
166
- $property: nth($transition, 1);
167
- $duration: false;
168
- $timing-function: false;
169
- $delay: false;
170
- @if length($transition) > 1 { $duration: nth($transition, 2); }
171
- @if length($transition) > 2 { $timing-function: nth($transition, 3); }
172
- @if length($transition) > 3 { $delay: nth($transition, 4); $has-delays: true; }
173
-
174
- // If a delay is provided without a timing function
175
- @if is-time($timing-function) and not($delay) { $delay: $timing-function; $timing-function: false; $has-delays: true; }
176
-
177
- // Keep a list of delays in case one is specified
178
- $delays: append($delays, if($delay, $delay, 0s));
179
-
180
- $webkit-value: append($webkit-value, compact((prefixed-for-transition(-webkit, $property) $duration $timing-function)...));
181
- $moz-value: append( $moz-value, compact((prefixed-for-transition( -moz, $property) $duration $timing-function $delay)...));
182
- $o-value: append( $o-value, compact((prefixed-for-transition( -o, $property) $duration $timing-function $delay)...));
183
- }
184
-
185
- @if $experimental-support-for-webkit { -webkit-transition : $webkit-value;
186
- // old webkit doesn't support the delay parameter in the shorthand so we progressively enhance it.
187
- @if $has-delays { -webkit-transition-delay : $delays; } }
188
- @if $experimental-support-for-mozilla { -moz-transition : $moz-value; }
189
- @if $experimental-support-for-opera { -o-transition : $o-value; }
190
- transition : $transitions;
191
- }
192
-
193
- // coerce a list to be comma delimited or make a new, empty comma delimited list.
194
- @function comma-list($list: ()) {
195
- @return join((), $list, comma);
196
- }
197
-
198
- // Returns `$property` with the given prefix if it is found in `$transitionable-prefixed-values`.
199
- @function prefixed-for-transition($prefix, $property) {
200
- @if type-of($property) == list {
201
- $new-list: comma-list();
202
- @each $v in $property {
203
- $new-list: append($new-list, prefixed-for-transition($prefix, $v));
204
- }
205
- @return $new-list;
206
- } @else {
207
- @if index($transitionable-prefixed-values, $property) {
208
- @return #{$prefix}-#{$property};
209
- } @else {
210
- @return $property;
211
- }
212
- }
213
- }
214
-
215
- // Checks if the value given is a unit of time.
216
- @function is-time($value) {
217
- @if type-of($value) == number {
218
- @return not(not(index(s ms, unit($value))));
219
- } @else {
220
- @return false;
221
- }
222
- }
1
+ @import "shared";
2
+ @import "../functions";
3
+
4
+ // CSS Transitions
5
+ // Currently only works in Webkit.
6
+ //
7
+ // * expected in CSS3, FireFox 3.6/7 and Opera Presto 2.3
8
+ // * We'll be prepared.
9
+ //
10
+ // Including this submodule sets following defaults for the mixins:
11
+ //
12
+ // $default-transition-property : all
13
+ // $default-transition-duration : 1s
14
+ // $default-transition-function : false
15
+ // $default-transition-delay : false
16
+ //
17
+ // Override them if you like. Timing-function and delay are set to false for browser defaults (ease, 0s).
18
+
19
+ $default-transition-property: all !default;
20
+
21
+ $default-transition-duration: 1s !default;
22
+
23
+ $default-transition-function: false !default;
24
+
25
+ $default-transition-delay: false !default;
26
+
27
+ $transitionable-prefixed-values: transform, transform-origin !default;
28
+
29
+ // One or more properties to transition
30
+ //
31
+ // * for multiple, use a comma-delimited list
32
+ // * also accepts "all" or "none"
33
+
34
+ @mixin transition-property($property-1: $default-transition-property,
35
+ $property-2 : false,
36
+ $property-3 : false,
37
+ $property-4 : false,
38
+ $property-5 : false,
39
+ $property-6 : false,
40
+ $property-7 : false,
41
+ $property-8 : false,
42
+ $property-9 : false,
43
+ $property-10: false
44
+ ) {
45
+ @if type-of($property-1) == string { $property-1: unquote($property-1); }
46
+ $properties: compact($property-1, $property-2, $property-3, $property-4, $property-5, $property-6, $property-7, $property-8, $property-9, $property-10);
47
+ @if $experimental-support-for-webkit { -webkit-transition-property : prefixed-for-transition(-webkit, $properties); }
48
+ @if $experimental-support-for-mozilla { -moz-transition-property : prefixed-for-transition(-moz, $properties); }
49
+ @if $experimental-support-for-opera { -o-transition-property : prefixed-for-transition(-o, $properties); }
50
+ transition-property : $properties;
51
+ }
52
+
53
+ // One or more durations in seconds
54
+ //
55
+ // * for multiple, use a comma-delimited list
56
+ // * these durations will affect the properties in the same list position
57
+
58
+ @mixin transition-duration($duration-1: $default-transition-duration,
59
+ $duration-2 : false,
60
+ $duration-3 : false,
61
+ $duration-4 : false,
62
+ $duration-5 : false,
63
+ $duration-6 : false,
64
+ $duration-7 : false,
65
+ $duration-8 : false,
66
+ $duration-9 : false,
67
+ $duration-10: false
68
+ ) {
69
+ @if type-of($duration-1) == string { $duration-1: unquote($duration-1); }
70
+ $durations: compact($duration-1, $duration-2, $duration-3, $duration-4, $duration-5, $duration-6, $duration-7, $duration-8, $duration-9, $duration-10);
71
+ @include experimental(transition-duration, $durations,
72
+ -moz, -webkit, -o, not(-ms), not(-khtml), official
73
+ );
74
+ }
75
+
76
+ // One or more timing functions
77
+ //
78
+ // * [ ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier(x1, y1, x2, y2)]
79
+ // * For multiple, use a comma-delimited list
80
+ // * These functions will effect the properties in the same list position
81
+
82
+ @mixin transition-timing-function($function-1: $default-transition-function,
83
+ $function-2 : false,
84
+ $function-3 : false,
85
+ $function-4 : false,
86
+ $function-5 : false,
87
+ $function-6 : false,
88
+ $function-7 : false,
89
+ $function-8 : false,
90
+ $function-9 : false,
91
+ $function-10: false
92
+ ) {
93
+ $function-1: unquote($function-1);
94
+ $functions: compact($function-1, $function-2, $function-3, $function-4, $function-5, $function-6, $function-7, $function-8, $function-9, $function-10);
95
+ @include experimental(transition-timing-function, $functions,
96
+ -moz, -webkit, -o, not(-ms), not(-khtml), official
97
+ );
98
+ }
99
+
100
+ // One or more transition-delays in seconds
101
+ //
102
+ // * for multiple, use a comma-delimited list
103
+ // * these delays will effect the properties in the same list position
104
+
105
+ @mixin transition-delay($delay-1: $default-transition-delay,
106
+ $delay-2 : false,
107
+ $delay-3 : false,
108
+ $delay-4 : false,
109
+ $delay-5 : false,
110
+ $delay-6 : false,
111
+ $delay-7 : false,
112
+ $delay-8 : false,
113
+ $delay-9 : false,
114
+ $delay-10: false
115
+ ) {
116
+ @if type-of($delay-1) == string { $delay-1: unquote($delay-1); }
117
+ $delays: compact($delay-1, $delay-2, $delay-3, $delay-4, $delay-5, $delay-6, $delay-7, $delay-8, $delay-9, $delay-10);
118
+ @include experimental(transition-delay, $delays,
119
+ -moz, -webkit, -o, not(-ms), not(-khtml), official
120
+ );
121
+ }
122
+
123
+ // Transition all-in-one shorthand
124
+
125
+ @mixin single-transition(
126
+ $property: $default-transition-property,
127
+ $duration: $default-transition-duration,
128
+ $function: $default-transition-function,
129
+ $delay: $default-transition-delay
130
+ ) {
131
+ @include transition(compact($property $duration $function $delay));
132
+ }
133
+
134
+ @mixin transition(
135
+ $transition-1 : default,
136
+ $transition-2 : false,
137
+ $transition-3 : false,
138
+ $transition-4 : false,
139
+ $transition-5 : false,
140
+ $transition-6 : false,
141
+ $transition-7 : false,
142
+ $transition-8 : false,
143
+ $transition-9 : false,
144
+ $transition-10: false
145
+ ) {
146
+ @if $transition-1 == default {
147
+ $transition-1 : compact($default-transition-property $default-transition-duration $default-transition-function $default-transition-delay);
148
+ }
149
+ $transitions: false;
150
+ @if type-of($transition-1) == list and type-of(nth($transition-1,1)) == list {
151
+ $transitions: join($transition-1, compact($transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10), comma);
152
+ } @else {
153
+ $transitions : compact($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10);
154
+ }
155
+ $delays: comma-list();
156
+ $has-delays: false;
157
+ $webkit-value: comma-list();
158
+ $moz-value: comma-list();
159
+ $o-value: comma-list();
160
+
161
+ // This block can be made considerably simpler at the point in time that
162
+ // we no longer need to deal with the differences in how delays are treated.
163
+ @each $transition in $transitions {
164
+ // Extract the values from the list
165
+ // (this would be cleaner if nth took a 3rd argument to provide a default value).
166
+ $property: nth($transition, 1);
167
+ $duration: false;
168
+ $timing-function: false;
169
+ $delay: false;
170
+ @if length($transition) > 1 { $duration: nth($transition, 2); }
171
+ @if length($transition) > 2 { $timing-function: nth($transition, 3); }
172
+ @if length($transition) > 3 { $delay: nth($transition, 4); $has-delays: true; }
173
+
174
+ // If a delay is provided without a timing function
175
+ @if is-time($timing-function) and not($delay) { $delay: $timing-function; $timing-function: false; $has-delays: true; }
176
+
177
+ // Keep a list of delays in case one is specified
178
+ $delays: append($delays, if($delay, $delay, 0s));
179
+
180
+ $webkit-value: append($webkit-value, compact((prefixed-for-transition(-webkit, $property) $duration $timing-function)...));
181
+ $moz-value: append( $moz-value, compact((prefixed-for-transition( -moz, $property) $duration $timing-function $delay)...));
182
+ $o-value: append( $o-value, compact((prefixed-for-transition( -o, $property) $duration $timing-function $delay)...));
183
+ }
184
+
185
+ @if $experimental-support-for-webkit { -webkit-transition : $webkit-value;
186
+ // old webkit doesn't support the delay parameter in the shorthand so we progressively enhance it.
187
+ @if $has-delays { -webkit-transition-delay : $delays; } }
188
+ @if $experimental-support-for-mozilla { -moz-transition : $moz-value; }
189
+ @if $experimental-support-for-opera { -o-transition : $o-value; }
190
+ transition : $transitions;
191
+ }
192
+
193
+ // coerce a list to be comma delimited or make a new, empty comma delimited list.
194
+ @function comma-list($list: ()) {
195
+ @return join((), $list, comma);
196
+ }
197
+
198
+ // Returns `$property` with the given prefix if it is found in `$transitionable-prefixed-values`.
199
+ @function prefixed-for-transition($prefix, $property) {
200
+ @if type-of($property) == list {
201
+ $new-list: comma-list();
202
+ @each $v in $property {
203
+ $new-list: append($new-list, prefixed-for-transition($prefix, $v));
204
+ }
205
+ @return $new-list;
206
+ } @else {
207
+ @if index($transitionable-prefixed-values, $property) {
208
+ @return #{$prefix}-#{$property};
209
+ } @else {
210
+ @return $property;
211
+ }
212
+ }
213
+ }
214
+
215
+ // Checks if the value given is a unit of time.
216
+ @function is-time($value) {
217
+ @if type-of($value) == number {
218
+ @return not(not(index(s ms, unit($value))));
219
+ } @else {
220
+ @return false;
221
+ }
222
+ }
@@ -1,47 +1,47 @@
1
- // User Interface ------------------------------------------------------------
2
- // This file can be expanded to handle all the user interface properties as
3
- // they become available in browsers:
4
- // http://www.w3.org/TR/2000/WD-css3-userint-20000216
5
- @import "shared";
6
-
7
-
8
- // This property controls the selection model and granularity of an element.
9
- //
10
- // @param $select
11
- // [ none | text | toggle | element | elements | all | inherit ]
12
- @mixin user-select($select) {
13
- $select: unquote($select);
14
- @include experimental(user-select, $select,
15
- -moz, -webkit, not(-o), -ms, -khtml, official
16
- );
17
- }
18
-
19
- // Style the html5 input placeholder in browsers that support it.
20
- //
21
- // The styles for the input placeholder are passed as mixin content
22
- // and the selector comes from the mixin's context.
23
- //
24
- // For example:
25
- //
26
- // #{elements-of-type(text-input)} {
27
- // @include input-placeholder {
28
- // color: #bfbfbf;
29
- // font-style: italic;
30
- // }
31
- // }
32
- //
33
- // if you want to apply the placeholder styles to all elements supporting
34
- // the `input-placeholder` pseudo class (beware of performance impacts):
35
- //
36
- // * {
37
- // @include input-placeholder {
38
- // color: #bfbfbf;
39
- // font-style: italic;
40
- // }
41
- // }
42
- @mixin input-placeholder {
43
- &:-ms-input-placeholder { @content; }
44
- &:-moz-placeholder { @content; }
45
- &::-moz-placeholder { @content; }
46
- &::-webkit-input-placeholder { @content; }
47
- }
1
+ // User Interface ------------------------------------------------------------
2
+ // This file can be expanded to handle all the user interface properties as
3
+ // they become available in browsers:
4
+ // http://www.w3.org/TR/2000/WD-css3-userint-20000216
5
+ @import "shared";
6
+
7
+
8
+ // This property controls the selection model and granularity of an element.
9
+ //
10
+ // @param $select
11
+ // [ none | text | toggle | element | elements | all | inherit ]
12
+ @mixin user-select($select) {
13
+ $select: unquote($select);
14
+ @include experimental(user-select, $select,
15
+ -moz, -webkit, not(-o), -ms, -khtml, official
16
+ );
17
+ }
18
+
19
+ // Style the html5 input placeholder in browsers that support it.
20
+ //
21
+ // The styles for the input placeholder are passed as mixin content
22
+ // and the selector comes from the mixin's context.
23
+ //
24
+ // For example:
25
+ //
26
+ // #{elements-of-type(text-input)} {
27
+ // @include input-placeholder {
28
+ // color: #bfbfbf;
29
+ // font-style: italic;
30
+ // }
31
+ // }
32
+ //
33
+ // if you want to apply the placeholder styles to all elements supporting
34
+ // the `input-placeholder` pseudo class (beware of performance impacts):
35
+ //
36
+ // * {
37
+ // @include input-placeholder {
38
+ // color: #bfbfbf;
39
+ // font-style: italic;
40
+ // }
41
+ // }
42
+ @mixin input-placeholder {
43
+ &:-ms-input-placeholder { @content; }
44
+ &:-moz-placeholder { @content; }
45
+ &::-moz-placeholder { @content; }
46
+ &::-webkit-input-placeholder { @content; }
47
+ }
@@ -1,37 +1,37 @@
1
- //
2
- // A partial implementation of the Ruby colors functions from Compass:
3
- // https://github.com/Compass/compass/blob/stable/core/lib/compass/core/sass_extensions/functions/colors.rb
4
- //
5
-
6
- // a genericized version of lighten/darken so that negative values can be used.
7
- @function adjust-lightness($color, $amount) {
8
- @return adjust-color($color, $lightness: $amount);
9
- }
10
-
11
- // Scales a color's lightness by some percentage.
12
- // If the amount is negative, the color is scaled darker, if positive, it is scaled lighter.
13
- // This will never return a pure light or dark color unless the amount is 100%.
14
- @function scale-lightness($color, $amount) {
15
- @return scale-color($color, $lightness: $amount);
16
- }
17
-
18
- // a genericized version of saturate/desaturate so that negative values can be used.
19
- @function adjust-saturation($color, $amount) {
20
- @return adjust-color($color, $saturation: $amount);
21
- }
22
-
23
- // Scales a color's saturation by some percentage.
24
- // If the amount is negative, the color is desaturated, if positive, it is saturated.
25
- // This will never return a pure saturated or desaturated color unless the amount is 100%.
26
- @function scale-saturation($color, $amount) {
27
- @return scale-color($color, $saturation: $amount);
28
- }
29
-
30
- @function shade($color, $percentage) {
31
- @return mix(#000000, $color, $percentage);
32
- }
33
-
34
- @function tint($color, $percentage) {
35
- @return mix(#ffffff, $color, $percentage);
36
- }
37
-
1
+ //
2
+ // A partial implementation of the Ruby colors functions from Compass:
3
+ // https://github.com/Compass/compass/blob/stable/core/lib/compass/core/sass_extensions/functions/colors.rb
4
+ //
5
+
6
+ // a genericized version of lighten/darken so that negative values can be used.
7
+ @function adjust-lightness($color, $amount) {
8
+ @return adjust-color($color, $lightness: $amount);
9
+ }
10
+
11
+ // Scales a color's lightness by some percentage.
12
+ // If the amount is negative, the color is scaled darker, if positive, it is scaled lighter.
13
+ // This will never return a pure light or dark color unless the amount is 100%.
14
+ @function scale-lightness($color, $amount) {
15
+ @return scale-color($color, $lightness: $amount);
16
+ }
17
+
18
+ // a genericized version of saturate/desaturate so that negative values can be used.
19
+ @function adjust-saturation($color, $amount) {
20
+ @return adjust-color($color, $saturation: $amount);
21
+ }
22
+
23
+ // Scales a color's saturation by some percentage.
24
+ // If the amount is negative, the color is desaturated, if positive, it is saturated.
25
+ // This will never return a pure saturated or desaturated color unless the amount is 100%.
26
+ @function scale-saturation($color, $amount) {
27
+ @return scale-color($color, $saturation: $amount);
28
+ }
29
+
30
+ @function shade($color, $percentage) {
31
+ @return mix(#000000, $color, $percentage);
32
+ }
33
+
34
+ @function tint($color, $percentage) {
35
+ @return mix(#ffffff, $color, $percentage);
36
+ }
37
+
@@ -1,18 +1,18 @@
1
- //
2
- // A partial implementation of the Ruby constants functions from Compass:
3
- // https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/constants.rb
4
- //
5
-
6
- @function opposite-position($from) {
7
- @if ($from == top) {
8
- @return bottom;
9
- } @else if ($from == bottom) {
10
- @return top;
11
- } @else if ($from == left) {
12
- @return right;
13
- } @else if ($from == right) {
14
- @return left;
15
- } @else if ($from == center) {
16
- @return center;
17
- }
18
- }
1
+ //
2
+ // A partial implementation of the Ruby constants functions from Compass:
3
+ // https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/constants.rb
4
+ //
5
+
6
+ @function opposite-position($from) {
7
+ @if ($from == top) {
8
+ @return bottom;
9
+ } @else if ($from == bottom) {
10
+ @return top;
11
+ } @else if ($from == left) {
12
+ @return right;
13
+ } @else if ($from == right) {
14
+ @return left;
15
+ } @else if ($from == center) {
16
+ @return center;
17
+ }
18
+ }