Git Product home page Git Product logo

lycan_ui's Introduction

LycanUi

The name of this is tentative. Not really too sure what to call it yet.

What is this?

Rails is in dire need of UI frameworks. The JS ecosystem has all these awesome UI frameworks that make building beautiful UIs a breeze. But, Rails is missing that, and it's a pain. LycanUi serves to fill that gap.

LycanUi is a collection of UI components that can be easily added to your Rails app, either by copy and pasting the code, or by using a generator.

Copy and Paste? What?

Yep, copy and paste. Inspired by shadcn/ui, LycanUi just gives you the code.

The worst part about interacting with any UI framework is when you need to customize their designs or funcitonality. If you need to do something that is outside what the component was originally designed for, you normally.. just can't. Not to mention overriding their provided CSS is normally hellish.

LycanUi provides sensible defaults for styles and functionality, that way you get something that works and follows accessibility guidelines.

Start with the default functionality and styling, and then when you need to expand or change anything, you can.

Installation

Add this line to your application's Gemfile:

gem "lycan_ui", group: :development

And then execute:

$ bundle

Now to make sure your app is set up for use, run

$ rails generate lycan_ui:setup

Usage

Say you want to install the Button component. You can do so by running the following command:

$ rails generate lycan_ui:add button

You'll now see some things in components/button.rb, you can now use that component in any view or helper like so

<%= render Button.new %>

Contributing

TODO: Add contributing guidelines

License

The gem is available as open source under the terms of the MIT License.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.