<div class="bux-panel">
<h5 class="bux-panel__heading">
Title of Panel
</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <br /><br />Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<a href="#" class="bux-button">Call to Action</a>
</div>
{#
Panel
Available variables:
- panel_heading_level: Integer value for the heading level of the panel title.
- panel_title: String for the panel title.
- panel_text: Content of the panel.
- link_url: URL of the panel link.
- link_text: String for the panel button.
#}
<div class="bux-panel">
<h{{ panel_heading_level|default(2) }} class="bux-panel__heading">
{{ panel_title }}
</h{{ panel_heading_level|default(2) }}>
<p>{{ panel_text }}</p>
<a href="{{ link_url }}" class="bux-button">{{ link_text }}</a>
</div>
site_name_prefix: Office of
site_name: Learning Relations Excellence
site_slogan: Additional text or site slogan
address_1: 100 Building Name
address_2: 1 Oval Mall
city: Columbus
state: OH
zip: '43210'
contact_email: email@osu.edu
contact_phone: 614-292-OHIO
contact_tty: 614-688-8605
panel_heading_level: 5
link_url: '#'
panel_title: Title of Panel
link_text: Call to Action
panel_text: >-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br /><br />Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat.
.bux-panel {
background-color: $gray-light-90;
padding: $sp-32;
.bux-button {
margin-top: $sp-16;
display: inline-block;
}
}
*.bux-panel__heading {
@extend .bux-h2;
margin-bottom: $sp-16;
}
No notes defined.