Skip to content

Commit 916a050

Browse files
committed
fix(rotate): fix transform origin in rotate in and out animations
1 parent 862c54e commit 916a050

11 files changed

+22
-22
lines changed

lib/other/collapse.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,15 @@ export function collapseAnimation(options?: IAnimationOptions): AnimationTrigger
2121
'1',
2222
style({
2323
height: '0',
24-
display: 'none',
24+
visibility: 'hidden',
2525
overflow: 'hidden'
2626
})
2727
),
2828
state(
2929
'0',
3030
style({
3131
height: AUTO_STYLE,
32-
display: AUTO_STYLE,
32+
visibility: AUTO_STYLE,
3333
overflow: 'hidden'
3434
})
3535
),

lib/rotating-entrances/rotate-in-down-left.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateInDownLeftAnimation(options?: IAnimationOptions): Animatio
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'left bottom' }),
3536
group([
36-
style({ 'transform-origin': 'left bottom' }),
3737
useAnimation(rotateInDownLeft, {
3838
params: {
3939
duration: '{{duration}}',
@@ -63,8 +63,8 @@ export function rotateInDownLeftOnEnterAnimation(options?: IAnimationOptions): A
6363
[
6464
style({ visibility: 'hidden' }),
6565
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
66+
style({ 'transform-origin': 'left bottom' }),
6667
group([
67-
style({ 'transform-origin': 'left bottom' }),
6868
useAnimation(rotateInDownLeft, {
6969
params: {
7070
duration: '{{duration}}',

lib/rotating-entrances/rotate-in-down-right.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateInDownRightAnimation(options?: IAnimationOptions): Animati
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'right bottom' }),
3536
group([
36-
style({ 'transform-origin': 'right bottom' }),
3737
useAnimation(rotateInDownRight, {
3838
params: {
3939
duration: '{{duration}}',
@@ -63,8 +63,8 @@ export function rotateInDownRightOnEnterAnimation(options?: IAnimationOptions):
6363
[
6464
style({ visibility: 'hidden' }),
6565
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
66+
style({ 'transform-origin': 'right bottom' }),
6667
group([
67-
style({ 'transform-origin': 'right bottom' }),
6868
useAnimation(rotateInDownRight, {
6969
params: {
7070
duration: '{{duration}}',

lib/rotating-entrances/rotate-in-up-left.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateInUpLeftAnimation(options?: IAnimationOptions): AnimationT
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'left bottom' }),
3536
group([
36-
style({ 'transform-origin': 'left bottom' }),
3737
useAnimation(rotateInUpLeft, {
3838
params: {
3939
duration: '{{duration}}',
@@ -63,8 +63,8 @@ export function rotateInUpLeftOnEnterAnimation(options?: IAnimationOptions): Ani
6363
[
6464
style({ visibility: 'hidden' }),
6565
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
66+
style({ 'transform-origin': 'left bottom' }),
6667
group([
67-
style({ 'transform-origin': 'left bottom' }),
6868
useAnimation(rotateInUpLeft, {
6969
params: {
7070
duration: '{{duration}}',

lib/rotating-entrances/rotate-in-up-right.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateInUpRightAnimation(options?: IAnimationOptions): Animation
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'right bottom' }),
3536
group([
36-
style({ 'transform-origin': 'right bottom' }),
3737
useAnimation(rotateInUpRight, {
3838
params: {
3939
duration: '{{duration}}',
@@ -63,8 +63,8 @@ export function rotateInUpRightOnEnterAnimation(options?: IAnimationOptions): An
6363
[
6464
style({ visibility: 'hidden' }),
6565
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
66+
style({ 'transform-origin': 'right bottom' }),
6667
group([
67-
style({ 'transform-origin': 'right bottom' }),
6868
useAnimation(rotateInUpRight, {
6969
params: {
7070
duration: '{{duration}}',

lib/rotating-entrances/rotate-in.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateInAnimation(options?: IAnimationOptions): AnimationTrigger
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'center' }),
3536
group([
36-
style({ 'transform-origin': 'center' }),
3737
useAnimation(rotateIn, {
3838
params: {
3939
duration: '{{duration}}',
@@ -63,8 +63,8 @@ export function rotateInOnEnterAnimation(options?: IAnimationOptions): Animation
6363
[
6464
style({ visibility: 'hidden' }),
6565
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
66+
style({ 'transform-origin': 'center' }),
6667
group([
67-
style({ 'transform-origin': 'center' }),
6868
useAnimation(rotateIn, {
6969
params: {
7070
duration: '{{duration}}',

lib/rotating-exits/rotate-out-down-left.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateOutDownLeftAnimation(options?: IAnimationOptions): Animati
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'left bottom' }),
3536
group([
36-
style({ 'transform-origin': 'left bottom' }),
3737
useAnimation(rotateOutDownLeft, {
3838
params: {
3939
duration: '{{duration}}',
@@ -62,8 +62,8 @@ export function rotateOutDownLeftOnLeaveAnimation(options?: IAnimationOptions):
6262
':leave',
6363
[
6464
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
65+
style({ 'transform-origin': 'left bottom' }),
6566
group([
66-
style({ 'transform-origin': 'left bottom' }),
6767
useAnimation(rotateOutDownLeft, {
6868
params: {
6969
duration: '{{duration}}',

lib/rotating-exits/rotate-out-down-right.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateOutDownRightAnimation(options?: IAnimationOptions): Animat
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'right bottom' }),
3536
group([
36-
style({ 'transform-origin': 'right bottom' }),
3737
useAnimation(rotateOutDownRight, {
3838
params: {
3939
duration: '{{duration}}',
@@ -62,8 +62,8 @@ export function rotateOutDownRightOnLeaveAnimation(options?: IAnimationOptions):
6262
':leave',
6363
[
6464
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
65+
style({ 'transform-origin': 'right bottom' }),
6566
group([
66-
style({ 'transform-origin': 'right bottom' }),
6767
useAnimation(rotateOutDownRight, {
6868
params: {
6969
duration: '{{duration}}',

lib/rotating-exits/rotate-out-up-left.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateOutUpLeftAnimation(options?: IAnimationOptions): Animation
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'left bottom' }),
3536
group([
36-
style({ 'transform-origin': 'left bottom' }),
3737
useAnimation(rotateOutUpLeft, {
3838
params: {
3939
duration: '{{duration}}',
@@ -62,8 +62,8 @@ export function rotateOutUpLeftOnLeaveAnimation(options?: IAnimationOptions): An
6262
':leave',
6363
[
6464
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
65+
style({ 'transform-origin': 'left bottom' }),
6566
group([
66-
style({ 'transform-origin': 'left bottom' }),
6767
useAnimation(rotateOutUpLeft, {
6868
params: {
6969
duration: '{{duration}}',

lib/rotating-exits/rotate-out-up-right.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateOutUpRightAnimation(options?: IAnimationOptions): Animatio
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'right bottom' }),
3536
group([
36-
style({ 'transform-origin': 'right bottom' }),
3737
useAnimation(rotateOutUpRight, {
3838
params: {
3939
duration: '{{duration}}',
@@ -62,8 +62,8 @@ export function rotateOutUpRightOnLeaveAnimation(options?: IAnimationOptions): A
6262
':leave',
6363
[
6464
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
65+
style({ 'transform-origin': 'right bottom' }),
6566
group([
66-
style({ 'transform-origin': 'right bottom' }),
6767
useAnimation(rotateOutUpRight, {
6868
params: {
6969
duration: '{{duration}}',

lib/rotating-exits/rotate-out.animation.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ export function rotateOutAnimation(options?: IAnimationOptions): AnimationTrigge
3232
'0 <=> 1',
3333
[
3434
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
35+
style({ 'transform-origin': 'center' }),
3536
group([
36-
style({ 'transform-origin': 'center' }),
3737
useAnimation(rotateOut, {
3838
params: {
3939
duration: '{{duration}}',
@@ -62,8 +62,8 @@ export function rotateOutOnLeaveAnimation(options?: IAnimationOptions): Animatio
6262
':leave',
6363
[
6464
...(options && options.animateChildren === 'before' ? [query('@*', animateChild(), { optional: true })] : []),
65+
style({ 'transform-origin': 'center' }),
6566
group([
66-
style({ 'transform-origin': 'center' }),
6767
useAnimation(rotateOut, {
6868
params: {
6969
duration: '{{duration}}',

0 commit comments

Comments
 (0)