Landing page revision #0
This commit is contained in:
Joseph Schorr
parent
2d69e2b031
commit
a903d36623
6 changed files with 227 additions and 2 deletions
BIN
static/containers-back-black.jpg
Normal file
BIN
static/containers-back-black.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
static/containers-back-black.psd
Normal file
BIN
static/containers-back-black.psd
Normal file
Binary file not shown.
BIN
static/containers.jpg
Normal file
BIN
static/containers.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 531 KiB |
|
|
@ -1,3 +1,164 @@
|
||||||
|
.landing {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 562px;
|
||||||
|
|
||||||
|
padding: 10px;
|
||||||
|
|
||||||
|
color: white;
|
||||||
|
margin-top: -19px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .message-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 88px;
|
||||||
|
left: 50px;
|
||||||
|
width: 600px;
|
||||||
|
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .signup-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 100px;
|
||||||
|
right: 50px;
|
||||||
|
width: 350px;
|
||||||
|
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .signup-container input {
|
||||||
|
margin: 12px;
|
||||||
|
margin-left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .message {
|
||||||
|
font-size: 3.4em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .message b {
|
||||||
|
color: #94C9F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .sub-message {
|
||||||
|
font-size: 1.8em;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .sub-message b {
|
||||||
|
color: #94C9F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .sellcall {
|
||||||
|
font-size: 1.4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .shoutouts {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 30px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
text-align: center;
|
||||||
|
z-index: 3;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .shoutout {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 20px;
|
||||||
|
margin-right: 20px;
|
||||||
|
width: 300px;
|
||||||
|
vertical-align: top;
|
||||||
|
white-space: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .shoutout i {
|
||||||
|
font-size: 36px;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .shoutout b {
|
||||||
|
font-size: 22px;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .background-mask {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
|
||||||
|
height: 562px;
|
||||||
|
|
||||||
|
background: -moz-linear-gradient(top, #141414 0%, transparent 15%, transparent 85%, #141414 100%);
|
||||||
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#141414), color-stop(15%,transparent), color-stop(85%,transparent), color-stop(100%,#141414));
|
||||||
|
background: -webkit-linear-gradient(top, #141414 0%,transparent 15%,transparent 85%,#141414 100%);
|
||||||
|
background: -o-linear-gradient(top, #141414 0%,transparent 15%,transparent 85%,#141414 100%);
|
||||||
|
background: -ms-linear-gradient(top, #141414 0%,transparent 15%,transparent 85%,#141414 100%);
|
||||||
|
background: linear-gradient(to bottom, #141414 0%,transparent 15%,transparent 85%,#141414 100%);
|
||||||
|
|
||||||
|
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing .background {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
|
||||||
|
background-color: #1d1d1d;
|
||||||
|
background-position: left;
|
||||||
|
background-image: url(../containers-back-black.jpg);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
height: 562px;
|
||||||
|
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing-footer {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
position: absolute;
|
||||||
|
top: 610px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
|
||||||
|
min-height: 138px;
|
||||||
|
border-radius: 0px;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing-footer .footer-column {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 10px;
|
||||||
|
margin-left: 20px;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing-footer .footer-column ul {
|
||||||
|
list-style-type: none;
|
||||||
|
margin: 0px;
|
||||||
|
padding-left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing-footer .footer-column li {
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.landing-footer .dt-logo {
|
||||||
|
float: right;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-right: 10px;
|
||||||
|
vertical-align: center;
|
||||||
|
width: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
#repoSearch {
|
#repoSearch {
|
||||||
width: 400px;
|
width: 400px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
BIN
static/dt-logo.png
Normal file
BIN
static/dt-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
|
|
@ -1,3 +1,67 @@
|
||||||
<div class="container">
|
<div class="landing">
|
||||||
<a ng-href="#/repository">Repositories</a>
|
<div class="background"></div>
|
||||||
|
<div class="background-mask"></div>
|
||||||
|
<div class="message-container">
|
||||||
|
<div class="message">Secure hosting for <b>private</b> docker containers</div>
|
||||||
|
<div class="sub-message">Use the docker images <b>your team</b> needs with the safety of <b>private</b> storage</div>
|
||||||
|
<div class="sellcall"><a href="">Starting at $7/mo</a></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="signup-container">
|
||||||
|
<form method="post" class="form-signup">
|
||||||
|
<input type="text" class="form-control" placeholder="Create a username" name="username" autofocus>
|
||||||
|
<input type="text" class="form-control" placeholder="Email address" name="email" autofocus>
|
||||||
|
<input type="password" class="form-control" placeholder="Create a password" name="password">
|
||||||
|
<button class="btn btn-lg btn-primary btn-block" type="submit">Get Started!</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="shoutouts">
|
||||||
|
<div class="shoutout">
|
||||||
|
<i class="icon-lock"></i>
|
||||||
|
<b>Secure</b>
|
||||||
|
Store your private docker containers securely where only you and your team
|
||||||
|
can access it
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="shoutout">
|
||||||
|
<i class="icon-cloud"></i>
|
||||||
|
<b>Cloud Hosted</b>
|
||||||
|
Accessible from anywhere, anytime
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="shoutout">
|
||||||
|
<i class="icon-share-sign"></i>
|
||||||
|
<b>Shareable</b>
|
||||||
|
Have to share a container? No problem! Share with anyone you choose
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="navbar landing-footer">
|
||||||
|
<div class="footer-column">
|
||||||
|
<h4>About</h4>
|
||||||
|
<ul>
|
||||||
|
<li><a href="">Blog</a></li>
|
||||||
|
<li><a href="">About Us</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-column">
|
||||||
|
<h4>Legal</h4>
|
||||||
|
<ul>
|
||||||
|
<li><a href="">Terms of Service</a></li>
|
||||||
|
<li><a href="">Privacy Policy</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-column">
|
||||||
|
<h4>Support</h4>
|
||||||
|
<ul>
|
||||||
|
<li><a href="">Contact Support</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<a href="https://devtable.com"><img class="dt-logo" src="/static/dt-logo.png"></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
Reference in a new issue