Amazing-Css-Effects

Some Astonishing CSS-Effects✨

This project is part of Girl script Summer of code 2022

This project was part of the following Open Source Programs

Demo 🎥

Website for this repository : https://amazing-css-effects.netlify.app/

Must Check Repos :

💻 Tech Stack

Front-End:

🚀 Quick Start :

Before starting kindly read the Code of Conduct

Contributions :

Check out our Contributing Guildlines

Step 1: Forking the repository :

To work on an open-source project, you will primarily need to make your copy of the repository. To do this, you should first fork the repository and then clone it so that you have a local working copy.

Get your own Fork/Copy of repository by clicking Fork button at the upper right corner.

Step 2: Clone the Forked Repository

After the repository is forked, you can now clone it so that you have a copy of the codebase on your local Computer.

To make your local copy of the repository follow the steps:

Open the Command Prompt
Type this command:

$ git clone https://github.com/<your-github-username>/Amazing-Css-Effects

Step 3: Creating a new branch (IMP)

This is one of the most important step that you should follow while contributing to an Open Source project . A branch helps to manage the workflow, isolate your code and avoids creating a mess. To create a new branch:

$ git branch <name_of_branch>
$ git checkout -b <name_of_branch>

Keep your cloned repo up to date by pulling from upstream (this will also avoid any merge conflicts while committing new changes)

git pull origin main

Step 5: Contribute

Make relevant changes according to the issue that you were assigned on. Contribute in any way you feel like :)

Step 6: Commiting and Pushing

Once you have modified an existing file or added a new file to the project, you can add it to your local repository, which you can do with the git add command.

git add .

With our file staged, we’ll want to record the changes that we made to the repository with the git commit command.

The commit message is an important aspect of your code contribution; it helps the other contributors to fully understand the change you have made, why you made it, and how significant it is.

git commit -m "useful commit message"

At this point you can use the git push command to push the changes to the current branch of your forked repository:

git push origin <branch-name>

Step 7: Create Pull Request

Now, you are ready to make a pull request to the original repository.

You should navigate to your forked repository, and press the "Compare & pull request" button on the page.

GitHub will alert you that you can merge the two branches because there is no competing code. You should add in a title, a comment, and then press the “Create pull request” button.

CONTRIBUTING A NEW TEMPLATE?

Please adhere to these guidelines

Create a folder with the name of your css effect template
Start building inside your folder with an entry file called index.html and after building, attach an image named "preview.png" within the folder root which represents the preview image of your template
Go into the style_link.json file and add an object corresponding to your project in the following format:

    {
  
      "name": "Name-of-folder",
      "link": "Name-of-folder/index.html"
  
    },

Important to note:

The name key of the json object must match the exact name of the folder The link key of the json object must match the exact name of the folder then append "/index.html"

For example: I create a folder called "Animated Text", my json object would be:

    {
  
      "name": "Animated Text",  (not "Animated-Text" or "AnimatedText")
      "link": "Animated Text/index.html"  (not "AnimatedText/index.html" or "Animated-Text/index.html")
  
    },