Button
You need buttons in your app. This is how you get them.
bin/rails g quicksilver_ui:affordance button
Buttons already exist in HTML, so let’s not make a component for them. Instead we use affordances to make it simple to style them.
button class: "ui-button ui-button-primary" do
"Click me!"
end
One of the upsides of affordances is, that we can now style other things as buttons as well. You want a link, that looks like a button? You got it.
a href: "#", class: "ui-button ui-button-primary" do
"Click me!"
end
What about a submit input? No problem.
input value: "Click me!",
type: "submit",
class: "ui-button ui-button-primary"
It all looks the same and it is easy to reason about.
Default
button(class: "ui-button") { "Click Me!" }
Primary
button(class: "ui-button ui-button-primary") { "Click Me!" }
Secondary
button(class: "ui-button ui-button-secondary") { "Click Me!" }
Warning
button(class: "ui-button ui-button-warning") { "Click Me!" }
Danger
button(class: "ui-button ui-button-danger") { "Click Me!" }
Large
button(class: "ui-button ui-button-lg") { "Click Me!" }
Medium
button(class: "ui-button ui-button-md") { "Click Me!" }
Small
button(class: "ui-button ui-button-sm") { "Click Me!" }
Extra small
button(class: "ui-button ui-button-xs") { "Click Me!" }