This package has been deprecated

@garvae/react-waving-flag
TypeScript icon, indicating that this package has built-in type declarations

1.1.1-deprecated • Public • Published

DEPRECATED


This package has been deprecated and is no longer supported because the solutions used in this package do not meet quality standards and are not efficient enough to implement such tasks.



react-waving-flag

A simple animated waving flag from a jpg/png image


react-waving-flag cover


Features

  • lightweight
  • can be shown from both left and right sides of the screen
  • animated with CSS
  • ready for TypeScript

The UI of the component assumes its use from the edge of the container (screen)


demo screen

Installation

npm install @garvae/react-waving-flag

or

yarn add @garvae/react-waving-flag

Properties (Optional)

Name Type Default Required Description
animationSpeed number 1 - Speed of the "waving" animation (seconds)
boxShadowColor string '#f8f8f8' - CSS color property. Flag shadow color.
className string - Container className
curvature number 10 - Wave distortion degree. The smaller the value, the smoother the wave.
flag string - JPG/PNG flag picture URL
flagContainerClassName string - Flag container className
fromLeft boolean true - Set this param to "false" if you want to show the flag from right side of screen
height number 200 - Flag height
isShadow boolean true - Option to disable flag shadow
width number 300 - Flag width

Example

const App = () => {

  // ...

  return (
    <div>
      <WavingFlag
        flag="https://external-preview.redd.it/QVS6D1FlDcpx7byaow-LyO4GpezIlepIkozbzwqtFOY.png?auto=webp&s=d60d5e9953842259ade3c425c55354f6651029f4"
        height={200}
        width={300}
      />
    </div>
  );
};

🤝 Contributions

🤝 Contributions, issues and feature requests are welcome!
Feel free to check issues page and pull request page.

❤️ Give aif you like this project!


📞 Contact me

🌐 Contact page

🔳 QR code

contact me

🚀 Mentoring

If you want to grow 🚀 fast in front-end development - contact me! 🙋‍♂


📄 License

See license in the "LICENCE" file

Package Sidebar

Install

npm i @garvae/react-waving-flag

Weekly Downloads

1

Version

1.1.1-deprecated

License

MIT

Unpacked Size

30.2 kB

Total Files

10

Last publish

Collaborators

  • vgarvae