haskal
/
vagrant
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request #8302 from jasoncostello/website-update-typography 

Website typography update
This commit is contained in:
Chris Roberts 2017-02-27 09:50:38 -08:00 committed by GitHub
parent 86af6501ed 6e068b8c30
commit 519ca07850
13 changed files with 170 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
website/source/assets/images/logo-header.svg Normal file
View File

@ -0,0 +1,58 @@
<svg width="151px" height="45px" viewBox="325 -169 231 69" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<desc>HashiCorp Vagrant</desc>
<defs>
<polygon id="path-1" points="15.406 30.5511 15.406 0.0681 0.0451 0.0681 0.0451 30.5511 15.406 30.5511"></polygon>
<polygon id="path-3" points="0.8845 63 33.7715 63 33.7715 0.2315 0.8845 0.2315 0.8845 63"></polygon>
<polygon id="path-5" points="11.96035 0 0 0 0 13.918 23.9207 13.918 23.9207 0 11.96035 0"></polygon>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" transform="translate(325.000000, -169.000000)">
<polygon id="Fill-1" fill="#000000" points="104.9843 20.1001 111.2723 20.1001 101.7193 52.0711 92.7913 52.0711 83.2383 20.1001 89.5263 20.1001 97.2553 46.7431"></polygon>
<g id="Group-54">
<path d="M124.8076,43.2378 L120.4866,43.2378 C118.5666,43.2378 118.0386,43.7658 118.0386,45.5428 C118.0386,47.1748 118.5666,47.8938 120.3906,47.8938 C122.1196,47.8938 123.7036,47.3188 124.8076,46.6948 L124.8076,43.2378 Z M130.6636,52.0708 L125.8636,52.0708 L125.4316,50.4868 C123.3196,51.8788 120.8236,52.5508 118.4706,52.5508 C114.1986,52.5508 112.3736,49.6228 112.3736,45.5908 C112.3736,40.8378 114.4386,39.0128 119.1906,39.0128 L124.8076,39.0128 L124.8076,36.5658 C124.8076,33.9728 124.0866,33.0608 120.3426,33.0608 C118.2306,33.0608 115.9266,33.3488 113.8626,33.7808 L113.1426,29.3168 C115.3506,28.6448 118.5666,28.2128 121.1596,28.2128 C128.5036,28.2128 130.6636,30.8048 130.6636,36.6618 L130.6636,52.0708 Z" id="Fill-2" fill="#000000"></path>
<path d="M143.1914,32.9175 C140.3104,32.9175 139.3024,33.9735 139.3024,36.1815 L139.3024,37.9575 C139.3024,40.2625 140.4554,41.1255 143.1914,41.1255 C145.9754,41.1255 147.1274,40.2135 147.1274,37.9575 L147.1274,36.1815 C147.1274,33.9735 146.1194,32.9175 143.1914,32.9175 M141.8464,45.7825 C141.0794,46.2625 140.4554,46.9345 140.4554,47.6545 C140.4554,48.2785 140.8384,48.5665 141.7514,48.6625 C144.3424,48.9505 145.7834,49.0945 148.5194,49.3825 C152.3114,49.8145 153.5114,51.6875 153.5114,55.0475 C153.5114,60.0395 151.6874,62.0075 142.9514,62.0075 C140.2624,62.0075 136.5664,61.6235 133.9254,60.8075 L134.6464,56.4385 C137.1424,57.0635 139.7834,57.4465 142.5184,57.4465 C147.1754,57.4465 148.0874,57.1105 148.0874,55.5745 C148.0874,54.1355 147.6554,53.8955 145.8794,53.7025 C143.1914,53.4145 142.0874,53.2715 139.1104,52.9355 C135.7984,52.5515 134.5024,51.4465 134.5024,48.4705 C134.5024,46.5505 135.7984,45.3025 136.9504,44.4855 C134.7904,43.1895 133.7824,41.0295 133.7824,38.1975 L133.7824,35.9895 C133.8784,31.1415 136.4224,28.2125 143.1914,28.2125 C144.7754,28.2125 146.0234,28.4045 147.1754,28.6925 L154.3764,28.6925 L154.3764,31.6205 C153.5594,31.8605 152.5994,32.1015 151.7844,32.3415 C152.3114,33.3495 152.5994,34.6455 152.5994,35.9895 L152.5994,38.1975 C152.5994,42.9495 149.7194,45.8305 143.1914,45.8305 C142.7114,45.8305 142.2794,45.8305 141.8464,45.7825" id="Fill-4" fill="#000000"></path>
<path d="M169.0634,33.5893 C166.8074,34.5973 164.9834,35.6533 162.8714,36.9973 L162.8714,52.0703 L157.0144,52.0703 L157.0144,28.6933 L161.9594,28.6933 L162.3424,31.2843 C163.6384,30.4213 166.4224,28.7883 168.4874,28.2123 L169.0634,33.5893 Z" id="Fill-6" fill="#000000"></path>
<path d="M182.791,43.2378 L178.47,43.2378 C176.55,43.2378 176.022,43.7658 176.022,45.5428 C176.022,47.1748 176.55,47.8938 178.374,47.8938 C180.103,47.8938 181.687,47.3188 182.791,46.6948 L182.791,43.2378 Z M188.647,52.0708 L183.847,52.0708 L183.415,50.4868 C181.303,51.8788 178.807,52.5508 176.454,52.5508 C172.182,52.5508 170.357,49.6228 170.357,45.5908 C170.357,40.8378 172.422,39.0128 177.174,39.0128 L182.791,39.0128 L182.791,36.5658 C182.791,33.9728 182.07,33.0608 178.326,33.0608 C176.214,33.0608 173.91,33.3488 171.846,33.7808 L171.126,29.3168 C173.334,28.6448 176.55,28.2128 179.143,28.2128 C186.487,28.2128 188.647,30.8048 188.647,36.6618 L188.647,52.0708 Z" id="Fill-8" fill="#000000"></path>
<path d="M207.0312,52.0708 L207.0312,35.7498 C207.0312,34.5018 206.5032,33.8778 205.1592,33.8778 C203.7182,33.8778 201.1752,34.7418 199.0622,35.8448 L199.0622,52.0708 L193.2062,52.0708 L193.2062,28.6928 L197.6702,28.6928 L198.2462,30.6608 C201.1752,29.2208 204.8712,28.2128 207.6072,28.2128 C211.4952,28.2128 212.8872,30.9488 212.8872,35.1258 L212.8872,52.0708 L207.0312,52.0708 Z" id="Fill-10" fill="#000000"></path>
<g id="Group-14" transform="translate(215.000000, 22.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="Clip-13"></g>
<path d="M15.1181,29.6391 C13.8701,30.1661 11.4701,30.5511 9.9811,30.5511 C5.7101,30.5511 3.5501,28.5351 3.5501,24.3581 L3.5501,11.3491 L0.0451,11.3491 L0.0451,6.6931 L3.5501,6.6931 L3.5501,0.8841 L9.4061,0.0681 L9.4061,6.6931 L15.4061,6.6931 L15.0221,11.3491 L9.4061,11.3491 L9.4061,23.5901 C9.4061,24.8381 9.9811,25.6551 11.5171,25.6551 C12.3821,25.6551 13.4381,25.4621 14.4461,25.1741 L15.1181,29.6391 Z" id="Fill-12" fill="#000000" mask="url(#mask-2)"></path>
</g>
<g id="Group-17" transform="translate(32.000000, 5.000000)">
<mask id="mask-4" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<g id="Clip-16"></g>
<polygon id="Fill-15" fill="#1159CC" mask="url(#mask-4)" points="33.7715 6.4595 33.7715 0.2315 18.8235 8.9285 18.8235 14.1835 6.8655 39.9855 0.8845 44.1055 0.8845 63.0005 13.7025 55.6095"></polygon>
</g>
<g id="Group-20" transform="translate(0.000000, 5.000000)" fill="#127EFF">
<polygon id="Fill-18" points="14.9482 14.1831 14.9482 8.9291 0.0002 0.2321 0.0002 6.6471 5.9392 21.0701 8.9692 22.7801 8.9692 28.4281 20.1842 55.6671 32.8852 63.0001 32.8852 44.1061 26.9062 41.1171"></polygon>
</g>
<polygon id="Fill-21" fill="#127EFF" points="41.8545 8.7466 41.8545 14.7256 38.6725 21.7016 35.5645 29.1786 32.8845 35.6526 32.8845 43.1606 32.8845 43.1276 38.7685 46.1166 50.8235 19.1836 50.8235 13.9286"></polygon>
<polygon id="Fill-23" fill="#1159CC" points="32.8847 35.6528 23.9167 14.7258 23.9167 8.8098 23.8547 8.7778 14.9477 13.9288 14.9477 19.1828 26.9057 46.1168 32.8847 43.1608"></polygon>
<polygon id="Fill-25" fill="#127EFF" points="32.8847 42.6489 26.9057 46.1169 32.8847 49.5849 38.8647 46.1169"></polygon>
<g id="Group-29">
<mask id="mask-6" fill="white">
<use xlink:href="#path-5"></use>
</mask>
<g id="Clip-28"></g>
<polygon id="Fill-27" fill="#127EFF" mask="url(#mask-6)" points="8.9687 0 -0.0003 5.232 14.9477 13.918 23.9207 8.756"></polygon>
</g>
<polygon id="Fill-30" fill="#127EFF" points="56.8056 0 65.7746 5.232 50.8266 13.918 41.8536 8.756"></polygon>
<polygon id="Fill-32" fill="#3E96FF" points="32.8847 59.0679 29.8967 60.8009 32.8847 62.5359 35.8747 60.8009"></polygon>
<polygon id="Fill-34" fill="#0E65E5" points="29.8965 60.7856 32.8845 59.0566 32.8845 55.5896 29.8965 57.3176"></polygon>
<polygon id="Fill-36" fill="#0D59B5" points="35.875 60.7856 32.885 59.0566 32.885 55.5896 35.875 57.3176"></polygon>
<polygon id="Fill-38" fill="#3E96FF" points="49.4736 35.7212 49.4426 38.8722 52.1596 37.2972"></polygon>
<polygon id="Fill-40" fill="#0D59B5" points="52.1591 37.2827 49.4421 35.7117 52.1591 34.1317"></polygon>
<polygon id="Fill-42" fill="#3E96FF" points="6.6259 9.2412 3.6019 10.9752 6.5919 12.7092"></polygon>
<polygon id="Fill-44" fill="#0E65E5" points="3.6015 10.9595 6.5915 9.2305 6.5915 5.7625 3.6015 7.4915"></polygon>
<polygon id="Fill-46" fill="#0D59B5" points="6.5918 9.2305 6.5918 5.7625 9.5808 7.4915"></polygon>
<polygon id="Fill-48" fill="#3E96FF" points="22.7695 34.3379 19.7465 36.0719 22.7355 37.8049 25.7245 36.0719"></polygon>
<polygon id="Fill-50" fill="#0E65E5" points="19.7461 36.0561 22.7351 34.3271 22.7351 28.2001 19.7461 29.9291"></polygon>
<polygon id="Fill-52" fill="#0D59B5" points="25.7246 36.0561 22.7356 34.3271 22.7356 28.2001 25.7246 29.9291"></polygon>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
website/source/assets/images/vagrant_header_background.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 104 KiB

