Add contribution section

Author: cp-sumi-k

CONTRIBUTING.md

@@ -0,0 +1,29 @@
+# Contributing
+Thank you so much for your interest in contributing! All types of contributions are encouraged and valued. The Project Team looks forward to your contributions.
+
+## Filing issues
+When in doubt, file an issue. We'd rather close a few duplicate issues than let a problem go unnoticed.
+Similarly, if you support a particular feature request, please let us know by commenting on the issue or [subscribing](https://help.github.com/articles/subscribing-to-conversations/) to the issue.
+
+If you are reporting a bug, please help speed up problem diagnosis by providing as much information as possible. Ideally, that would include a small sample project (or gist) that reproduces the problem.
+
+
+## Contributing code
+We actively welcome your pull requests. You can find instructions on building the project in [README.md](https://github.com/canopas/tailwind-animations-examples).
+1. Fork the repo and create your branch from `master`. 
+2. If you've added code that should be tested, add tests 
+4. Make sure your code lints. 
+
+## Labels
+Labels on issues are managed by contributors, you don't have to worry about them. Here's a list of what they mean:
+
+ * **bug**: feature that should work, but doesn't
+ * **enhancement**: minor tweak/addition to existing behaviour
+ * **feature**: new behaviour, bigger than enhancement
+ * **question**: no need of any fix, usually a usage problem
+ * **reproducible**: has enough information to very easily reproduce, mostly in the form of a small project in a GitHub repo
+ * **repro-needed**: we need some code to be able to reproduce and debug locally, otherwise there's not much we can do
+ * **duplicate**: there's another issue which already covers/tracks this
+ * **wontfix**: working as intended, or won't be fixed due to compatibility or other reasons
+ * **invalid**: there isn't enough information to make a verdict, or unrelated
+ * **non-library**: issue is not in the core library code, but rather in documentation, samples, build process, releases

README.md

@@ -13,143 +13,143 @@ We keep building complex animations using tailwind css. Our goal is to build rea
 <table>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/rotate-square.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/rotate-square.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/RotateSquare.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/RotateSquare.vue">
   Rotate Square</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/progress-dot.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/progress-dot.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/ProgressDots.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/ProgressDots.vue">
   Progress Dots</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/heart.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/heart.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/JumpingHeart.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/JumpingHeart.vue">
   Jumping Heart</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/rotate-dot.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/rotate-dot.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/RotateDot.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/RotateDot.vue">
   Rotate Dot</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/pacman.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/pacman.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/Pacman.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/Pacman.vue">
   Pacman</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/three-bounce.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/three-bounce.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/ThreeBounce.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/ThreeBounce.vue">
   Three Bounce</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/arc-rotation.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/arc-rotation.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/ArcRotation.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/ArcRotation.vue">
   Arc Rotation</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/rotate-two-dots.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/rotate-two-dots.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/RotateTwoDots.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/RotateTwoDots.vue">
   Rotate Two Dots</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/square-fill.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/square-fill.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/SquareFill.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/SquareFill.vue">
   Square Fill</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/clock.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/clock.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/Clock.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/Clock.vue">
   Clock</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/rotate-circle.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/rotate-circle.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/RotateCircle.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/RotateCircle.vue">
   Rotate Circle</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/wave.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/wave.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/Wave.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/Wave.vue">
   Wave</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/twin-circle.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/twin-circle.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/TwinCircle.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/TwinCircle.vue">
   Twin Circle</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/double-bouncy-circles.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/double-bouncy-circles.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/DoubleBouncyCircles.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/DoubleBouncyCircles.vue">
   Double Bouncy Circles</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/bouncy-circles.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/bouncy-circles.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/BouncyCircles.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/BouncyCircles.vue">
   Bouncy Circles</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/dotted-square.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/dotted-square.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/DottedSquare.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/DottedSquare.vue">
   Dotted Square</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/arrow-forward.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/arrow-forward.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/ForwardingArrow.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/ForwardingArrow.vue">
   Forwarding Arrow</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/rotating-squares.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/rotating-squares.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/RotatingSquares.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/RotatingSquares.vue">
   Rotating Two Squares</a>
  </td>
  </tr>
  <tr>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/line-wave.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/line-wave.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/LineWave.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/LineWave.vue">
   Line Wave</a>
  </td>
  <td align="center">
-  <img src="https://github.com/canopas/tailwind-animations/blob/main/src/assets/images/triangle-swapping-dots.gif" width="250px" height="250px">
+  <img src="https://github.com/canopas/tailwind-animations/blob/master/src/assets/images/triangle-swapping-dots.gif" width="250px" height="250px">
   <br />
-  <a href="https://github.com/canopas/tailwind-animations-examples/blob/main/src/components/TriangleSwappingDots.vue">
+  <a href="https://github.com/canopas/tailwind-animations-examples/blob/master/src/components/TriangleSwappingDots.vue">
   Triangle Swapping Dots</a>
  </td>
  </tr>
 </table>
 
-# Bugs and Feedback
+## Contribution
 
-For bugs, questions, and discussions please use the [Github Issues](https://github.com/canopas/tailwind-animations/issues).
+The Canopas team enthusiastically welcomes contributions and project participation! There are a bunch of things you can do if you want to contribute! The [Contributor Guide](CONTRIBUTING.md) has all the information you need for everything from reporting bugs to contributing entire new features. Please don't hesitate to jump in if you'd like to, or even ask us questions if something isn't clear.
 
 # Credits
 
@@ -159,4 +159,4 @@ This repository is owned and maintained by the [Canopas team](https://canopas.co
 
 # Licence
 
-This repository is published under the [GNU V3](https://github.com/canopas/tailwind-animations/blob/master/LICENSE.md).
+This repository is published under the [GNU V3](https://github.com/canopas/tailwind-animations-examples/blob/master/LICENSE.md).