diff --git a/example/src/DemoBlock.css b/example/src/DemoBlock.css new file mode 100644 index 0000000..ef094b4 --- /dev/null +++ b/example/src/DemoBlock.css @@ -0,0 +1,35 @@ +.buttons-div-container{ + position: relative; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + width: 46vmax; + height: 4vmax; + margin: 2vmax 2vmax 0 0; +} + +.animation-reset-button{ + position: absolute; + top: 1rem; + right: 1rem; + background-color: #32bafa; + color : #fff; + border: 0; + border-radius: 4; + font-size: 1rem; + padding: 0.7rem 1.2rem; + cursor: pointer; + outline: none; +} + + +.particle-effect-button{ + background-color: #121019; + color: #fff; + font-size: 1.2rem; + border: 0; + padding: 1.5rem 3rem; + border-radius: 5; + cursor: pointer; +} \ No newline at end of file diff --git a/example/src/DemoBlock.js b/example/src/DemoBlock.js index 8498aae..4b71fee 100644 --- a/example/src/DemoBlock.js +++ b/example/src/DemoBlock.js @@ -1,4 +1,5 @@ import React, { Component } from 'react' +import './DemoBlock.css' import PropTypes from 'prop-types' import ParticleEffectButton from 'react-particle-effect-button' @@ -16,7 +17,7 @@ export default class DemoBlock extends Component { animating: false } - render () { + render() { const { background, text, @@ -31,33 +32,12 @@ export default class DemoBlock extends Component { return (
{hidden && !animating && (