Commit 7d43317

committed

Animate palette Deletion

1 parent e5932a8 commit 7d43317Copy full SHA for 7d43317

File tree

+16

-3

lines changed

+16

-3

lines changed

Lines changed: 6 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`import React, {Component} from 'react';`
	`2`	`+import {CSSTransition, TransitionGroup} from 'react-transition-group';`
`2`	`3`	`import MiniPalettes from './MiniPalettes';`
`3`	`4`	`import { Link } from 'react-router-dom';`
`4`	`5`	`import { withStyles } from '@material-ui/styles';`
`@@ -17,14 +18,16 @@ class PaletteList extends Component{`
`17`	`18`	`<h1>React Palettes</h1>`
`18`	`19`	`<Link to="/palette/create">Create Palette</Link>`
`19`	`20`	`</nav>`
`20`		`- <div className={classes.palettes}>`
	`21`	`+ <TransitionGroup className={classes.palettes}>`
`21`	`22`	`{palettes.map(palette => (`
	`23`	`+ <CSSTransition key={palette.id} className='fade' timeout={500}>`
`22`	`24`	`<MiniPalettes key={palette.id} id={palette.id} deletePalette={deletePalette} {...palette} selectPalette={() => this.handlePaletteClick(palette.id)}/>`
	`25`	`+ </CSSTransition>`
`23`	`26`	`))}`
`24`		`- </div>`
	`27`	`+ </TransitionGroup>`
`25`	`28`	`</div>`
`26`	`29`	`</div>`
`27`		`- )`
	`30`	`+ );`
`28`	`31`	`}`
`29`	`32`
`30`	`33`	`}`

Lines changed: 9 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -2,6 +2,15 @@ import sizes from './sizes';`
`2`	`2`	`import bg from './bg.svg';`
`3`	`3`
`4`	`4`	`export default{`
	`5`	`+ "@global":{`
	`6`	`+ ".exit":{`
	`7`	`+ opacity: 1`
	`8`	`+ },`
	`9`	`+ ".exit-active":{`
	`10`	`+ opacity: 0,`
	`11`	`+ transition: "opacity 500ms ease-out"`
	`12`	`+ }`
	`13`	`+ },`
`5`	`14`	`root: {`
`6`	`15`	`backgroundColor: "#4f5b78",`
`7`	`16`	`height: "100vh",`

Lines changed: 1 addition & 0 deletions

Comments

(0)