logo

StylishCardWithActionButton

InfoGeneratePackages

The code defines a class named `CardWithCustomColorComponent` that inherits from `ApplicationComponent`. Its main functionality is to render a styled card component when its `template` method is called. The card includes a title, a piece of text, and a button labeled 'Buy Now' at the bottom right corner. The card's appearance is styled with predefined classes that set its width to 96 units, background color to a primary color, and text color to match the primary content's color. This structure suggests usage in a web application, potentially for displaying product or information cards in a visually appealing manner.

# frozen_string_literal: true

class CardWithCustomColorComponent < ApplicationComponent
  def template
    div(class: "card w-96 bg-primary text-primary-content") do
      div(class: "card-body") do
        h2(class: "card-title") { "Card title!" }
        p { "If a dog chews shoes whose shoes does he choose?" }
        div(class: "card-actions justify-end") do
          button(class: "btn") { "Buy Now" }
        end
      end
    end
  end
end

Children