2020-09-15 15:53:18 +02:00
|
|
|
import {Component, Input} from '@angular/core';
|
2020-06-15 21:02:44 +02:00
|
|
|
import {animation} from "./animation";
|
|
|
|
import {transition, trigger} from "@angular/animations";
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'slide',
|
|
|
|
template: `
|
|
|
|
<div @blockInitialRenderAnimation>
|
|
|
|
<div [@state]="{value: state, params: {y: y}}"
|
2020-06-17 12:27:04 +02:00
|
|
|
style="position: absolute;top: 50%;left: 50%;width: 100%;min-height: 50vh">
|
2020-06-15 21:02:44 +02:00
|
|
|
<ng-content></ng-content>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
`,
|
|
|
|
animations: [animation,
|
|
|
|
trigger(
|
|
|
|
"blockInitialRenderAnimation",
|
|
|
|
[
|
|
|
|
transition( ":enter", [] )
|
|
|
|
]
|
|
|
|
)]
|
|
|
|
})
|
|
|
|
export class SlideComponent {
|
|
|
|
state: number = 1
|
|
|
|
y: number = -50;
|
|
|
|
medium: boolean = true;
|
|
|
|
}
|