Merge pull request #1606 from coreos-inc/landing-page

New landing page header and logos
This commit is contained in:
josephschorr 2016-07-11 15:51:50 -04:00 committed by GitHub
commit 98e1d833e7
13 changed files with 180 additions and 53 deletions

View file

@ -27,19 +27,27 @@
.landing.jumbotron h1 {
margin-bottom: 30px;
font-size: 50px;
font-size: 40px;
line-height: 60px;
font-weight: 200;
}
.landing.jumbotron h2 {
margin-bottom: 60px;
font-size: 26px;
font-weight: 300;
line-height: 36px;
.landing-content h1 .highlight {
display: inline-block;
padding-left: 10px;
padding-right: 10px;
color: #38b3e7;
}
.landing.jumbotron h1 .bracket {
font-size: 60px;
vertical-align: text-bottom;
}
.landing.jumbotron .buttons {
margin-bottom: 70px;
margin-top: 60px;
margin-bottom: 80px;
}
.landing.jumbotron .buttons .btn {
@ -130,10 +138,34 @@
font-weight: 200;
}
.landing-page .tour-overview {
.landing-section h3 {
text-align: center;
display: block;
margin-bottom: 30px;
font-weight: 200;
}
.landing-page .trusted-logo-large {
line-height: 60px;
text-align: center;
}
.landing-page .trusted-logo-large img {
max-width: 250px;
max-height: 60px;
}
.landing-page .trusted-logo-medium {
line-height: 45px;
text-align: center;
}
.landing-page .trusted-logo-medium img {
max-width: 125px;
max-height: 45px;
}
.landing-page .tour-overview img {
width: 500px;
padding: 10px;

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 648 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

View file

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8 KiB

View file

@ -1,8 +1,7 @@
<div class="jumbotron landing">
<div class="landing-background"></div>
<div class="landing-content">
<h1>Build, Store and Distribute your Containers</h1>
<h2>Powerful Build Triggers. Advanced Team Permissions. Secure Storage.</h2>
<h1>Quay <span class="bracket">[</span><span class="highlight">builds, analyzes, distributes</span><span class="bracket">]</span> your container images</h1>
<div class="buttons">
<a href="/plans?trial-plan=free" class="btn highlighted">Try it for free</a>
<a href="/plans" class="btn">View plans</a>
@ -17,56 +16,48 @@
</div> <!-- jumbotron -->
<div class="rows">
<div class=" shoutout-row landing-section">
<div class="cor-container">
<div class="row">
<div class="col-md-4 shoutout">
<i class="fa fa-lock"></i>
<a class="shoutout-link" href="/tour/features">Private Storage</a>
<span class="shoutout-expand">
Push and pull Docker and rkt images to a private registry, with a focus on user experience
for your developers.
</span>
</div>
<div class="col-md-4 shoutout">
<i class="fa fa-group"></i>
<a class="shoutout-link" href="/tour/organizations">Teamwork Optimized</a>
<span class="shoutout-expand">
Specially designed for organizations with multiple teams that manage their own containers and permissions.
</span>
</div>
<div class="col-md-4 shoutout">
<i class="fa fa-cogs"></i>
<a class="shoutout-link" href="http://docs.quay.io/solution">Deployment Made Easy</a>
<span class="shoutout-expand">
Integrations with GitHub and other tools to make deployments simple and automated.
</span>
</div>
</div>
</div>
</div> <!-- -->
<div class="landing-section">
<h2>Trusted by companies who use Docker</h2>
<h3>Trusted by companies of all sizes</h3>
<div class="cor-container">
<div class="row">
<div class="trusted-logos">
<div class="col-md-3 trusted-logo">
<a href="http://www.modcloth.com" ng-safenewtab alt="ModCloth"><img src="/static/img/modcloth-logo.png"></a>
<div class="trusted-logos-large">
<div class="col-md-3 trusted-logo-large">
<a href="http://www.jpl.nasa.gov/" ng-safenewtab alt="JPL"><img src="/static/img/logos/jpl-logo.png"></a>
</div>
<div class="col-md-3 trusted-logo">
<a href="https://travis-ci.com" ng-safenewtab alt="Travis CI"><img src="/static/img/travisci-logo.png"></a>
<div class="col-md-3 trusted-logo-large">
<a href="https://www.intuit.com" ng-safenewtab alt="Intuit"><img src="/static/img/logos/intuit-logo.gif"></a>
</div>
<div class="col-md-3 trusted-logo apptentive">
<a href="http://www.apptentive.com" ng-safenewtab alt="Apptentive"><img src="/static/img/apptentive-logo.svg"></a>
<div class="col-md-3 trusted-logo-large">
<a href="http://www.ebay.com" ng-safenewtab alt="eBay"><img src="/static/img/logos/ebay-logo.png"></a>
</div>
<div class="col-md-3 trusted-logo">
<a href="https://www.aptible.com" ng-safenewtab alt="Aptible"><img src="/static/img/aptible-logo.png" style="width: 200px;"></a>
<div class="col-md-3 trusted-logo-large">
<a href="http://www.hotels.com" ng-safenewtab alt="Hotels.com"><img src="/static/img/logos/hotelscom-logo.jpg"></a>
</div>
</div>
</div>
</div> <!-- /row -->
<div class="row" style="margin-top: 40px;">
<div class="trusted-logos-medium">
<div class="col-md-2 trusted-logo-medium">
<a href="http://www.qualcomm.com" ng-safenewtab alt="Qualcomm"><img src="/static/img/logos/qualcomm-logo.png"></a>
</div>
<div class="col-md-2 trusted-logo-medium">
<a href="http://www.yammer.com" ng-safenewtab alt="Yammer"><img src="/static/img/logos/yammer-logo.png"></a>
</div>
<div class="col-md-2 trusted-logo-medium">
<a href="http://www.mckinsey.com" ng-safenewtab alt="McKinsey &amp; Company"><img src="/static/img/logos/mckinsey-logo.svg"></a>
</div>
<div class="col-md-2 trusted-logo-medium">
<a href="http://www.golfchannel.com" ng-safenewtab alt="Golf Channel"><img src="/static/img/logos/golfchannel-logo.png"></a>
</div>
<div class="col-md-2 trusted-logo-medium">
<a href="http://travis-ci.org" ng-safenewtab alt="Travis CI"><img src="/static/img/logos/travisci-logo.png"></a>
</div>
<div class="col-md-2 trusted-logo-medium">
<a href="http://www.twc.com" ng-safenewtab alt="Time Warner Cable"><img src="/static/img/logos/twc-logo.png"></a>
</div>
</div>
</div> <!-- /row -->
</div>
</div> <!-- -->