Skip to content

anupamhaldkar/liquid-button

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Liquid button preview

Liquid Button

A Liquid effect button built using svg and vanila JS, NPM Repo

Tweet



Run locally

  • npm install liquid-button

  • Then Import liquid-button in your react project

    import LiquidButton from 'LiquidButton/src/LiquidButton' if generate error then copy the LiquidButton.js file from the node_moudle folder and paste inside your src folder and import as import LiquidButton from './LiquidButton'

  • use <LiquidButton class="your-class-name-here" name="FirstButton" background="black" firstcolor="#1e88e5" secondcolor="yellow" /> -------- put your desired colors -----

You should have different class name each time you are using the component like -

ReactDOM.render(<div>
     <LiquidButton class="liquid-button" name="FirstButton" background="black" firstcolor="#1e88e5" secondcolor="yellow" />
     <LiquidButton class="liquid-button2" name="FirstButton" background="black" firstcolor="#1e88e5" secondcolor="yellow" />
     </div>, document.getElementById('root'));
  • see the above example it will show 2 buttons if you want to use more than your class name should be different each time.

    Now you can use more than one liquid-buttons on same page.

This project was bootstrapped with Create React App.

License: MIT