Overview
The RFI Hero is essentially the viewport hero modified and optimized to display the RFI alongside a hero/banner image element.
Online Bachelor of Business Administration (BBA)
Description paragraph. Caffeine coffee capuccino espresso breve bold medium roast blonde macchiato latte foam.
-
Request Information
Text Content Optional
Content is optional in the RFI Hero. You can choose:
- No content
- Minimal content: H1 only
- Full content: School, Faux Heading, H1, and description
PHP Code Snippet
<figure class="hero-viewport hero-rfi">
<section class="hero-spacer">
<header class="hero-header hero-darken hero-justify-start">
<span class="hero-school"><a href="#" rel="tag">School of Business</a></span>
<span class="hero-program">Business Administration</span>
<h1 class="hero-title"><span class="nowrap">Online Bachelor of Business Administration (BBA)</span></h1>
<p>Description paragraph. Caffeine coffee capuccino espresso breve bold medium roast blonde macchiato latte foam.</p>
</header>
</section>
<section class="hero-content hero-right hero-rfi-form">
<header class="hero-header hero-darken">
<?php include($GLOBALS["coreContentDir"] . "_forms/form-default.php"); ?>
</header>
</section>
</figure>
Usage
Wait on first review session.
Custom Image
RFI Hero imagery must be declared in the page using <style> tags:
<style>
/* declare custom image and positioning */
.hero-viewport.hero-rfi {
background-image: url(/common/images/banners/graduation-overview-test2-apu.jpg);
background-position: 30% 0;
}
@media only screen and (max-width: 800px) {
/* declare custom image, positioning, and desired min-height */
.hero-viewport.hero-rfi .hero-spacer:first-of-type {
background-image: url(/common/images/banners/graduation-overview-test2-apu.jpg);
background-position: top left;
min-height: 300px;
}
}
</style>