Skip to content

Instantly share code, notes, and snippets.

@jasonjflaherty

jasonjflaherty/index.html

Created April 17, 2019 19:25
Show Gist options
  • Save jasonjflaherty/92aa97d1c7cc8fc67707ae163e262520 to your computer and use it in GitHub Desktop.
Save jasonjflaherty/92aa97d1c7cc8fc67707ae163e262520 to your computer and use it in GitHub Desktop.
Download ZIP
USWDS Hero Tablet, Mobile and Desktop Grid Review
Raw
index.html
<section class="usa-hero">
<div class="grid-container">
<div class="grid-row">
<div class="usa-hero__callout rd-hero__callout desktop:grid-col-4 desktop:grid-offset-8 tablet:grid-col-6 tablet:grid-offset-6 grid-col-12 grid-offset-none">
<h1 class="text-base-darker usa-hero__heading"><span class="text-green">Seven</span> Research
Stations and <span class="text-green">81</span> Experimental Forests and Ranges.</h1>
<a class="usa-button usa-button--secondary" href="javascript:void(0)"><small>Learn more about
what we do</small> </a>
</div>
</div>
</div>
</section>
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.0.1/js/uswds.min.js"></script>
Raw
style.scss
.rd-hero__callout{background:rgba(white,.9)}
Raw
styles
<link href="https://cdnjs.cloudflare.com/ajax/libs/uswds/2.0.1/css/uswds.min.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment