39 lines
853 B
TypeScript
39 lines
853 B
TypeScript
import { Component, OnInit, Input } from '@angular/core';
|
|
import { trigger, transition, style, animate, group } from '@angular/animations';
|
|
|
|
@Component({
|
|
selector: 'app-hide-section',
|
|
templateUrl: './hide-section.component.html',
|
|
styleUrls: ['./hide-section.component.sass'],
|
|
animations: [
|
|
trigger('slideInOut', [
|
|
transition(':enter', [
|
|
style({ opacity: 0 }),
|
|
animate('500ms ease-in', style({ opacity: 1 }))
|
|
]),
|
|
transition(':leave', [
|
|
style({opacity: 1}),
|
|
animate('500ms ease-in', style({ opacity: 0 }))
|
|
])
|
|
])
|
|
]
|
|
})
|
|
export class HideSectionComponent implements OnInit {
|
|
|
|
@Input() heading: string
|
|
|
|
label = '▼'
|
|
|
|
shown = false
|
|
|
|
constructor() { }
|
|
|
|
ngOnInit() { }
|
|
|
|
toggle() {
|
|
this.shown = !this.shown
|
|
this.label = this.shown ? '▲' : '▼'
|
|
}
|
|
|
|
}
|