suzanne.soy/travis-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update org landing page, fix gigantic number

Browse Source
This commit is contained in:
lislis 2016-04-14 17:00:55 +02:00
parent b9688352f4
commit 812bf1a4f5
2 changed files with 46 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/styles/app/pages/landing.sass
View File

@ -11,14 +11,14 @@
background-color: #ffffff
background-image: inline-image('landing-page/signingithub.svg')
background-size: 16px 16px
border: 2px solid #e4e7e7
color: #a0a8a8
border: 2px solid rgba($cement-grey, .4)
color: $cement-grey
.button--signingin
border: 2px solid #3FA75F
border: 2px solid $turf-green
.button--signin:hover
background-color: #73c78d
background-color: $turf-green
background-image: inline-image('landing-page/signingithub-hover.svg')
border: 2px solid #73c78d
border: 2px solid $turf-green
color: #fff
.landing-centered-wrapper
@ -37,7 +37,7 @@
font-size: 5em
line-height: 1em
font-weight: 300
color: #8f9294
color: $cement-grey
margin-bottom: 0
.hero, .oss-testing, .customers, .recent-builds, .free-for-oss, .private-repos, .features-list, .build-flows, .user-testimonials
@ -52,7 +52,7 @@
font-size: 3.3em
line-height: 1.15em
font-weight: 300
color: #39a85b
color: $turf-green
p
line-height: 1.5em
@ -129,7 +129,11 @@
br.mobile-break
display: none
.os-numbers
width: 80%
@media #{$medium-up}
width: 60%
.customers
text-align: center

68
app/templates/home.hbs
View File

