Commit 129be84c authored by Sean Packham's avatar Sean Packham

Added more images

parent a8eb483c
......@@ -2,6 +2,16 @@
body.cloud {
min-width: 1000px;
.header {
margin-top: 6em;
h1 {
font-size: 2.2em;
margin-bottom: 10px;
color: #000;
}
}
.testimonials img {
max-width: 150px;
}
......@@ -10,5 +20,9 @@ body.cloud {
max-width: 900px;
margin-left: auto;
margin-right: auto;
p {
color: #929db3;
}
}
}
body.download {
.hero {
background-color: #1e232a;
text-align: center;
color: #fff;
margin-bottom: 4em;
h1 {
margin-top: 2em;
color: #fff;
}
em {
margin-bottom: 1em;
}
a.button {
margin-bottom: 16em;
}
}
.desktop {
width: 55%;
float: left;
......@@ -29,7 +49,7 @@ body.download {
}
img {
width: 55px;
width: 48px;
}
a {
......@@ -56,7 +76,7 @@ body.download {
text-align: center;
div {
height: 100px;
height: 60px;
}
}
}
......@@ -65,24 +85,37 @@ body.download {
background-color: $cta-background;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding: 50px 0 55px;
color: #929db3;
h2 {
margin-bottom: 30px;
text-align: center;
.main {
padding: 4em 2em;
}
h2, h3 {
font-size: 2em;
color: #fff;
}
h3 {
text-align: center;
color: #fff;
}
.left {
float: left;
width: 56%;
width: 500px;
padding: 0 40px;
code {
background-color: #272b33;
color: #fff;
display: block;
padding: 10px 15px;
font-size: 18px;
font-size: 16px;
margin-top: 25px;
border: 1px solid #bbb;
border: 1px solid #2f343d;
border-radius: 5px;
width: 370px;
}
}
......@@ -90,16 +123,18 @@ body.download {
float: right;
width: 40%;
a {
a, a:visited {
display: block;
color: #fff;
}
img {
width: 70px;
width: 60px;
margin-bottom: 15px;
}
ul {
margin-top: 2em;
list-style: none;
padding: 0;
}
......@@ -112,5 +147,19 @@ body.download {
}
}
}
#support {
margin-top: 6em;
h2 {
font-size: 2.2em;
margin-bottom: 10px;
color: #000;
}
em {
}
}
}
......@@ -5,8 +5,8 @@ body.index {
.hero {
margin-bottom: $focus-padding;
background-color: #2c3d57;
padding: 3em 0;
background-color: #2f343e;
padding: 6em 0;
color: #fff;
.main {
......@@ -22,23 +22,18 @@ body.index {
h1 {
font-family: $ui-font-family;
font-size: 46px;
font-weight: 400;
font-size: 44px;
font-weight: 600;
line-height: 1.2em;
margin-bottom: 40px;
color: #fff;
span {
color: #ddd;
font-weight: 200;
font-size: 58px;
}
}
h2 {
font-size: 28px;
font-size: 20px;
font-weight: 600;
color: #fff;
margin-bottom: 5px;
margin: 3em 0 10px 0;
}
p {
......@@ -48,6 +43,7 @@ body.index {
}
.button {
margin-top: 15px;
margin-right: 5px;
}
......@@ -201,13 +197,16 @@ body.index {
}
}
.livechat{
.livechat {
padding-top: $focus-padding;
.left {
margin-top: 4em;
margin-top: 6em;
}
img {
max-height: none;
}
}
.translation {
......@@ -215,14 +214,19 @@ body.index {
margin-top: 6em;
}
}
.apps-wrapper {
background-image: url("/images/index/clients.png");
background-position: right;
background-repeat: no-repeat;
}
.apps {
margin-top: $focus-padding;
padding-top: $focus-padding;
.left {
margin-top: 5em;
}
}
.own {
......
......@@ -29,7 +29,7 @@ $header-logo-font-size: 18px;
$footer-font-size: 14px;
$footer-color: #ffffff;
$footer-background: #2c3d57;
$footer-background: #2f343e;
$footer-heading-font-size: 11px;
$footer-heading-color: #bcc5d6;
......@@ -117,9 +117,9 @@ h1, h2, h3, h4, h5, h6 {
}
h1 {
font-family: $serif-font-family;
font-family: $ui-font-family;
letter-spacing: .01rem;
font-weight: 400;
font-weight: 600;
font-style: normal;
font-size: 3.2em;
line-height: 1.2em;
......@@ -189,7 +189,7 @@ header, footer {
}
.header-wrapper {
background-color: #2c3d57;
background-color: #1f2329;
}
header {
......@@ -198,6 +198,8 @@ header {
padding: 16px 1em 12px;
color: #fff;
font-size: $header-font-size;
font-weight: 600;
text-transform: uppercase;
a.logo img {
display: inline-block;
......@@ -234,9 +236,10 @@ header {
padding: 3px 9px;
}
}
a.active {
text-decoration: underline;
a:hover, a.active {
color: #929db3;
text-decoration: none;
}
.main {
......@@ -374,14 +377,13 @@ section {
&.header {
margin: 1em 0 3em;
}
em {
display: block;
font-size: 1.4em;
font-style: normal;
}
em {
display: block;
font-size: 20px;
font-style: normal;
}
}
.faq {
......@@ -399,7 +401,7 @@ table {
margin: 0 auto;
border-collapse: collapse;
width: 100%;
color: #444;
color: #1f2329;
h2 {
font-size: 32px;
......@@ -419,7 +421,7 @@ table {
tr {
width: 100%;
border-top: 1px solid #ccc;
border-top: 1px solid #eef0f3;
}
tr:nth-child(1) {
......@@ -438,7 +440,7 @@ table {
td {
width: 26%;
padding: 12px 12px;
border-left: 1px solid #ccc;
border-left: 1px solid #eef0f3;
text-align: center;
}
......@@ -489,8 +491,8 @@ table {
span.yes:before {
content: '';
height: 5px;
background-color: green;
height: 3px;
background-color: #26d198;
position: relative;
display: block;
top: 50%;
......@@ -504,8 +506,8 @@ table {
span.yes:after {
content: '';
height: 5px;
background-color: green;
height: 3px;
background-color: #26d198;
position: relative;
display: block;
top: 50%;
......
......@@ -3,36 +3,19 @@ layout: en/default
class: download
---
<section class="header center">
</div>
<section class="hero">
<div class="main">
<h1>Download Rocket.Chat</h1>
<em>
Download Rocket.Chat for your desktop, mobile or server.
</em>
<a class="button highlight" href="#">Download</a>
</div>
</section>
<section class="message">
<div class="left">
<h3>Why</h3>
<p>
Copy explaining who the Download and Install option is best suited for.
</p>
<h3>Why</h3>
<p>
Copy explaining who the Download and Install option is best suited for.
</p>
</div>
<div class="right">
<h3>Why</h3>
<p>
Copy explaining who the Download and Install option is best suited for.
</p>
<h3>Why</h3>
<p>
Copy explaining who the Download and Install option is best suited for.
</p>
</div>
<div class="clear"></div>
</section>
<div class="main">
<section class="desktop">
<h2>Desktop Client</h2>
......@@ -105,7 +88,7 @@ class: download
</code>
</div>
<div class="right">
<h2>Server Source</h2>
<h3>Server Source</h3>
<ul>
<li>
<img src="{{ site.url }}/images/download/rocket.svg">
......@@ -129,7 +112,7 @@ class: download
<div class="main"> <!-- restart wrapper -->
<section id="support" class="header center">
<h1>Get support for your Rocket.Chat</h1>
<h2>Get support for your Rocket.Chat</h2>
<em>Support from the experts to keep your team communicating</em>
</section>
......
......@@ -128,7 +128,7 @@ class: index
</p>
</div>
<div class="right">
<img src="{{ site.url }}/images/index/livechat.svg" alt="">
<img src="{{ site.url }}/images/index/livechat.png" alt="">
</div>
<div class="clear"></div>
</section>
......@@ -153,25 +153,28 @@ class: index
</div>
</div>
<div class="main">
<section class="focus apps">
<div class="left">
<h2>Web, Desktop &amp; Mobile</h2>
<p>
With our <strong>web</strong>, <strong>desktop</strong> (Windows, MacOS, Linux (Deb, RPM)),
<strong>mobile</strong> (iOS, Android) and LiveChat clients and SDKs you chat from anywhere.
</p>
<p>
When you are offline, our <strong>robust notification system</strong> will make sure you never miss
anything important. Forget about email, communicate in real-time without restrictions.
</p>
</div>
<div class="right">
<img src="{{ site.url }}/images/index/clients.svg" alt="">
</div>
<div class="clear"></div>
</section>
<div class="apps-wrapper">
<section class="focus apps">
<div class="left">
<h2>Web, Desktop &amp; Mobile</h2>
<p>
With our <strong>web</strong>, <strong>desktop</strong> (Windows, MacOS, Linux (Deb, RPM)),
<strong>mobile</strong> (iOS, Android) and LiveChat clients and SDKs you chat from anywhere.
</p>
<p>
When you are offline, our <strong>robust notification system</strong> will make sure you never miss
anything important. Forget about email, communicate in real-time without restrictions.
</p>
</div>
<div class="right">
</div>
<div class="clear"></div>
</section>
</div>
<div class="main">
<section class="focus own">
<div class="left">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment