Adds an image section to a card. The image spans the full width of the card and can have a title overlaid on it.

Syntax

Result = MaterialSB::CardImage(Source.s, Parent = #Null)

Parameters

Source.s	The image URL or path.
Parent	Optional. Parent card element. If #Null, uses the current parent from the stack.

Return Value

Returns the card-image div element.

Remarks

Place CardImage() before CardContent() for a top image layout. You can add a CardTitle() inside the card-image section to overlay text on the image.

Example

Procedure Main(Success)
  If Success
    MaterialSB::Row(MaterialSB::#Grid_Container)
      ; Card with image at top
      MaterialSB::Col(12, 6, 4)
        MaterialSB::Card()
          MaterialSB::CardImage("https://picsum.photos/400/300")
          MaterialSB::CardContent()
            MaterialSB::CardTitle("Mountain View")
            MaterialSB::Append(MaterialSB::Paragraph("A beautiful mountain landscape captured at sunrise."))
          MaterialSB::CloseCurrentParent()
          MaterialSB::CardAction()
            MaterialSB::Append(MaterialSB::Link("View Gallery", #Null))
          MaterialSB::CloseCurrentParent()
        MaterialSB::CloseCurrentParent()
      MaterialSB::CloseCurrentParent()
      
      ; Another card with different image
      MaterialSB::Col(12, 6, 4)
        MaterialSB::Card()
          MaterialSB::CardImage("https://picsum.photos/400/301")
          MaterialSB::CardContent()
            MaterialSB::CardTitle("Ocean Waves")
            MaterialSB::Append(MaterialSB::Paragraph("Peaceful ocean scene with gentle waves."))
          MaterialSB::CloseCurrentParent()
          MaterialSB::CardAction()
            MaterialSB::Append(MaterialSB::Link("View Gallery", #Null))
          MaterialSB::CloseCurrentParent()
        MaterialSB::CloseCurrentParent()
      MaterialSB::CloseCurrentParent()
      
    MaterialSB::CloseCurrentParent()
  EndIf
EndProcedure

MaterialSB::Download(@Main())

See Also

Card(), CardContent(), CardTitle(), Image()