Skill Level: 
Intermediate

4.1 styles mapped to 5.0 classes

Bands

  • #maincontent#dcf-main
  • .wdn-main.dcf-main
  • .wdn-band.dcf-bleed
  • .wdn-text-band.dcf-measure
  • .wdn-inner-wrapper.dcf-wrapper
  • .wdn-inner-padding-sm.dcf-pt-8 + .dcf-pb-8
  • .wdn-inner-padding-lg.dcf-pt-10 + .dcf-pb-10
  • .wdn-inner-padding-no-top.dcf-pt-0
  • .wdn-inner-padding-no-bottom.dcf-pb-0
  • .wdn-inner-padding-none.dcf-pt-0 + .dcf-pb-0
  • .wdn-stretch.dcf-bleed
  • .wdn-center.dcf-txt-center
  • .wdn-scarlet-band.unl-bg-scarlet
  • .wdn-light-complement-band.unl-bg-light-gray
  • .wdn-light-triad-band.unl-bg-lighter-gray
  • .wdn-light-neutral-band.unl-bg-lightest-gray
  • .wdn-band-triad-seperator
  • .wdn-band-complement-seperator
  • .wdn-band-neutral-seperator

Base

  • .wdn-main.dcf-main

Breadcrumbs

  • #breadcrumbs
  • .last-link
  • .selected
  • .storednav
  • .js
  • .flexslider
  • .slides

Columns

  • .wdn-two-flow-columns.dcf-columns-2
  • .wdn-three-flow-columns.dcf-columns-3

Display

  • template.dcf-d-none
  • [hidden].dcf-d-none
  • .wdn-dropdown-widget-button.dcf-d-none
  • .wdn-nav-toggle.dcf-d-none
  • .wdn-share-options.dcf-d-none
  • #wdn_idm_notice_container.dcf-d-none
  • #wdn_search_form button.dcf-d-none
  • #wdn_search_progress.dcf-d-none
  • #wdn_search_frame.dcf-d-none
  • #navigation li.empty.dcf-d-none
  • #navigation .wdn-icon-menu.dcf-d-none
  • #wdn_menu_toggle.dcf-d-none
  • .wdn-menu-trigger label.dcf-d-none
  • #footer#dcf-footer
  • .wdn-icon-container
  • .wdn-footer-optional
  • .wdn-footer-local
  • .wdn-contact-info
  • .wdn-related-links
  • .wdn-footer-global
  • .wdn-footer-list
  • .wdn-footer-end
  • .wdn-footer-text
  • .wdn-wdn-qa
  • .wdn-copyright-phone
  • .wdn-footer-logo
  • #tips_wordmark
  • #nebraska-b1g-lockup
  • #footer_n_logo#unl-footer-n
  • #b1g_wordmark#unl-footer-global-b1g
  • #unl_wordmark#unl-footer-global-wordmark

Forms

  • .wdn-std
  • .wdn-input-group.dcf-input-group
  • .wdn-input-group-btn
  • .wdn-webform-opt-out
  • .required
  • .helper
  • .wdn-button.dcf-btn
  • .wdn-button-triad
  • .wdn-button-complement
  • .wdn-button-brand.dcf-btn + .dcf-btn-primary
  • .wdn-button-energetic
  • .wdn-button-outline.dcf-btn + .dcf-btn-inverse-secondary

Grid

  • .wdn-grid-set.dcf-grid
  • .wdn-col-*.dcf-col-*

Header

  • #header#dcf-header
  • #wdn_header_top
  • #wdn_institution_title#dcf-institution-title
  • #wdn_logo_lockup
  • #logo#dcf-header-logo
  • #wdn_site_affiliation#dcf-site-affiliation
  • #wdn_site_title#dcf-site-title

Helpers

  • .centered
  • .clear.dcf-clear-both
  • .clear-top.dcf-mt-0
  • .hidden.dcf-d-none
  • .wdn-fouc-fix.dcf-invisible
  • .wdn-pull-left.dcf-float-left
  • .wdn-pull-right.dcf-float-right
  • .wdn-responsive-embed
  • .wdn-aspect16x9.dcf-ratio-16x9
  • .wdn-aspect3x4.dcf-ratio-4x3
  • .wdn-responsive-item.dcf-ratio-child
  • .wdn-text-hidden.dcf-sr-only

