Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fmanimashaun/button-component
The **Button Component Challenge** is designed to challenge developers in creating a flexible and reusable button component.
https://github.com/fmanimashaun/button-component
button reactjs sass vite
Last synced: 14 days ago
JSON representation
The **Button Component Challenge** is designed to challenge developers in creating a flexible and reusable button component.
- Host: GitHub
- URL: https://github.com/fmanimashaun/button-component
- Owner: fmanimashaun
- Created: 2023-08-31T19:00:09.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-08-31T19:26:01.000Z (about 1 year ago)
- Last Synced: 2024-10-09T07:41:35.897Z (about 1 month ago)
- Topics: button, reactjs, sass, vite
- Language: SCSS
- Homepage: https://fmanimashaun.github.io/button-component/
- Size: 272 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 📗 Table of Contents
- [📖 About the Project](#about-the-project)
- [🚀 Live Demo](#live-demo)
- [💻 Getting Started](#getting-started)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [👥 Author](#author)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#show-your-support)
- [🙏 Acknowledgments](#acknowledgments)
- [📝 License](#license)
## 📖 About the Project
The **Button Component Challenge** is designed to challenge developers in creating a flexible and reusable button component. Here are the main requirements:
### User Stories
- [ ] I can see different button types: default, outline, and text.
- [ ] I can choose to disable box-shadow.
- [ ] I can choose to disable the button.
- [ ] I can choose to have an icon on the left or right (Use Google Icon and at least 5 variants).
- [ ] I can have different button sizes.
- [ ] I can have different colors.
- [ ] When I hover or focus, I can see visual indicators.
- [ ] I can still access all button attributes.
- [ ] (Optional) Show button in a similar way like the design or use Storybook.
## 🚀 Live Demo
- [Live Demo Link](https://fmanimashaun.github.io/button-component/)
## 💻 Getting Started
### Setup
```bash
cd your-desired-folder
git clone https://github.com/fmanimashaun/button-component.git
cd button-component
```
### Install
```bash
npm install
```
### Usage
```bash
npm run start
```
👤 **Engr. Animashaun Fisayo**
- [GitHub](https://github.com/fmanimashaun)
- [Twitter](https://twitter.com/fmanimashaun)
- [LinkedIn](https://www.linkedin.com/in/fmanimashaun/)
- [Website](https://fmanimashaun.com)
## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/)
If you like this project and want to support me, you can give a ⭐️ to this repo!
- [devchallenges.io](https://devchallenges.io/)
This project is [MIT](./MIT.md) licensed.