MaterialViewComponents

Material Design with ViewComponents and TailwindCSS.

⚠️ This project is still in prototypal stage so don't use it in production!

Usage

Currently, only Material buttons components are available.

Buttons

Button components are wrapper around the button_to helper.

Regular buttons

<%= render Material::ButtonComponent.new do |button| %>
  <%= button.icon "add" %>
  <%= button.text "Button" %>
<% end %>

<%= render Material::ButtonComponent.new(disabled: true) do |button| %>
  <%= button.icon "add" %>
  <%= button.text "Button" %>    
<% end %>    
	
<%= render Material::ButtonComponent.new(button_type: :tonal) do |button| %>    
  <%= button.icon "add" %>    
  <%= button.text "Button" %>    
<% end %>    
	
<%= render Material::ButtonComponent.new(button_type: :tonal, disabled: true) do |button| %>    
  <%= button.icon "add" %>    
  <%= button.text "Button" %>    
<% end %>    
	 
<%= render Material::ButtonComponent.new(button_type: :outlined) do |button| %>    
  <%= button.icon "add" %>    
  <%= button.text "Button" %>    
<% end %>        
	 
<%= render Material::ButtonComponent.new(button_type: :outlined, disabled: true) do |button| %>    
  <%= button.icon "add" %>    
  <%= button.text "Button" %>    
<% end %>    
	 
<%= render Material::ButtonComponent.new(button_type: :elevated) do |button| %>    
  <%= button.icon "add" %>    
  <%= button.text "Button" %>    
<% end %>    

<%= render Material::ButtonComponent.new(button_type: :elevated, disabled: true) do |button| %>
  <%= button.icon "add" %>
  <%= button.text "Button" %>
<% end %>

FABs

<%= render Material::FABComponent.new do |fab| %>
  <%= fab.icon "add" %>
<% end %>

Installation

Add this line to your application's Gemfile:

gem "material_view_components"

And then execute:

$ bundle

Or install it yourself as:

$ gem install material_view_components

Link the assets in your manifest:

//= link material_view_components_manifest.js

Contributing

Contribution directions go here.

License

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

material_view_components

Development

Runtime