@social-mail/social-mail-client 1.7.2 → 1.7.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 (18) hide show
  1. package/dist/site-editor/properties/groups/AnimateGroupEditor.d.ts.map +1 -1
  2. package/dist/site-editor/properties/groups/AnimateGroupEditor.js +11 -0
  3. package/dist/site-editor/properties/groups/AnimateGroupEditor.js.map +1 -1
  4. package/dist/site-editor/properties/groups/AttributeEditor.js +4 -1
  5. package/dist/site-editor/properties/groups/AttributeEditor.js.map +1 -1
  6. package/dist/site-editor-app/SiteEditorApp.pack.js +15 -1
  7. package/dist/site-editor-app/SiteEditorApp.pack.js.map +1 -1
  8. package/dist/site-editor-app/SiteEditorApp.pack.min.js +1 -1
  9. package/dist/site-editor-app/SiteEditorApp.pack.min.js.map +1 -1
  10. package/dist/tsconfig.tsbuildinfo +1 -1
  11. package/package.json +1 -1
  12. package/src/site-editor/properties/groups/AnimateGroupEditor.tsx +15 -0
  13. package/src/site-editor/properties/groups/AttributeEditor.tsx +1 -1
  14. package/styler/styler.css +55 -16
  15. package/styler/styler.css.map +1 -1
  16. package/styler/styler.less +1 -0
  17. package/styler/styles/animations/animations.less +8 -4
  18. package/styler/styles/animations/scroll-animations.less +27 -0
package/styler/styler.less CHANGED
@@ -9,3 +9,4 @@
9
9
  @import "./styles/animations/**/*.less";
10
10
 
11
11
  @import "./end.less";
12
+
package/styler/styles/animations/animations.less CHANGED
@@ -1,7 +1,8 @@
1
1
  @animations: fade-in, fade-out, zoom-in, zoom-out;
2
2
 
3
3
  each(@animations, .(@s) {
4
- [styler-revealed][styler-on-enter=@{s}] {
4
+ [styler-revealed]:not(animated-text)[styler-on-enter=@{s}],
5
+ [styler-revealed]animated-text[styler-on-enter=@{s}] > * {
5
6
  animation-name: @s,
6
7
  var(--styler-on-enter-effect-1, none),
7
8
  var(--styler-on-enter-effect-2, none);
@@ -22,7 +23,8 @@ each(@animations, .(@s) {
22
23
  var(--styler-on-enter-effect-2-delay, unset);
23
24
  }
24
25
 
25
- [styler-on-click=@{s}] {
26
+ [styler-clicked]:not(animated-text)[styler-on-click=@{s}],
27
+ [styler-clicked]animated-text[styler-on-click=@{s}] > * {
26
28
  animation-name: @s,
27
29
  var(--styler-on-click-effect-1, none),
28
30
  var(--styler-on-click-effect-2, none);
@@ -43,7 +45,8 @@ each(@animations, .(@s) {
43
45
  var(--styler-on-click-effect-2-delay, unset);
44
46
  }
45
47
 
46
- [styler-on-hover=@{s}]:hover {
48
+ :not(animated-text)[styler-on-hover=@{s}]:hover,
49
+ animated-text[styler-on-hover=@{s}]:hover > * {
47
50
  animation-name: @s,
48
51
  var(--styler-on-hover-effect-1, none),
49
52
  var(--styler-on-hover-effect-2, none);
@@ -64,7 +67,8 @@ each(@animations, .(@s) {
64
67
  var(--styler-on-hover-effect-2-delay, unset);
65
68
  }
66
69
 
67
- [styler-on-leave=@{s}] {
70
+ [styler-left]:not(animated-text)[styler-on-leave=@{s}],
71
+ [styler-left]animated-text[styler-on-leave=@{s}] > * {
68
72
  animation-name: @s,
69
73
  var(--styler-on-leave-effect-1, none),
70
74
  var(--styler-on-leave-effect-2, none);
package/styler/styles/animations/scroll-animations.less ADDED
@@ -0,0 +1,27 @@
1
+ [styler-on-scroll] {
2
+ position: relative;
3
+ }
4
+
5
+ [styler-on-scroll] > * {
6
+ transition: all var(--styler-on-scroll-delay, 0.1s) ease-in-out;
7
+ }
8
+
9
+ [above-body][styler-on-scroll=move-away] > * {
10
+ transform: translateY( calc(var(--above-body-ratio) * 100%) ) scale( clamp(0.2, var(--body-ratio), 1), clamp(-0.2, var(--body-ratio), 1));
11
+ }
12
+
13
+ [above-body][styler-on-scroll-effect-1=fade-out] > * {
14
+ opacity: clamp(0.5, var(--body-ratio), 1);
15
+ }
16
+
17
+ [above-body][styler-on-scroll-effect-2=blur]::after {
18
+ display: block;
19
+ position: absolute;
20
+ left: 0;
21
+ top: 0;
22
+ right: 0;
23
+ bottom: 0;
24
+ content: "";
25
+ pointer-events: none;
26
+ backdrop-filter: blur( clamp(1px, calc(var(--above-body-ratio) *10px) , 10px) );
27
+ }