Skip to content

Subhead

Use the Subhead component for page headings.

Examples

Default

<%= render(Primer::SubheadComponent.new) do |component| %>
<% component.slot(:heading) do %>
My Heading
<% end %>
<% component.slot(:description) do %>
My Description
<% end %>
<% end %>

Without border

<%= render(Primer::SubheadComponent.new(hide_border: true)) do |component| %>
<% component.slot(:heading) do %>
My Heading
<% end %>
<% component.slot(:description) do %>
My Description
<% end %>
<% end %>

With actions

<%= render(Primer::SubheadComponent.new) do |component| %>
<% component.slot(:heading) do %>
My Heading
<% end %>
<% component.slot(:description) do %>
My Description
<% end %>
<% component.slot(:actions) do %>
<%= render(
Primer::ButtonComponent.new(
tag: :a, href: "http://www.google.com", button_type: :danger
)
) { "Action" } %>
<% end %>
<% end %>

Arguments

NameTypeDefaultDescription
spaciousBooleanfalseWhether to add spacing to the Subhead.
hide_borderBooleanfalseWhether to hide the border under the heading.
system_argumentsHashN/ASystem arguments

heading slot

NameTypeDefaultDescription
dangerBooleanfalseWhether to style the heading as dangerous.
system_argumentsHashN/ASystem arguments

actions slot

NameTypeDefaultDescription
system_argumentsHashN/ASystem arguments

description slot

NameTypeDefaultDescription
system_argumentsHashN/ASystem arguments