Class: BulmaPhlex::Card

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

Overview

Renders a Bulma card component.

Supports an optional header (with title and custom classes), an image, 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.



75
76
77
 
# File 'lib/bulma_phlex/card.rb', line 75

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.



91
92
93
 
# File 'lib/bulma_phlex/card.rb', line 91

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:)


85
86
87
 
# File 'lib/bulma_phlex/card.rb', line 85

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


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

def head(title, classes: nil)
  warn "[DEPRECATION] `BulmaPhlex::Card#head` is deprecated. Use `header` instead.", category: :deprecated

  header(title, class: classes)
end

#header(title = nil, **html_attributes, &block) ⇒ Object

Sets the card header. Pass in the title as a string and/or provide a block to render custom content in the header.

  • title — The text to display in the card header (optional)
  • **html_attributes — Additional HTML attributes for the header element (optional)


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

def header(title = nil, **html_attributes, &block)
  @header_title = title
  @header_attributes = html_attributes
  @header_content = block
end

#html_header ⇒ Object

in order to use the method name header, we need to grab a reference to the method on the base class so it is still available to us



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

alias html_header header

#image(src:, alt: nil, size: nil, rounded: false) ⇒ Object 



68
69
70
 
# File 'lib/bulma_phlex/card.rb', line 68

def image(src:, alt: nil, size: nil, rounded: false)
  @image = BulmaPhlex::Image.new(src:, alt:, size:, rounded:)
end

#view_template ⇒ Object 



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

def view_template(&)
  vanish(&)

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