Skip to content

apptension/openwind

Repository files navigation

Welcome to Openwind! 💨 🦄

License: MIT

Community-Driven Tailwind UI Kit


Request a new component 🤓

Want to request a new component? Just create an issue and include [element] in the title. Our smart bot automatically detects your intence and creates a label. Each new issue can be viewed on our page, on the /board page.

How to contribute? 📚

Find an interesting issue and write a comment with in progress. That will indicate that you started working on it and it will automatically assign you to this ticket. This issue will move to the In progress column in our kanban board.

Now, the magic begins.

npm run create-element
# or
yarn create-element

In this step, you need to pick a category and type. You can choose from 4 categories:

  • default - general components/sections
  • marketing - marketing-related components, ex. newsletters, stats
  • ecommerce - ecommerce components, ex. product details, product lists, categories
  • business - business-related components, ex. testimonials, team

Each category includes a number of types:

  • default
    • applicationShells
    • headings
    • dataDisplay
    • lists
    • forms
    • feedback
    • navigation
    • overlays
    • elements
    • layout
    • pageExamples
  • marketing
    • pageSections
    • elements
    • feedback
    • pageExamples
  • ecommerce
    • components
    • pageExamples
  • business
    • components
    • pageExamples

After you pick a category and type you can provide your Github name as well as a short component description.

Then, run the storybook and start work.

npm run storybook
# or
yarn storybook

Grab your unique element id from a newly generated object in elements.json, find your component using this id and start the magic. When you finish just create a pull request and wait for our review.

Ready to submit? 🚀

After the work is done, create a Pull Request and add a comment with resolves #id where #id is an issue number.

Tech stack 💻

  • JavaScript
  • Next.js
  • Tailwind
  • Vercel
  • Supabase
  • Node.js - for webhook
  • Glitch - serving webhook
  • inquirer - for CLI

TODO 👀

  • Support Vue.js
  • Publish components to npm
  • Add a client-side code editor with Github API integration (PR)
  • Validate an element id with a pre-commit hook
  • Create fancy floating emoji animations on reaction click

Known issues

  • Minor CSS problems on the prod verision