After

Width:  |  Height:  |  Size: 145 KiB

3
website/source/assets/stylesheets/_buttons.scss
View File

@ -14,9 +14,8 @@
text-decoration: none; text-decoration: none;
text-transform: uppercase; text-transform: uppercase;
font-size: 25px; font-size: 25px;
letter-spacing: 5px; letter-spacing: 2px;
@include museo-sans-light;
@include rounded; @include rounded;
@include hover; @include hover;

23
website/source/assets/stylesheets/_docs.scss
View File

@ -95,16 +95,11 @@ body.layout-intro {
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
/*> a:hover,
> a:focus {
font-weight: $font-weight-museo-sans-xb;
}*/
.nav { .nav {
display: block; display: block;
li.active a { li.active a {
font-weight: $font-weight-museo-sans-xb; font-weight: $font-weight-b;
} }
li a { li a {
@ -128,7 +123,7 @@ body.layout-intro {
} }
li.active a { li.active a {
font-weight: $font-weight-museo-sans-xb; font-weight: $font-weight-b;
} }
} }
} }
@ -136,8 +131,6 @@ body.layout-intro {
> a { > a {
text-transform: uppercase; text-transform: uppercase;
font-family: $font-family-museo-sans;
font-weight: $font-weight-museo-sans-sb;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
} }
@ -151,7 +144,6 @@ body.layout-intro {
> a { > a {
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
font-family: $font-family-museo-sans;
padding: 6px 15px; padding: 6px 15px;
} }
@ -165,7 +157,6 @@ body.layout-intro {
> a { > a {
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
font-family: $font-family-museo-sans;
} }
} }
} }
@ -174,7 +165,6 @@ body.layout-intro {
} }
} }
.bs-docs-section { .bs-docs-section {
padding-top: 10px; padding-top: 10px;
padding-left: 3%; padding-left: 3%;
@ -190,8 +180,7 @@ body.layout-intro {
p, li, .alert { p, li, .alert {
font-size: 20px; font-size: 20px;
font-family: $font-family-museo-sans; font-family: $font-family-open-sans;
font-weight: $font-weight-museo-sans;
line-height: 1.5em; line-height: 1.5em;
margin: 0 0 18px; margin: 0 0 18px;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
@ -206,6 +195,7 @@ body.layout-intro {
} }
a { a {
font-family: $font-family-open-sans;
color: $vagrant-blue; color: $vagrant-blue;
&:hover{ &:hover{
@ -220,6 +210,11 @@ body.layout-intro {
margin-bottom: 25px; margin-bottom: 25px;
} }
h1, h2, h3, h4, h5 {
font-family: $font-family-open-sans;
font-weight: $font-weight-b;
}
h1 { h1 {
color: $vagrant-blue; color: $vagrant-blue;
text-transform: uppercase; text-transform: uppercase;

25
website/source/assets/stylesheets/_global.scss
View File

@ -10,21 +10,18 @@ text-rendering: optimizeLegibility;
body { body {
font-size: 18px; font-size: 18px;
color: $black; color: $black;
font-weight: 300; font-weight: 400;
} }
h1 { h1 {
font-size: 42px; font-size: 48px;
line-height: 42px; line-height: 1;
font-family: $font-family-museo-sans;
font-weight: $font-weight-museo-sans-sb;
margin-bottom: 24px; margin-bottom: 24px;
} }
h2 { h2 {
text-transform: uppercase; font-size: 36px;
font-family: $font-family-museo-sans; line-height: 1.2;
font-weight: $font-weight-museo-sans-sb;
margin-top: 70px; margin-top: 70px;
} }
@ -33,10 +30,12 @@ h1 + h2 {
} }
h3 { h3 {
font-size: 28px; font-size: 24px;
line-height: 28px; line-height: 1.2;
font-family: $font-family-museo-sans; }
font-weight: $font-weight-museo-sans-sb;
p, a {
font-family: $font-family-open-sans;
} }
.highlight{ .highlight{
@ -48,7 +47,7 @@ pre {
color: $white; color: $white;
font-size: 14px; font-size: 14px;
font-weight: normal; font-weight: normal;
font-family: $font-family-monospace; font-family: $font-family-mono;
border: none; border: none;
padding: 20px; padding: 20px;
margin-bottom: 0; margin-bottom: 0;

34
website/source/assets/stylesheets/_header.scss
View File

@ -13,13 +13,13 @@
.navbar-brand { .navbar-brand {
.logo { .logo {
width: $project-logo-width; width: $project-logo-width;
height: $header-height;
padding: 0; padding: 0;
line-height: $header-height; line-height: $header-height;
background-position: 0 center;
font-size: 0; font-size: 0;
text-transform: uppercase; text-transform: uppercase;
@include img-retina("logo-header.png", "logo-header@2x.png", $project-logo-width, $project-logo-height); background: image-url("logo-header.svg") center no-repeat;
background-position: 0 center; background-size: 100%;
&:hover{ &:hover{
opacity: .4; opacity: .4;
@ -44,23 +44,27 @@
} }
} }
@media (min-width: 769px) and (max-width: 805px) {
#header {
.main-links,
.external-links {
li > a {
font-size: 12px;
}
}
}
}
@media (max-width: 414px) { @media (max-width: 414px) {
#header { #header {
.navbar-brand { .navbar-brand {
.logo{ .logo{
width: $project-logo-width * .75; width: $project-logo-width * .75;
@include img-retina("logo-header.png", "logo-header@2x.png", $project-logo-width * .75, $project-logo-height * .75); height: $header-mobile-height;
} }
}
} .by-hashicorp {
} margin-top: 2px;
@media (max-width: 320px) {
#header {
.navbar-brand {
.logo{
} }
} }
} }

65
website/source/assets/stylesheets/_home.scss
View File

@ -1,11 +1,20 @@
.page-home { .page-home {
h1 {
h1, h2, h3, h4, h5 {
color: $purple-text;
font-family: $font-family-klavika;
text-transform: uppercase;
text-align: center; text-align: center;
} }
p {
color: $purple-text;
}
.hero { .hero {
@include padded; @include padded;
background: $gray-background image-url("vagrant_header_background.png") no-repeat center -80px; background: $gray-background image-url("vagrant_header_background.png") no-repeat center -20px;
background-size: 1292px 532px;
text-align: center; text-align: center;
border-bottom: 1px solid #c6e0f0; border-bottom: 1px solid #c6e0f0;
@ -17,22 +26,13 @@
text-shadow: 0 1px 10px rgba(255, 255, 255, 0.4); text-shadow: 0 1px 10px rgba(255, 255, 255, 0.4);
h1 { h1 {
@include museo-sans-light;
color: $purple-text; color: $purple-text;
font-size: 55px; line-height: 1;
font-weight: 700; margin-top: 350px;
line-height: 60px;
margin-bottom: ($baseline * 4);
} }
h2 { p {
@include museo-sans-light; color: $vagrant-blue;
color: $blue-text;
font-size: 28px;
font-weight: 100;
letter-spacing: 1.6px;
line-height: 40px;
text-transform: none;
} }
} }
@ -50,12 +50,8 @@
@include padded; @include padded;
background: $light-blue-background image-url("steps_background.png") center -120px; background: $light-blue-background image-url("steps_background.png") center -120px;
h1 { h2 {
color: $blue-text; color: $blue-text;
text-transform: uppercase;
text-align: center;
font-size: 40px;
line-height: 50px;
} }
hgroup { hgroup {
@ -63,18 +59,13 @@
// width: 530px; // width: 530px;
h3 { h3 {
text-align: center; font-weight: bold;
text-transform: uppercase;
font-size: 40px;
margin-bottom: $baseline; margin-bottom: $baseline;
color: $purple-text;
@include museo-sans-light;
} }
h4 { h4 {
font-size: 20px; font-size: 20px;
line-height: $baseline * 1.5; line-height: $baseline * 1.5;
@include museo-sans-light;
} }
} }
} }
@ -83,7 +74,7 @@
@include padded; @include padded;
@include get-started-bg; @include get-started-bg;
h1 { h2 {
color: $white; color: $white;
} }
@ -100,9 +91,8 @@
background-color: $black; background-color: $black;
border-bottom: 1px solid #333; border-bottom: 1px solid #333;
h1 { h2 {
color: $dark-gray-text; color: $dark-gray-text;
@include museo-sans-light;
} }
.customer-logos { .customer-logos {
@ -135,3 +125,20 @@
} }
} }
} }
@media (max-width: 480px) {
.page-home {
.hero {
background: $gray-background image-url("vagrant_header_background.png") no-repeat center -60px;
background-size: 1292px 532px;
.hero-content {
hgroup {
h1 {
margin-top: 280px;
}
}
}
}
}
}

15
website/source/assets/stylesheets/_variables.scss
View File

@ -38,11 +38,10 @@ $primary-button-color: #48b4fb;
// Typography // Typography
// ------------------------- // -------------------------
$font-family-museo-sans: "Museo Sans", "Helvetica Neue", helvetica, arial, sans-serif; $font-family-open-sans: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
$font-weight-museo-sans-xl: 100; $font-family-klavika: "klavika-web", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
$font-weight-museo-sans-reg: 300; $font-family-mono: "Courier New", Monaco, Menlo, Consolas, monospace;
$font-weight-museo-sans-sb: 500; $font-weight-l: 300;
$font-weight-museo-sans-xb: 700; $font-weight-reg: 400;
$font-weight-museo-sans: $font-weight-museo-sans-reg; $font-weight-b: 600;
$font-weight-xb: 700;
$font-family-monospace: "Courier New", monospace;

1
website/source/assets/stylesheets/application.scss
View File

@ -3,6 +3,7 @@
@import "bootstrap"; @import "bootstrap";
// Remote fonts // Remote fonts
@import url("//fonts.googleapis.com/css?family=Open+Sans:300,400,600");
@import url("//fonts.googleapis.com/css?family=Inconsolata:400,700"); @import url("//fonts.googleapis.com/css?family=Inconsolata:400,700");
// Core variables and mixins // Core variables and mixins

13
website/source/assets/stylesheets/hashicorp-shared/_hashicorp-utility.scss
View File

@ -3,12 +3,11 @@
// //
// Notes: // Notes:
// - Include this in Application.scss before header and feature-footer // - Include this in Application.scss before header and feature-footer
// - museo-sans Google (Semibold - 600) font needs to be included if not already // - Open Sans and Klavika fonts needs to be included if not already
// -------------------------------------------------- // --------------------------------------------------
// Variables // Variables
$font-family-museo-sans: 'museo-sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; $header-font-family: $font-family-open-sans;
$header-font-family: $font-family-museo-sans;
$header-font-weight: 600; // semi-bold $header-font-weight: 600; // semi-bold
$header-height: 74px; $header-height: 74px;
@ -63,22 +62,22 @@ $nav-margin-right: 12px;
} }
@mixin open-light() { @mixin open-light() {
font-family: $font-family-museo-sans; font-family: $font-family-open-sans;
font-weight: 300; font-weight: 300;
} }
@mixin open() { @mixin open() {
font-family: $font-family-museo-sans; font-family: $font-family-open-sans;
font-weight: 400; font-weight: 400;
} }
@mixin open-sb() { @mixin open-sb() {
font-family: $font-family-museo-sans; font-family: $font-family-open-sans;
font-weight: 600; font-weight: 600;
} }
@mixin open-bold() { @mixin open-bold() {
font-family: $font-family-museo-sans; font-family: $font-family-open-sans;
font-weight: 700; font-weight: 700;
} }

4
website/source/assets/stylesheets/hashicorp-shared/_project-utility.scss
View File

@ -4,7 +4,7 @@
// -------------------------------------------------- // --------------------------------------------------
// Variables // Variables
$project-logo-width: 147px; $project-logo-width: 151px;
$project-logo-height: 40px; $project-logo-height: 45px;
$project-logo-pad-left: 0px; $project-logo-pad-left: 0px;
$header-height: 80px; $header-height: 80px;

30
website/source/index.html.erb
View File

@ -11,10 +11,10 @@ description: |-
<div class="hero-content"> <div class="hero-content">
<div class="row"> <div class="row">
<div class="col-md-8 col-md-offset-2"> <div class="col-md-12">
<hgroup> <hgroup>
<h1>Development<br>environments<br>made easy.</h1> <h1>Development environments made easy.</h1>
<h2>Create and configure lightweight, reproducible, and portable development environments.</h2> <p>Create and configure lightweight, reproducible, and portable development environments.</p>
</hgroup> </hgroup>
</div> </div>
</div> </div>
@ -39,31 +39,31 @@ description: |-
<section class="why-vagrant"> <section class="why-vagrant">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<h1 class="col-md-12"> <h2 class="col-md-12">
Vagrant will change how you work Vagrant will change how you work
</h1> </h2>
</div> </div>
<div class="row"> <div class="row">
<div class="col-sm-8 col-sm-offset-2"> <div class="col-sm-8 col-sm-offset-2">
<hgroup> <hgroup>
<h3>Set Up</h3> <h3>Set Up</h3>
<h4> <p>
Download and install Vagrant within minutes on Mac OS X, Windows, or a popular distribution of Linux. No complicated setup process, just a simple to use OS-standard installer. Download and install Vagrant within minutes on Mac OS X, Windows, or a popular distribution of Linux. No complicated setup process, just a simple to use OS-standard installer.
</h4> </p>
</hgroup> </hgroup>
<hgroup> <hgroup>
<h3>Configure</h3> <h3>Configure</h3>
<h4> <p>
Create a single file for your project to describe the type of machine you want, the software that needs to be installed, and the way you want to access the machine. Store this file with your project code. Create a single file for your project to describe the type of machine you want, the software that needs to be installed, and the way you want to access the machine. Store this file with your project code.
</h4> </p>
</hgroup> </hgroup>
<hgroup> <hgroup>
<h3>Work</h3> <h3>Work</h3>
<h4> <p>
Run a single command &mdash; "vagrant up" &mdash; and sit back as Vagrant puts together your complete development environment. Say goodbye to the "works on my machine" excuse as Vagrant creates identical development environments for everyone on your team. Run a single command &mdash; "vagrant up" &mdash; and sit back as Vagrant puts together your complete development environment. Say goodbye to the "works on my machine" excuse as Vagrant creates identical development environments for everyone on your team.
</h4> </p>
</hgroup> </hgroup>
</div> </div>
</div> </div>
@ -75,9 +75,9 @@ description: |-
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h1 class="all-caps"> <h2 class="all-caps">
See how easy it is See how easy it is
</h1> </h2>
<pre> <pre>
$ vagrant init hashicorp/precise64 $ vagrant init hashicorp/precise64
$ vagrant up $ vagrant up
@ -98,9 +98,9 @@ $ vagrant up
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="customers-content col-md-12"> <div class="customers-content col-md-12">
<h1 class="all-caps"> <h2 class="all-caps">
Trusted by Trusted by
</h1> </h2>
<div class="customer-logos"> <div class="customer-logos">
<%= image_tag "customers.png", alt: "customers", width: 941, height: 111 %> <%= image_tag "customers.png", alt: "customers", width: 941, height: 111 %>
</div> </div>

4
website/source/layouts/_header.erb
View File

@ -29,6 +29,10 @@
})(window,document,'script','dataLayer','GTM-NR2SD7C');</script> })(window,document,'script','dataLayer','GTM-NR2SD7C');</script>
<!-- End Google Tag Manager --> <!-- End Google Tag Manager -->
<!-- Typekit script to import Klavika font -->
<script src="https://use.typekit.net/wxf7mfi.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<%= yield_content :head %> <%= yield_content :head %>
</head> </head>