scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-09-07 05:34:55 +08:00
Code Issues Projects Releases Packages Wiki Activity

Hound is love, Hound is life

Browse source
This commit is contained in:
Luka Murn 2017-09-28 20:07:11 +02:00
parent a0db8fcf9d
commit cbf2e3cc3f
2 changed files with 21 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/javascript/src/components/AlertsContainer/index.jsx
View file

@ -44,7 +44,7 @@ class AlertsContainer extends Component {
clear(alert) { clear(alert) {
const index = this.state.alerts.indexOf(alert); const index = this.state.alerts.indexOf(alert);
const alerts = update(this.state.alerts, { $splice: [[index, 1]] }); const alerts = update(this.state.alerts, { $splice: [[index, 1]] });
this.setState({ alerts: alerts }); this.setState({ alerts });
} }
renderAlert(alert) { renderAlert(alert) {

37
app/javascript/src/styles/animations.scss
View file

@ -1,27 +1,30 @@
.alert-animated-enter { .alert-animated-enter {
opacity: 0.01; opacity: 0.01;
&.alert-animated-enter-active {
opacity: 1;
transition: opacity 150ms ease-in;
}
} }
.alert-animated-enter.alert-animated-enter-active {
opacity: 1;
transition: opacity 150ms ease-in;
}
.alert-animated-exit { .alert-animated-exit {
opacity: 1; opacity: 1;
padding-bottom: 15px; padding-bottom: 15px;
padding-top: 15px; padding-top: 15px;
margin-bottom: 20px; margin-bottom: 20px;
height: 50px; height: 50px;
&.alert-animated-exit-active {
overflow: hidden;
opacity: 0.01;
padding-top: 0;
padding-bottom: 0;
margin-bottom: 0;
height: 0;
transition: opacity 300ms ease-in,
padding-top 500ms ease-in,
padding-bottom 500ms ease-in,
margin-bottom 500ms ease-in,
height 500ms ease-in;
}
} }
.alert-animated-exit.alert-animated-exit-active {
overflow: hidden;
opacity: 0.01;
padding-top: 0px;
padding-bottom: 0px;
margin-bottom: 0px;
height: 0px;
transition: opacity 300ms ease-in,
padding-top 500ms ease-in,
padding-bottom 500ms ease-in,
margin-bottom 500ms ease-in,
height 500ms ease-in;
}