DOCSEARCHbyAlgolia
Submit Docs

CSS Zero Documentation

repository·master·Indexed 21 days ago

https://github.com/lazaronixon/css-zero

An opinionated front-end starter kit for Ruby on Rails applications providing a 'no build' styling experience. It utilizes utility classes and CSS variables, offering custom templates for Rails scaffolds and authentication, as well as a generator for adding specific components.

Tokens
540
Snippets
3
Records
5
Agent score
24%

What's inside css-zero

  1. Use CSS Zero scaffolds and authentication templates

    master
    CSS Zero includes custom templates for Rails scaffolds and authentication. When generating scaffolds or setting up authentication in a project using this gem, these custom templates will be utilized to provide a consistent UI based on the CSS Zero design system.

  2. Add CSS Zero components

    master

    After the initial installation, you can optionally add specific components to your application using the css_zero:add generator. Use the --help flag to see the list of available components you can include.

    bin/rails generate css_zero:add --help

  3. Install CSS Zero in a Ruby on Rails application

    master

    CSS Zero is an opinionated front-end starter kit for Ruby on Rails, designed as a "no build" alternative to Tailwind CSS.

    To install it, add the gem to your project using Bundler, then run the generator to set up the necessary assets and configuration.

    # Add the gem
bundle add css-zero

# Or install directly from GitHub
bundle add css-zero --github=lazaronixon/css-zero

# Run the installation generator
bin/rails generate css_zero:install

  4. Explore CSS Zero utility classes and variables

    master
    CSS Zero provides a set of utility classes and CSS variables. To see the full list of available utilities and variables, inspect the CSS files located in your application's asset directory at app/assets/stylesheets/css-zero.

  5. Add CSS Zero components via Rails generator

    master

    You can add specific CSS Zero components to your Rails project using the CssZero::AddGenerator. This generator accepts an array of component names as arguments. If a component name is valid (defined in the internal resources.yml), the generator will copy the necessary files and directories into your project. If an invalid component name is provided, it will report an :invalid status.

    # Usage pattern (assuming the generator is registered in your Rails environment)
rails generate css_zero:add component_name_1 component_name_2