quick-start
wm-atomic-docs
installation
css-classes
colors
colors-row-themes
javascript-modules
row-components
git-usage
git-fixing-mistakes
git-cheatsheet
how-tos
site-structure
site-variables
bem-resources
sass-resources
link-elements
list-elements
normalize
fancybox
print
cheatsheet-functions-and-mixins
function-color
function-font
function-px-to-rem
function-remove-unit
function-spacing
mixin-banner-heights
mixin-breakpoints
mixin-button-styles
mixin-color-theme
mixin-fluid-anything
mixin-link-styles
mixin-menu-open-closed-styles
mixin-right-arrow
mixin-social-media-icons
wm-breakpoints
breakpoint-cheatsheet
wm-colors
vims-colors
wm-font-families
wm-spacing
wm-widths-and-heights
wm-z-indexes
wm-border
wm-element-styles
location-array
heading-specs
listing-specs
background-image
heights
switch
sr-only
theme-colors
wm-helper-min-js
wm-plugins-js
wm-shortcodes-js
perfect-scrollbar
wm-main-js
wm-secondary-js
adjust-row-card-height
event-row-js
news-feed-js
tiny-slider-js
wm-row-slideshow-js
global
headings
text-treatments
buttons
links
lists
tables
forms
images
svg-caret-white
wm-row-base-component
wm-split-layout-component
wm-row-buttons
wm-cards-component
wm-description-text-component
wm-card-component
wm-text-card-component
wm-image-card
wm-statnum-component
themes
listing-layout
main-layout
sharebar
alert
boxcopy
breadcrumbs
broadcast-bar
buttons-wm
bxSlider
default-extra-announcements
default-extra-events
default-extra-features
default-extra-news
directory-with-photo-grid
dropdown
emergency-info
figure
figure-responsive
figure-icon
galleria-gallery-slideshow
header
horiz-nav
lightbox
lightbox-content
listing-page-item
news-home-latest-news
news-home-top-stories
photoset
rrssb
search-form
search-results
sidebar-listboxes
sidebar-news-events-rss
sidebar-news-home-video
sidebar-news-press-releases
sidebar-news-wminthenews
sidebar-widgets
table-collapsible
tables-wm
text
wysiwg-photos
youtube-embeds
examples-listboxes-widgets
examples-listings
examples-headings
-user-content-styles
announcement-content
atoz-listing
campus-map-content
content-page-content
directory-content
_experts-content
feature-page-content
full-page-content
gallery-page-content
gateway-page-content
grid-classic
grid-classic-right-col
grid-classic-rows
grid-classic-multisize
grid-classic-multisize-right-col
grid-flow
grid-flow-right-col
grid-flow-titles
grid-flow-captions
_ideation-story-content
_ideation-story-header-content
listing-page-announcements
listing-page-children
listing-page-directory
listing-page-features
listing-page-files
listing-page-news-stories
listing-page-portfolio
multimedia-grid-content
news-home
news-story-content
portfolio
row
sidebar
slideshow-research
tr-form-content
youtube-playlist
embed-row
button-bar-row
_base-row
accordion-list-row
announcements-row
callout
contact-place
content-row
events
fiftyfifty
icons
links-row
news-feed-row
search-row
statistics
video-feature
homepage-hero
homepage-admission
homepage-programs
homepage-stats
topbar-logo-homepage
menu-banner
topbar-logo-section
topbar
banner
banner-medium
banner-tall
banner-super
chosen
footer
info-for-menu
page-nav
page-nav-ideation
page-nav-news
page-nav-social-buttons
site-menu
AtoZ-Listing-template
Campus-Map-Location-template
Content-Page-template
_Experts-Page-template
Feature-Page-template
Full-Page-template
Gallery-Page-template
Gateway-Page-template
Gateway-Page-left-nav-template
_Ideation-story-template
Landing-Page-template
Multimedia-Grid-template
News-Media-Home-template
News-Story-template
Slideshow-Page-template
Paste-N-Test-template
WM-Homepage-template
Announcement
AtoZ-Listing
Campus-Map-Location
Content-Page
Content-Page-2-Columns
Content-Page-Grid-all-versions
Content-Page-Grid-Classic
Content-Page-Grid-Masonry
Directory-Page
_Experts-Page
Feature-Page
Full-Page
Gallery-Page
Gateway-Page
Gateway-Page-left-nav
_Ideation-Story
Landing-Page
Listing-Page-Announcements
Listing-Page-Children
Listing-Page-Directory
Listing-Page-Features
Listing-Page-Files
Listing-Page-News-Stories
Listing-Page-Portfolio
Multimedia-Grid
_News-Media-Home
News-Story
Portfolio-Page
Slideshow-Page
YouTube-Playlist
Paste-N-Test
WM-Homepage
wm-cheatsheet
vims-cheatsheet
6-page-content-elements
edit
header
edit
header.m-title
Home
Notice
: Undefined variable: subtitle in
/www/virtualhosts/htdocs/creative.wm.edu/public_html/atomic-docs/wm/components/6-page-content-elements/header.php
on line
6
HTML
Output
SCSS
Add a javascript file
Expand
Copy
Edit
<!-- components/6-page-content-elements/header.php --> <header class="m-title"> <h1 class="m-title__main-title"><?php echo $title; ?></h1> <?php if ($subtitle != '') { ?> <p class="m-title__sub-title"><?php echo $subtitle; ?></p> <?php }; ?> </header>
Copy
Copy
Edit
/* scss/6-page-content-elements/_header.scss */ .m-title { margin-bottom: 1.2rem; } .m-title__main-title, #expertProfile #person_name { margin: 0 0 5px 0; letter-spacing: 0; color: var(--color-wmgreen-90); font-family: font(alt-heading-serif); font-size: 2.04rem; font-weight: font(alt-heading-weight, medium); line-height: 1.2; font-feature-settings: "lnum"; @include breakpoint($mobile-to-wide-mobile-breakpoint) { font-size: 40px; } } .m-title__sub-title { margin: 0 0 $md-content-margin 0; letter-spacing: 0.03em; color: var(--color-wmgreen-90); font-family: font(heading-serif-italic); font-weight: font(serif-weight, medium); font-size: 1.48rem; font-style: italic; line-height: 1.2; font-feature-settings: "lnum"; }