Hero

  • .wdn-hero
  • .wdn-hero-text-container
  • .locate-left
  • .locate-center
  • .locate-right
  • .wdn-hero-heading
  • .wdn-hero-initial-line
  • .wdn-hero-impact-line
  • .wdn-hero-video
  • .wdn-hero-picture

IdM

  • .wdn-reousrce-login-trigger
  • .nav-scrolling
  • #wdn_idm_notice_container
  • #wdn_idm_toggle_label
  • #wdn_idm_username
  • .wdn-idm-options

Images

  • .frame
  • .wdn-frame

Infographic

  • .number

Infographics (plural in /modules Less directory)

  • .stat
  • .stat-helper
  • .wdn-infographic
  • .wdn-infographic-*

Navigation

  • .skipnav.dcf-skipnav
  • #wdn_navigation_bar
  • #navigation#dcf-navigation
  • .wdn-content-slide
  • .wdn-icon-menu
  • .empty-secondary
  • .wdn-nav-toggle
  • li.empty
  • .wdn-menu-trigger
  • .nav-scrolling
  • .nav_ready
  • .nav_collapsed
  • .nav_expanded
  • .nav_changing
  • .pause
  • .js
  • .wdn-menu-trigger
  • #wdn_menu_toggle

Noscript

  • #wdn_noscript#dcf-noscript
  • #wdn_noscript_padding

Old Grid

  • .grid1.grid12
  • .first

Pagination

  • .wdn_pagination
  • .ellipsis
  • .selected

Promo Image

  • .wdn-promo-band
  • .wdn-promo-container
  • .wdn-promo-text
  • .wdn-inverse
  • .wdn-text-over-image

Quote

  • .wdn-quote.dcf-blockquote
  • .wdn-quoter.dcf-attribution
  • .quoter-context

Regions

  • .hide-wdn_institution_title.dcf-d-none
  • .hide-wdn_identity_management.dcf-d-none
  • .hide-wdn_search.dcf-d-none
  • .hide-wdn_navigation_wrapper
  • .hide-breadcrumbs.dcf-d-none
  • .hide-pagetitle.dcf-sr-only
  • .hide-footer.dcf-d-none
  • .hide-wdn_footer_related.dcf-d-none
  • .hide-wdn_copyright.dcf-d-none
  • .hide-wdn_footer_contact.dcf-d-none
  • .hide-wdn_attribution.dcf-d-none
  • .hide-wdn_logos.dcf-d-none
  • .terminal

Resources

  • .wdn_randomizer
  • .show
  • .wdn-resource-label
  • .wdn-reource-app-trigger
  • .wdn-resource-label
  • #wdn_resources
  • #wdn_search_form
  • #wdn_search_query
  • #wdn_search
  • .nav-scrolling
  • .wdn-icon-search
  • #wdn_search_progress
  • #wdn_search_frame
  • #wdn_search_toggle_label

Share

  • .wdn-share-this-page
  • .js
  • .nav-scrolling
  • .nav_ready
  • .wdn-dropdown-widget-button
  • .wdn-icon-share
  • .wdn-share-options

Tables

  • .wdn_responsive_table
  • .flush-left
  • table.primary, table.wdn_responsive_table.primary
  • table.cool, table.wdn_responsive_table.cool
  • table.soothing, table.wdn_responsive_table.soothing
  • table.neutral, table.wdn_responsive_table.neutral
  • table.energetic, table.wdn_responsive_table.energetic

Tabs

  • .wdn_tabs
  • li.selected
  • .wdn_tabs_content

Text

  • .wdn-brand
  • .wdn-sans-serif.unl-font-sans
  • .wdn-list-reset.dcf-list-bare
  • .wdn-heading
  • .wdn-impact
  • .wdn-brand-cap
  • .wdn-sans-caps.unl-font-sans + .dcf-uppercase
  • .wdn-alt-header.unl-font-sans + .dcf-uppercase
  • .wdn-list-header.unl-font-sans + .dcf-uppercase
  • .wdn-subhead.dcf-subhead
  • .wdn-intro-p.dcf-lead
  • p.small.dcf-txt-xs
  • .wdn-icon-*

Twitter

  • .twitter-band
  • .tweet
  • .author

WDN UI

  • .wdn-dropdown-widget-button
  • .wdn-dropdown-widget-button-no-outline

Wrapper

  • #wdn_wrapper.dcf-overflow-hidden
  • .wdn-input-driver.dcf-sr-only

Zenbox

  • .zenbox
Contributed By: 
IIM