new landing page first try
This commit is contained in:
128
rowers/templates/landingpage.html
Normal file
128
rowers/templates/landingpage.html
Normal file
@@ -0,0 +1,128 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<style>
|
||||
body, html {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
font: 400 15px/1.8 "Lato", sans-serif;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.bgimg-1, .bgimg-2, .bgimg-3 {
|
||||
position: relative;
|
||||
opacity: 0.65;
|
||||
background-attachment: fixed;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
}
|
||||
.bgimg-1 {
|
||||
background-image: url("/static/img/MerijnSoeters-hr-9841.jpg");
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.bgimg-2 {
|
||||
background-image: url("/static/img/MerijnSoeters-hr-8192.jpg");
|
||||
min-height: 400px;
|
||||
}
|
||||
|
||||
.bgimg-3 {
|
||||
background-image: url("/static/img/MerijnSoeters-hr-3282.jpg");
|
||||
min-height: 400px;
|
||||
}
|
||||
|
||||
.caption {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.caption span.border {
|
||||
background-color: #111;
|
||||
color: #fff;
|
||||
padding: 18px;
|
||||
font-size: 25px;
|
||||
letter-spacing: 10px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
letter-spacing: 5px;
|
||||
text-transform: uppercase;
|
||||
font: 20px "Lato", sans-serif;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
/* Turn off parallax scrolling for tablets and phones */
|
||||
@media only screen and (max-device-width: 1024px) {
|
||||
.bgimg-1, .bgimg-2, .bgimg-3 {
|
||||
background-attachment: scroll;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="bgimg-1">
|
||||
<div class="caption">
|
||||
<span class="border">SCROLL DOWN</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="color: #777;background-color:white;text-align:center;padding:50px 80px;text-align: justify;">
|
||||
<h3 style="text-align:center;">Free Data and Analysis. For Rowers. By Rowers.</h3>
|
||||
<p style="text-align: center;">
|
||||
There is no shortage of training advice for rowers.
|
||||
</p>
|
||||
<p style="text-align: center;">
|
||||
The best research has found that works best for one rower might not work for another. So, what can you do?
|
||||
</p>
|
||||
<p style="text-align: center;">
|
||||
The best way to improve racing performance is to assess where you are,
|
||||
set objectives, make a plan, track progress, and adjust based on the results you are getting.
|
||||
</p>
|
||||
<p style="text-align: center;">
|
||||
This site is more than a rowing log book. It enables you and your coach to
|
||||
plan and track all your rowing, indoor and on the water, with a large number
|
||||
of devices and apps. On top of htat, it offers the best in rowing
|
||||
data analytics. Train smart.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="bgimg-2">
|
||||
<div class="caption">
|
||||
<span class="border" style="background-color:transparent;font-size:25px;color: #f7f7f7;">LESS HEIGHT</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="position:relative;">
|
||||
<div style="color:#ddd;background-color:#282E34;text-align:center;padding:50px 80px;text-align: justify;">
|
||||
<p>Some info goes here</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bgimg-3">
|
||||
<div class="caption">
|
||||
<span class="border" style="background-color:transparent;font-size:25px;color: #f7f7f7;">SCROLL UP</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="position:relative;">
|
||||
<div style="color:#ddd;background-color:#282E34;text-align:center;padding:50px 80px;text-align: justify;">
|
||||
<p>Where does the login go?</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bgimg-1">
|
||||
<div class="caption">
|
||||
<span class="border">COOL!</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user