change some markup bits

This commit is contained in:
Lisa P 2015-10-28 12:39:21 +01:00
parent b35e24868a
commit cd82f30f8c
2 changed files with 28 additions and 92 deletions

View File

@ -22,7 +22,6 @@
max-width: 1024px
padding: 0 $column-gutter/2
.h1
font-size: 64px
color: #408692 !important
@ -100,7 +99,6 @@
.section--center
text-align: center
.section--feature
.inner
display: flex
@ -143,16 +141,19 @@
padding: 0
margin: 0
.list--customers
@extend %list
display: flex
justify-content: space-around
flex-wrap: wrap
width: 88%
margin: auto
align-items: center
width: 80%
margin: 2em auto 0
li
flex: 0 0 12em
flex: 0 0 9em
margin-bottom: 3em
@media #{$medium-up}
margin-bottom: 0
.list--languages
@extend %list
@ -160,7 +161,7 @@
justify-content: space-around
flex-wrap: wrap
li
flex: 0 0 9%
flex: 0 0 5em
.list--check
@extend %list
@ -177,7 +178,6 @@
background:
image: inline-image('line-icons/icon-passed.svg')
.list--features
@extend %list
display: flex
@ -190,81 +190,17 @@
li
flex: 0 0 15em
[class^="customer-"]
display: block
height: 5em
text-indent: -999%
overflow: hidden
background:
repeat: no-repeat
size: 12em 2em
position: center center
.customer-zendesk
background-image: inline-image('pro-landing/customer-logos-zendesk.svg')
.customer-heroku
background-image: inline-image('pro-landing/customer-logos-heroku.svg')
.customer-engineyard
background-image: inline-image('pro-landing/customer-logos-engineyard.svg')
.customer-bittorrent
background-image: inline-image('pro-landing/customer-logos-bittorrent.svg')
.customer-moz
background-image: inline-image('pro-landing/customer-logos-moz.svg')
[class^="feature-"]
display: block
height: 2em
width: 2em
overflow: hidden
margin: auto
background:
repeat: no-repeat
size: 100%
position: center center
.feature-github
background-image: inline-image('pro-landing/feature-icon-github.svg')
.feature-db
background-image: inline-image('pro-landing/feature-icon-platform.svg')
.feature-pr
background-image: inline-image('pro-landing/feature-icon-pullrequests.svg')
.feature-heroku
background-image: inline-image('pro-landing/feature-icon-heroku.svg')
[class^="language-"]
display: block
height: 3.5em
width: 3.5em
margin: 0 auto .5em
background:
repeat: no-repeat
size: 100%
position: center center
.language-clojure
background-image: inline-image('pro-landing/lang-clojure.svg')
.language-node
background-image: inline-image('pro-landing/lang-nodejs.svg')
.language-php
background-image: inline-image('pro-landing/lang-php.svg')
.language-xcode
background-image: inline-image('pro-landing/lang-xcode.svg')
.language-ruby
background-image: inline-image('pro-landing/lang-ruby.svg')
.language-python
background-image: inline-image('pro-landing/lang-python.svg')
.language-java
background-image: inline-image('pro-landing/lang-java.svg')
.language-erlang
background-image: inline-image('pro-landing/lang-erlang.svg')
.language-go
background-image: inline-image('pro-landing/lang-go.svg')
.language-scala
background-image: inline-image('pro-landing/lang-scala.svg')
.language-perl
background-image: inline-image('pro-landing/lang-perl.svg')

View File

