Private
Public Access
1
0

frontpage 1st cut

This commit is contained in:
Sander Roosendaal
2018-10-17 18:53:55 +02:00
parent 4f1ba0e802
commit 8407750027
11 changed files with 206 additions and 37 deletions

View File

@@ -131,7 +131,7 @@
<li class="rounder">
<h1>Power Progress</h1>
{% if user|is_planmember %}
<a href="/rowers/fitness-progress">
<a href="/rowers/fitness-progress/">
{% else %}
<a href="/rowers/promembership">
{% endif %}

View File

@@ -7,29 +7,158 @@
{% block main %}
{% load tz %}
<ul class="main-content">
<li class="grid_5">
<p>
<h1 class="midden">Free Data and Analysis.</h1>
<h2 class="midden">For Rowers. By Rowers.</h2>
</p>
</li>
{% if user.is_anonymous %}
<li>
&nbsp:
</li>
<li>
&nbsp:
</li>
<li class="rounder whiteborder">
<a class="button midden" href="/rowers/register">
<h1 class="midden">SIGN UP FREE</h1>
</a>
</li>
<li>
&nbsp;
</li>
<li>
&nbsp;
</li>
<li>
&nbsp;
</li>
<li>
&nbsp;
</li>
<li class="rounder whiteborder">
<form id="idLogInForm" method="post" action="{% url 'login' %}" class="loginForm">{% csrf_token %}
<a class="button midden" href="/rowers/register">
<h2 class="midden">Sign In</h2></a>
{{ form.as_p }}
<button class="midden button white"
id="idLogInSubmit"
name="idLogInSubmit"
type="submit">Login
</button>
</form>
</li>
<li>
&nbsp;
</li>
<li>
&nbsp;
</li>
{% endif %}
<li class="grid_5">
<p class="midden">There is no shortage of training advice for rowers.</p>
<p class="midden">The best research has found that what works best for one
rower might not work for another. So, what can you do?</p>
<p class="midden">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>
<h2 class="midden">WHAT WE OFFER</h2>
</li>
<li>
&nbsp;
</li>
<li class="frontitem">
<h3 class="midden">LOG</h3>
<div class="midden">
<img src="/static/img/log.png"
alt="Analyze" width="62px">
</div>
<p class="midden">
Easily upload data from the most popular devices and apps. Maintain
a consistent log for all your rowing (indoor and on the water).
</p>
</li>
<li class="frontitem">
<h3 class="midden">ANALYZE</h3>
<div class="midden">
<img src="/static/img/analyze.png"
alt="Analyze" width="62px">
</div>
<p class="midden">
Analyze your workouts with a consistent set of tools
</p>
</li>
<li class="frontitem">
<h3 class="midden">COMPARE</h3>
<div class="midden">
<img src="/static/img/compare.png"
alt="Analyze" width="62px">
</div>
<p class="midden">
Compare your results between workouts and with other rowers in your team
</p>
</li>
<li>
&nbsp;
</li>
<li>
&nbsp:
</li>
<li>
&nbsp:
</li>
<li class="rounder whiteborder">
<a class="button midden" href="/rowers/features">
<h2 class="midden">VIEW ALL</h2>
</a>
</li>
<li>
&nbsp;
</li>
<li>
&nbsp;
</li>
<li class="grid_5">
<div class="midden">
<img src="/static/img/horizontal_line.png"
alt="horizontal line">
</div>
</li>
<li class="grid_5">
<p class="midden">
<a class="twitter-follow-button"
href="https://twitter.com/rowsandall">
Follow @rowsandall</a>
</p>
</li>
</ul>
<p class="midden">
Local Time: {% now "jS F Y H:i" %}
</p>
<p class="midden">
<a class="twitter-follow-button"
href="https://twitter.com/rowsandall">
Follow @rowsandall</a>
</p>
<p class="midden">
Compatible with:
<img src="/static/img/stravasquare.png" alt="Strava icon" width="30" height="30">
<img src="/static/img/sporttrackssquare.png" alt="SportTracks icon" width="30" height="30">
<img src="/static/img/c2square.jpg" alt="C2 icon" width="30" height="30">
<img src="/static/img/nksquare.png" alt="NK icon" width="30" height="30">
<img src="/static/img/cnsquare.png" alt="CrewNerd icon" width="30" height="30">
<img src="/static/img/rimsquare.png" alt="RiM icon" width="30" height="30">
<img src="/static/img/rpsquare.png" alt="RowPro icon" width="30" height="30">
<img src="/static/img/essquare.png" alt="ErgStick icon" width="30" height="30">
<img src="/static/img/bcsquare.png" alt="BoatCoach icon" width="30" height="30">
<img src="/static/img/pssquare.png" alt="PainSled icon" width="30" height="30">
<img src="/static/img/coxmate.png" alt="CoxMate icon" width="30" height="30">
<img src="/static/img/ritmo_logo.gif" alt="RitmoTime icon" width="30" height="30">
</p>
<p class="midden">
Compatible with:
<img src="/static/img/stravasquare.png" alt="Strava icon" width="30" height="30">
<img src="/static/img/sporttrackssquare.png" alt="SportTracks icon" width="30" height="30">
<img src="/static/img/c2square.jpg" alt="C2 icon" width="30" height="30">
<img src="/static/img/nksquare.png" alt="NK icon" width="30" height="30">
<img src="/static/img/cnsquare.png" alt="CrewNerd icon" width="30" height="30">
<img src="/static/img/rimsquare.png" alt="RiM icon" width="30" height="30">
<img src="/static/img/rpsquare.png" alt="RowPro icon" width="30" height="30">
<img src="/static/img/essquare.png" alt="ErgStick icon" width="30" height="30">
<img src="/static/img/bcsquare.png" alt="BoatCoach icon" width="30" height="30">
<img src="/static/img/pssquare.png" alt="PainSled icon" width="30" height="30">
<img src="/static/img/coxmate.png" alt="CoxMate icon" width="30" height="30">
<img src="/static/img/ritmo_logo.gif" alt="RitmoTime icon" width="30" height="30">
</p>
{% endblock %}

View File

@@ -23,7 +23,7 @@
</a>
</li>
<li id="fitness-powerprogress">
<a href="/rowers/fitnessprogress">
<a href="/rowers/fitnessprogress/">
<i class="far fa-watch-fitness fa-fw"></i>&nbsp;Power Progress
</a>
</li>

View File

@@ -1,12 +1,19 @@
from django.shortcuts import render, redirect, render_to_response
from django.template import RequestContext
from django.conf import settings
from rowers.forms import LoginForm
from rowingdata import main as rmain
def rootview(request):
magicsentence = rmain()
return render(request, 'frontpage.html', {'versionstring': magicsentence})
loginform = LoginForm()
return render(request,
'frontpage.html',
{
'versionstring': magicsentence,
'form':loginform,
})

View File

@@ -3,6 +3,7 @@
.wrapper {
max-width: 1400px;
width: 100%;
color: white;
font: 1.2em Helvetica, arial, sans-serif;
}
@@ -19,7 +20,7 @@
a {
text-decoration: none;
color: #1c75bc;
color: white;
}
nav ul {
@@ -351,20 +352,22 @@
.main-head {
grid-area: header;
background-color: rgba(255,255,255,0.7);
background-color: rgba(0,0,0,0.6);
}
.main-user {
grid-area: user;
background-color: rgba(255,255,255,0.7);
background-color: rgba(0,0,0,0.6);
}
.content {
grid-area: content;
padding: 1.2em 1.2em 1.2em 1.2em;
font-size: 1.3rem;
color: white;
background-color: rgba(0,0,0,0.3)
}
.content h1 {
@@ -372,6 +375,10 @@
font-weight: normal;
}
.content label {
color: white;
}
.content h2 {
font-size 1.2em;
font-weight: normal;
@@ -386,14 +393,16 @@
font-style: italic;
}
.main-nav {
grid-area: nav;
background: #1c75bc;
background-color: rgba(28,117,188,0.6);
}
.side-nav {
grid-area: side-nav;
background: #1c75bc;
background-color: rgba(0,0,0,0.6);
}
.side {
@@ -440,7 +449,7 @@
}
.main-footer {
grid-area: footer;
background-color: rgba(255,255,255,0.6);
background-color: rgba(0,0,0,0.5);
padding: 1.2em 1.2em 1.2em 1.2em;
}
@@ -477,7 +486,7 @@
}
.main-content li.grid_3 {
grid-column-end: span 4;
grid-column-end: span 1;
}
@@ -489,14 +498,18 @@
.main-content li.grid_4 {
grid-column-end: span 1;
}
.main-content li.grid_5 {
grid-column-end: span 1;
}
/**
.main-content li img {
display: block;
width: 100%;
height: auto;
padding: 5px;
}
**/
@media (min-height: 600px) {
@@ -563,7 +576,7 @@
.main-content {
display: grid;
grid-template-columns: repeat(2,1fr);
grid-template-columns: repeat(3,1fr);
grid-gap: 10px;
}
@@ -572,11 +585,14 @@
}
.main-content li.grid_3 {
grid-column-end: span 2;
grid-column-end: span 3;
}
.main-content li.grid_4 {
grid-column-end: span 2;
grid-column-end: span 3;
}
.main-content li.grid_5 {
grid-column-end: span 3;
}
}
@@ -602,7 +618,7 @@
.main-content {
display: grid;
grid-template-columns: repeat(4,1fr);
grid-template-columns: repeat(5,1fr);
grid-gap: 10px;
}
@@ -618,6 +634,10 @@
grid-column-end: span 4;
}
.main-content li.grid_5 {
grid-column-end: span 5;
}
}
@media print {

View File

@@ -276,6 +276,18 @@ th.rotate > div > span {
margin: 2px;
}
.whiteborder {
border: solid 1px white;
}
.frontitem {
background-color: rgba(255,255,255,0.5);
border: solid 1px wite;
padding: 5px;
margin: 5px;
color: black;
}
.vignet {
border-radius: 50%;
display: block;
@@ -701,6 +713,7 @@ th.rotate > div > span {
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
border: solid 1px white;
}
.medium {
font-size: 1.2em;

BIN
static/img/analyze.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
static/img/compare.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 150 B

BIN
static/img/log.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@@ -136,8 +136,8 @@
min-width: 1024px;
padding: 0;
margin: 0;
width: 100%;
height: auto;
width: auto;
height: 100%;
}
</style>