Coolest place in the digital universe, the Animating Buttons repository! This project aims to provide a collection of animated buttons that you can use to enhance your web development projects. Whether you're a beginner or an experienced developer, these buttons will add a touch of interactivity and flair to your websites.
| Contribution Guidelines |
|---|
| - You can contribute any animated buttons. β¬οΈ |
| - You can update or refine an existing animated button or even add your own new buttons to this repository. π |
| - Make sure you follow the below steps before making your contributions. βββ |
-
First, fork the repository (Click the Fork button in the top right corner of the page).
-
Clone the forked repo to your local machine using the following command:
git clone https://github.com/**username**/Animating-Buttons.git -
Navigate to project directory.
cd Animating-Buttonsnpm i npm start -
Create a new Branch
git checkout -b my-new-branch
-
Once you have cloned the repository and created a new branch, proceed with the following steps to initiate your contribution-
STEPS DESCRIPTION 1. Go to the public/Buttons folderπ in the repository. 2. Add a new folder with your GitHub username, including your button code (index.html + style.css files). 3. Go to the src/Data.js file π 4. Add your folder name (e.g., github_username) and your code in the src/Data.js fileNote: Replace `github_username` with your actual GitHub username.
-
Before embarking on your journey, bear these points in mind- ββ
Note Make sure to align your button centered horizontally as well as vertically. Don't forget to replace 'your_github_username' with your actual GitHub username. If you are adding more than one button, give them proper names like Spyware007_1, Spyware007_2 your_github_username_1, etc.
-
Stage your changes.
git add . -
Commit your changes.
git commit -m "Relevant message" -
Then push
git push origin my-new-branch -
Finally, create a new pull request from your forked repository.
- To know more about how to contribute, read the Countributing Guidelines ππ
- You can refer to the following articles on basics of Git and Github and also contact the Project Mentors, in case you are stuck:
| SNo. | Description |
|---|---|
| 1 | Make sure you commit your changes in a new branch ββ |
| 2 | Make sure that your file name and your commit message are relevant. |
| 3 | Also, make sure you comment your code wherever necessary. |
| 4 | Make sure to align your button centered horizontally as well as vertically. |
| 5 | Make sure your folder name is in correct format (GitHub username) |
| 6 | If you are adding more than one button, give them proper names like Spyware007_1, Spyware007_2 your_github_username_1, etc. |
Om Gawande |
 Tanya Chanchalani |
 Poorvi Shetty |
##A special note for a particular issue some users can face in the project##
Upon initializing , the following message may be prompted on the terminal. 'react-scripts' is not recognized as an internal or external command, operable program or batch file. To eliminate that: You can use to acquire the missing dependencies.
But during npm install, the following error can occur: npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
The warning message received indicates that the package 'stable' you have installed is deprecated. The 'stable' package was previously used to provide a stable sorting algorithm for older versions of JavaScript that did not guarantee the stability of the Array#sort() method. However, modern versions of JavaScript now ensure that Array#sort() is a stable sort, making the 'stable' package unnecessary.
The warning message suggests referring to the compatibility table on MDN (Mozilla Developer Network) to understand the browser compatibility of the Array#sort() method. The table provides information about which browser versions support stable sorting using Array#sort().
To address this issue: we can simply use the command:
After this when we again run the command: , the website will work just fine.
A big thank you to all our contributors who have made this project better with their valuable contributions! We appreciate your efforts and dedication.
Don't forget to β this repository to show your support!
PS: A big thank you to all our contributors who have made this project better with their valuable contributions! We appreciate your efforts and dedication.