@ -1,7 +1,7 @@
{{#travis-layout layoutName="layouts/landing-page"}}
<div id="landing" class="landing">
<div class="row hero z-1">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="large-12 columns" id="hero-copy">
<h1>Test and Deploy with Confidence</h1>
<p>Easily sync your GitHub projects with Travis CI<br class="mobile-break"> and you’ll be testing your code in minutes!</p>
@ -16,25 +16,26 @@
</div>
<div class="large-12 columns laptop-wrapper">
<div id="laptop">
<img src="../images/landing-page/laptop.png">
<img src="../images/landing-page/laptop.png" alt="Travis CI screenshot">
</div>
</div>
</div>
</section>
</div>
<div class="row oss-testing">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="large-12 columns">
<h2>The home of<br class="mobile-break"> open source testing</h2>
<p>Over 320k open source projects<br class="mobile-break"> and 235k users are testing on Travis CI.</p>
<img src="../images/landing-page/customer-numbers.svg">
</div>
<h2>The home of<br class="mobile-break"> open source testing</h2>
<p>Over 300k open source projects<br class="mobile-break"> and 235k users are testing on Travis CI.</p>
<img src="../images/landing-page/customer-numbers.svg" alt="Open source project numbers" class="os-numbers">
</div>
</section>
</div>
<div class="row customers">
<div class="landing-centered-wrapper">
<div class="medium-6 columns">
<img src="../images/landing-page/customers-temp-together.svg">
<img src="../images/landing-page/customers-temp-together.svg" alt="customer logos">
</div>
<div class="medium-6 columns">
<p class="left">Some pretty awesome companies<br> and projects are using us.</p>
@ -43,16 +44,16 @@
</div>
<div class="row free-for-oss">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="large-12 columns">
<h1>Testing your open source<br class="mobile-no-break"> project is 10000% free</h1>
<p><span class="bold-italic">Seriously. Always.</span> We like to think of it as our way of giving<br>back to a community that gives us so much as well.</p>
</div>
</div>
</section>
</div>
<div class="row private-repos">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="medium-6 columns mobile-envelope">
<img src="../images/landing-page/envelope.svg">
</div>
@ -64,13 +65,13 @@
</div>
</div>
<div class="medium-6 columns desktop-envelope">
<img src="../images/landing-page/envelope.svg">
<img src="../images/landing-page/envelope.svg" alt="envelope">
</div>
</div>
</section>
</div>
<div class="row features-list">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="large-6 columns features-callouts">
<div class="landing-vert-center-s">
<div class="medium-6 columns">
@ -104,16 +105,16 @@
<li>Did we say free for Open Source already?</li>
</ul>
</div>
</div>
</section>
</div>
<div class="row build-flows">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="large-12 columns">
<h2>Branch build flow</h2>
<div class="branch-bf">
<div class="bf">
<img src="../images/landing-page/push-icon-1.svg">
<img src="../images/landing-page/push-icon-1.svg" alt="GitHub logo">
<p>You push your<br>code to GitHub</p>
</div>
<div class="divider-line-horizontal">
@ -121,7 +122,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/push-icon-2.svg">
<img src="../images/landing-page/push-icon-2.svg" alt="Trigger build">
<p>GitHub triggers<br>Travis CI to build</p>
</div>
<div class="divider-line-horizontal">
@ -129,7 +130,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/push-icon-3.svg">
<img src="../images/landing-page/push-icon-3.svg" alt="Travis logo">
<p>Hooray!<br>Your build passes!</p>
</div>
<div class="divider-line-horizontal">
@ -137,7 +138,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/push-icon-4.svg">
<img src="../images/landing-page/push-icon-4.svg" alt="Heroku logo">
<p>Travis CI deploys<br>to Heroku</p>
</div>
<div class="divider-line-horizontal">
@ -145,14 +146,14 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/push-icon-5.svg">
<img src="../images/landing-page/push-icon-5.svg" alt="Slack logo">
<p>Travis CI tells the<br>team all is well</p>
</div>
</div>
<h2 id="pr-bf-margin">Pull request build flow</h2>
<div class="branch-bf">
<div class="bf">
<img src="../images/landing-page/pull-icon-1.svg">
<img src="../images/landing-page/pull-icon-1.svg" alt="PR icon">
<p>A pull request<br>is created</p>
</div>
<div class="divider-line-horizontal">
@ -160,7 +161,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/pull-icon-2.svg">
<img src="../images/landing-page/pull-icon-2.svg" alt="Check test">
<p>GitHub tells Travis CI the build is mergeable</p>
</div>
<div class="divider-line-horizontal">
@ -168,7 +169,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/push-icon-3.svg">
<img src="../images/landing-page/push-icon-3.svg" alt="Tavis logo">
<p>Hooray!<br>Your build passes!</p>
</div>
<div class="divider-line-horizontal">
@ -176,7 +177,7 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/pull-icon-4.svg">
<img src="../images/landing-page/pull-icon-4.svg" alt="Build status">
<p>Travis CI updates the PR that it passed</p>
</div>
<div class="divider-line-horizontal">
@ -184,22 +185,22 @@
<div class="divider-line-vertical">
</div>
<div class="bf">
<img src="../images/landing-page/pull-icon-5.svg">
<img src="../images/landing-page/pull-icon-5.svg" alt="Merge icon">
<p>You merge in<br>the PR goodness</p>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="row user-testimonials">
<div class="landing-centered-wrapper">
<section class="landing-centered-wrapper">
<div class="medium-6 columns">
<h2>Some people have said some pretty nice things about us</h2>
</div>
<div class="medium-6 columns">
<div class="small-3 columns">
<img src="../images/landing-page/dhh.png" class="home-avatar">
<img src="../images/landing-page/dhh.png" class="home-avatar" alt="image DHH">
</div>
<div class="small-9 columns">
<p>Travis CI makes it so much easier for us to coordinate the thousands of commits and contributors that flow through the Rails code base. The test suite for such a large project is vast, and we wouldn’t be catching issues as quickly or smoothly without the help of Travis.</p>
@ -208,7 +209,7 @@
</div>
<div class="small-3 columns">
<img src="../images/landing-page/chris.png" class="home-avatar">
<img src="../images/landing-page/chris.png" class="home-avatar" alt="image Chris Aniszczyk">
</div>
<div class="small-9 columns">
<p>We love Travis CI at @TwitterOSS and use it for the majority of our open source projects on GitHub. Travis CI is simple to use, we love their API to build tooling and adore the new container infrastructure for speedier builds.</p>
@ -217,7 +218,7 @@
</div>
<div class="small-3 columns">
<img src="../images/landing-page/alex.png" class="home-avatar">
<img src="../images/landing-page/alex.png" class="home-avatar" alt="Alex Gaynor">
</div>
<div class="small-9 columns">
<p>Not only is Travis CI the best way to test your software, it is the right way. rm -rf jenkins &amp;&amp; touch .travis.yml</p>
@ -225,8 +226,7 @@
<p class="title">PyPy and Python Core Team Member</p>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
{{/travis-layout}}