react-support-badge

Support Badges for React!

Usage no npm install needed!

<script type="module">
  import reactSupportBadge from 'https://cdn.skypack.dev/react-support-badge';
</script>

README

react-support-badge

Support Badges for React!

NPM JavaScript Style Guide

Install

npm install --save react-support-badge

Usage

import react, { Component } from 'react'
import { SupportBadge } from 'react-support-badge'

function Example() {
  return <SupportBadge link='https://npmjs.com/' look='red'>
    Please consider supporting me!
  </SupportBadge>
}

// Or

class Example extends Component {

  render() {
    return <SupportBadge link='https://npmjs.com/' look='red'>
      Please consider supporting me!
    </SupportBadge>
  }
}

Properties

  • icon
    • Sets an icon for the support button. (Uses react-icons)
  • buttonText
    • Sets the support button text.
  • link (required)
    • Sets the link to redirect to once pressed.
  • look
    • Sets the look of the badge. (Supports solid colors, images, and gradients)
  • flat
    • Disables the box shadow effect on the badge and support buttons when inactive.
  • flatText
    • Disables the text shadow effect on all text on the badge.
  • callback
    • Callback function to run before redirecting to the support badge location.

Other Features

If you would prefer to display a support message in a different way, you can check out <SupportBar /> or <SupportBubble />. More items may get added later on in the future.

License

MIT © AtriusX