@ -15,11 +15,11 @@
<div class="inner">
<h3 class="h3">Some pretty awesome companies and projects are a few of our users</h3>
<ul class="list--customers">
<li><a href="#" class="customer-zendesk">Zendesk</a></li>
<li><a href="#"class="customer-heroku">Heroku</a></li>
<li><a href="#"class="customer-engineyard">Engine Yard</a></li>
<li><a href="#"class="customer-bittorrent">BitTorrent</a></li>
<li><a href="#"class="customer-moz">moz</a></li>
<li><a href="https://www.zendesk.com/" title="Zendesk" class="customer-zendesk"><img width="120" height="20" src="../images/pro-landing/customer-logos-zendesk.svg" alt="Zendesk logo"></a></li>
<li><a href="http://www.heroku.com/" title="Heroku" class="customer-heroku"><img width="100" height="20" src="../images/pro-landing/customer-logos-heroku.svg" alt="Heroku logo"></a></li>
<li><a href="https://www.engineyard.com/" title="Engine Yard" class="customer-engineyard"><img width="120" height="20" src="../images/pro-landing/customer-logos-engineyard.svg" alt="Engine Yard logo"></a></li>
<li><a href="http://www.bittorrent.com/" title="BitTorrent" class="customer-bittorrent"><img width="120" height="20" src="../images/pro-landing/customer-logos-bittorrent.svg" alt="BitTorrent logo"></a></li>
<li><a href="https://moz.com/" title="moz" class="customer-moz"><img width="90" height="20" src="../images/pro-landing/customer-logos-moz.svg" alt="Moz logo"></a></li>
</ul>
</div>
</section>
@ -28,22 +28,22 @@
<div class="section-list section--center">
<ul class="list--features">
<li>
<span class="feature-github" aria-hidden="true"></span>
<img src="../images/pro-landing/feature-icon-github.svg" class="feature-github" aria-hidden="true">
<h3 class="h3">Get set up in seconds</h3>
<p class="text-small">Login with GitHub, tell Travis CI to test a project, and then push to GitHub. Could it be any simpler!</p>
</li>
<li>
<span class="feature-db" aria-hidden="true"></span>
<img src="../images/pro-landing/feature-icon-platform.svg" class="feature-db" aria-hidden="true">
<h3 class="h3">Supports your platform</h3>
<p class="text-small">Many databases and services are pre-installed and can be enabled in your build configuration.</p>
</li>
<li>
<span class="feature-pr" aria-hidden="true"></span>
<img src="../images/pro-landing/feature-icon-pullrequests.svg" class="feature-pr" aria-hidden="true">
<h3 class="h3">Test your pull requests</h3>
<p class="text-small">Make sure every Pull Request to your project is tested before it's merged.</p>
</li>
<li>
<span class="feature-heroku" aria-hidden="true"></span>
<img src="../images/pro-landing/feature-icon-heroku.svg" class="feature-heroku" aria-hidden="true">
<h3 class="h3">Deploy anywhere</h3>
<p class="text-small">Updating staging or production as soon as your tests pass has never been easier!</p>
</li>
@ -68,17 +68,17 @@
<h3 class="h3">Supported languages</h3>
<p class="text-small">These are just a few of our most popular languages, check out the full list <a href="#">in our docs</a>.</p>
<ul class="list--languages">
<li><span class="language-clojure"></span>Clojure</li>
<li><span class="language-node"></span>Node</li>
<li><span class="language-php"></span>PHP</li>
<li><span class="language-xcode"></span>XCode</li>
<li><span class="language-ruby"></span>Ruby</li>
<li><span class="language-python"></span>Python</li>
<li><span class="language-java"></span>Java</li>
<li><span class="language-erlang"></span>Erlang</li>
<li><span class="language-go"></span>Go</li>
<li><span class="language-scala"></span>Scala</li>
<li><span class="language-perl"></span>Perl</li>
<li><a href="http://docs.travis-ci.com/user/languages/clojure/"><img alt="Clojure logo" src="../images/pro-landing/lang-clojure.svg" class="language-clojure">Clojure</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/javascript-with-nodejs/"><img alt="NodeJS logo" src="../images/pro-landing/lang-nodejs.svg" class="language-node">Node</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/php/"><img alt="PHP logo" src="../images/pro-landing/lang-php.svg" class="language-php">PHP</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/objective-c/"><img alt="Xcode logo" src="../images/pro-landing/lang-xcode.svg" class="language-xcode">XCode</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/ruby/"><img alt="Ruby logo" src="../images/pro-landing/lang-ruby.svg" class="language-ruby">Ruby</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/python/"><img alt="Python logo" src="../images/pro-landing/lang-python.svg" class="language-python">Python</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/java/"><img alt="Java logo" src="../images/pro-landing/lang-java.svg" class="language-java">Java</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/erlang/"><img alt="Erlang logo" src="../images/pro-landing/lang-erlang.svg" class="language-erlang">Erlang</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/go/"><img alt="Go logo" src="../images/pro-landing/lang-go.svg" class="language-go">Go</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/scala/"><img alt="Scala logo" src="../images/pro-landing/lang-scala.svg" class="language-scala">Scala</a></li>
<li><a href="http://docs.travis-ci.com/user/languages/perl/"><img alt="Perl logo" src="../images/pro-landing/lang-perl.svg" class="language-perl">Perl</a></li>
</ul>
</div>
</section>