Class: BulmaPhlex::Card

Inherits:
Base
  • Object
show all
Defined in:
lib/bulma_phlex/card.rb

Overview

Renders a [Bulma card](bulma.io/documentation/components/card/) component.

Supports an optional header (with title and custom classes), a content area, and a footer with one or more link items (which can include icons). Each section is populated via builder methods on the yielded component.

## Example

render BulmaPhlex::Card.new do |card|
  card.head("Card Title")
  card.content do
    "This is some card content"
  end
  card.footer_link("View", "/view", target: "_blank")
  card.footer_link("Edit", "/edit", class: "has-text-primary")
end

Class Method Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(**html_attributes) ⇒ Card

Returns a new instance of Card.



28
29
30
 
# File 'lib/bulma_phlex/card.rb', line 28

def initialize(**html_attributes)
  @html_attributes = html_attributes
end

Class Method Details

.new(**html_attributes) ⇒ Object

Parameters

  • ‘**html_attributes` — Additional HTML attributes for the card element



24
25
26
 
# File 'lib/bulma_phlex/card.rb', line 24

def self.new(**html_attributes)
  super
end

Instance Method Details

#content(&block) ⇒ Object

Sets the card body content.

Expects a block that renders the card content.



54
55
56
 
# File 'lib/bulma_phlex/card.rb', line 54

def content(&block)
  @card_content = block
end

#footer_item(&block) ⇒ Object

Delegates full control of the footer item to the block. The top element in the block must include the ‘card-footer-item` class.



70
71
72
 
# File 'lib/bulma_phlex/card.rb', line 70

def footer_item(&block)
  (@footer_items ||= []) << block
end

#footer_link(text, href, **html_attributes) ⇒ Object

Adds a link item to the card footer. Can be called multiple times to add multiple links.

  • ‘text` — The link label text

  • ‘href` — The URL the link points to

  • ‘icon:` — Optional icon class string (e.g. `“fas fa-edit”`) to render an icon alongside the text

  • ‘**html_attributes` — Additional HTML attributes for the `<a>` element (e.g. `target:`, `class:`)



64
65
66
 
# File 'lib/bulma_phlex/card.rb', line 64

def footer_link(text, href, **html_attributes)
  (@footer_items ||= []) << [text, href, html_attributes]
end

#head(title, classes: nil) ⇒ Object

Sets the card header title and optional CSS classes.

  • ‘title` — The text to display in the card header

  • ‘classes` — Optional additional CSS classes for the header element



46
47
48
49
 
# File 'lib/bulma_phlex/card.rb', line 46

def head(title, classes: nil)
  @header_title = title
  @header_classes = classes
end

#view_template ⇒ Object 



32
33
34
35
36
37
38
39
40
 
# File 'lib/bulma_phlex/card.rb', line 32

def view_template(&)
  vanish(&)

  div(**mix(class: "card", **@html_attributes)) do
    card_header
    card_content
    card_footer
  end
end