wger-project/wger
1
0
Fork 0
mirror of https://github.com/wger-project/wger.git synced 2026-02-18 00:17:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

Improve landing page

Browse Source 
This fixes #307
This commit is contained in:
Roland Geider
2016-09-05 22:14:10 +02:00
parent 581c543397
commit ca744767ec
7 changed files with 120 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/changelog.rst
View File

@@ -26,6 +26,7 @@ New languages:
New features:
* Add repetition (minutes, kilometer, etc.) and weight options (kg, lb, plates, until failure) to sets `#216`_ and `#217`_
* Much improved landing page (thanks `@DeveloperMal`_) `#307`_
* Use the metricsgraphics library to more easily draw charts `#188`_
* Add extended PDF options to schedules as well (thanks `@alelevinas`_ ) `#272`_
* Show trained secondary muscles in workout view (thanks `@alokhan`_ ) `#282`_
@@ -70,6 +71,7 @@ Other improvements and bugfixes: `#25`_, `#243`_, `#279`_, `#275`_, `#270`_, `#2
.. _#302: https://github.com/wger-project/wger/issues/302
.. _#303: https://github.com/wger-project/wger/issues/303
.. _#304: https://github.com/wger-project/wger/issues/304
.. _#307: https://github.com/wger-project/wger/issues/307
.. _#311: https://github.com/wger-project/wger/issues/311
.. _#312: https://github.com/wger-project/wger/issues/312
.. _#313: https://github.com/wger-project/wger/issues/313
@@ -80,6 +82,7 @@ Other improvements and bugfixes: `#25`_, `#243`_, `#279`_, `#275`_, `#270`_, `#2
.. _#324: https://github.com/wger-project/wger/issues/324
.. _#325: https://github.com/wger-project/wger/issues/325
.. _@petervanderdoes: https://github.com/petervanderdoes
.. _@DeveloperMal: https://github.com/DeveloperMal
.. _@alelevinas: https://github.com/alelevinas
.. _@jstoebel: https://github.com/jstoebel
.. _@alokhan: https://github.com/alokhan

2
wger/core/templates/mobile/index.html
View File

@@ -193,7 +193,7 @@ its default duration in your settings.{% endblocktrans %}
data-toggle="modal"
class="btn btn-default btn-block"
style="white-space: normal;">
<span class="{% fa_class 'list' 'lg' %}"></span>
<span class="{% fa_class 'cutlery' 'lg' %}"></span>
<br>
{{plan}}
</a>

4
wger/core/templates/template_features.html
View File

@@ -45,10 +45,6 @@
{% endblock %}
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
{% compress css %}
<link rel="stylesheet" type="text/css" href="{% static 'bower_components/bootstrap/dist/css/bootstrap.min.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'bower_components/components-font-awesome/css/font-awesome.min.css' %}">

68
wger/software/static/css/agency.css
View File

@@ -3,9 +3,31 @@
* Copyright 2013-2016 Start Bootstrap
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
*/
@font-face {
font-family:"Open Sans Light";
src:url("/static/fonts/OpenSans-Light.eot?") format("eot"),
url("/static/fonts/OpenSans-Light.woff") format("woff"),
url("/static/fonts/OpenSans-Light.ttf") format("truetype"),
url("/static/fonts/OpenSans-Light.svg#OpenSans-Light") format("svg");
font-weight:normal;
font-style:normal;
}
@font-face {
font-family:"Open Sans Bold";
src:url("/static/fonts/OpenSans-Bold.eot?") format("eot"),
url("/static/fonts/OpenSans-Bold.woff") format("woff"),
url("/static/fonts/OpenSans-Bold.ttf") format("truetype"),
url("/static/fonts/OpenSans-Bold.svg#OpenSans-Bold") format("svg");
font-weight:normal;
font-style:normal;
}
body {
overflow-x: hidden;
font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif;
/*font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
font-family: font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
}
.text-muted {
color: #777777;
@@ -45,7 +67,8 @@ h3,
h4,
h5,
h6 {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
/*font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
font-family: "Open Sans Bold", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
}
@@ -62,7 +85,8 @@ h6 {
color: white;
background-color: #204a87;
border-color: #204a87;
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
/*font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
}
@@ -106,7 +130,7 @@ fieldset[disabled] .btn-primary.active {
color: white;
background-color: #204a87;
border-color: #204a87;
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Bold", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
border-radius: 3px;
@@ -155,7 +179,7 @@ fieldset[disabled] .btn-xl.active {
}
.navbar-custom .navbar-brand {
color: #204a87;
font-family: "Kaushan Script", "Helvetica Neue", Helvetica, Arial, cursive;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
}
.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus,
@@ -169,7 +193,7 @@ fieldset[disabled] .btn-xl.active {
.navbar-custom .navbar-toggle {
background-color: #204a87;
border-color: #204a87;
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
color: white;
font-size: 12px;
@@ -179,7 +203,7 @@ fieldset[disabled] .btn-xl.active {
background-color: #204a87;
}
.navbar-custom .nav li a {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1px;
@@ -245,14 +269,14 @@ header .intro-text {
padding-bottom: 50px;
}
header .intro-text .intro-lead-in {
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
font-style: italic;
font-size: 22px;
line-height: 22px;
margin-bottom: 25px;
}
header .intro-text .intro-heading {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
font-size: 50px;
@@ -265,14 +289,14 @@ header .intro-text .intro-heading {
padding-bottom: 200px;
}
header .intro-text .intro-lead-in {
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
font-style: italic;
font-size: 40px;
line-height: 40px;
margin-bottom: 25px;
}
header .intro-text .intro-heading {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Bold", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
font-size: 75px;
@@ -290,7 +314,7 @@ section h2.section-heading {
}
section h3.section-subheading {
font-size: 16px;
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: none;
font-style: italic;
font-weight: 400;
@@ -357,7 +381,7 @@ section h3.section-subheading {
margin: 0;
}
#portfolio .portfolio-item .portfolio-caption p {
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
font-style: italic;
font-size: 16px;
margin: 0;
@@ -381,7 +405,7 @@ section h3.section-subheading {
position: absolute;
content: "";
width: 2px;
background-color: #f1f1f1;
background-color: #d3d7cf;
left: 40px;
margin-left: -1.5px;
}
@@ -427,7 +451,7 @@ section h3.section-subheading {
background-color: #204a87;
color: white;
border-radius: 100%;
border: 7px solid #f1f1f1;
border: 7px solid #d3d7cf;
text-align: center;
}
.timeline > li .timeline-image h4 {
@@ -583,27 +607,27 @@ section#contact .form-control:focus {
box-shadow: none;
}
section#contact ::-webkit-input-placeholder {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
color: #eeeeee;
}
section#contact :-moz-placeholder {
/* Firefox 18- */
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
color: #eeeeee;
}
section#contact ::-moz-placeholder {
/* Firefox 19+ */
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
color: #eeeeee;
}
section#contact :-ms-input-placeholder {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: 700;
color: #eeeeee;
@@ -617,14 +641,14 @@ footer {
}
footer span.copyright {
line-height: 40px;
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-transform: none;
}
footer ul.quicklinks {
margin-bottom: 0;
line-height: 40px;
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-transform: none;
}
@@ -681,7 +705,7 @@ ul.social-buttons li a:active {
}
.portfolio-modal .modal-content p.item-intro {
margin: 20px 0 30px;
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Open Sans Light", Arial, Helvetica, sans-serif;
font-style: italic;
font-size: 16px;
}

BIN
wger/software/static/images/main.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

BIN
wger/software/static/images/rest-api.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

108
wger/software/templates/features.html
View File

@@ -46,11 +46,14 @@
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading text-light">{% trans "What does it do" %}</h2>
<h3 class="section-subheading text-muted">{% blocktrans %}wger Workout Manager is a free, open source web application that manages
your exercises, workouts and nutrition. It started as a pet project of mine to replace my
growing collection of different spreadsheets, but it has become something other
people could also find useful.{% endblocktrans %}
<h2 class="section-heading text-light">{% trans "Your advantages" %}</h2>
<h3 class="section-subheading text-muted">
{% blocktrans trimmed %}
wger Workout Manager is a free, open source web application that manages
your exercises, workouts and nutrition. It started as a pet project of
mine to replace my growing collection of different spreadsheets, but it
has become something other people could also find useful.
{% endblocktrans %}
</h3>
</div>
</div>
@@ -61,27 +64,44 @@ people could also find useful.{% endblocktrans %}
<i class="fa fa-user fa-stack-1x fa-inverse"></i>
</span>
<h4 class="service-heading text-light">{% trans "Workouts" %}</h4>
<p class="text-muted">{% blocktrans %}Create and manage your workout routines by selecting how
many days your workout consists of, and adding different exercises to each. You can
also combine different workouts into a schedule.{% endblocktrans %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
You can create and manage flexible workout routines for any goals you
have. Select exactly which exercises you'll do and how many repetitions,
time or distance you want to do them. You can also combine different
workouts into a schedule.
{% endblocktrans %}
</p>
</div>
<div class="col-md-4">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-laptop fa-stack-1x fa-inverse"></i>
<i class="fa fa-cutlery fa-stack-1x fa-inverse"></i>
</span>
<h4 class="service-heading text-light">{% trans "Nutrition" %}</h4>
<p class="text-muted">{% blocktrans %}Create a diet plan and see its nutritional
values (total energy, protein, carbohydrates, and so on) about
it. Select from more than 8000 ingredients for this.{% endblocktrans %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
Create your personal diet plan by creating as many meals with as many
different ingredients as you need. The application will calculate the
nutritional values (total energy, protein, carbohydrates, and so on)
about the whole plan as well as the indivual meals.
{% endblocktrans %}
</p>
</div>
<div class="col-md-4">
<span class="fa-stack fa-4x">
<i class="fa fa-circle fa-stack-2x text-primary"></i>
<i class="fa fa-lock fa-stack-1x fa-inverse"></i>
<i class="fa fa-line-chart fa-stack-1x fa-inverse"></i>
</span>
<h4 class="service-heading text-light">Lorem ipsum</h4>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima maxime quam architecto quo inventore harum ex magni, dicta impedit.</p>
<h4 class="service-heading text-light">{% trans 'Diary' %}</h4>
<p class="text-muted">
{% blocktrans trimmed %}
Enter the weights and repetitions you did for each exercise to generate
diagrams that let you see at a glance how well you are doing. The raw
numbers are of course still accessible.
{% endblocktrans %}
{% trans "You can also enter notes and a general impression (great, neutral, etc.)" %}
</p>
</div>
</div>
</div>
@@ -105,12 +125,16 @@ it. Select from more than 8000 ingredients for this.{% endblocktrans %}</p>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>{% trans "Weight tracker" %}</h4>
<h4 class="subheading">{% trans "Weight tracker" %}</h4>
</div>
<div class="timeline-body">
<p class="text-muted">{% blocktrans %}keep track of your progress with the weight log chart
for each exercise and your own body weight. This makes it easy to see if you
are reaching your goals or need to adjust something.{% endblocktrans %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
Keep track of your progress with the body weight chart. This makes
it easy to see if you are reaching your goals or need to adjust
something. You can receive reminders so you regularly enter the
data.
{% endblocktrans %}
</p>
</div>
</div>
</li>
@@ -121,13 +145,16 @@ it. Select from more than 8000 ingredients for this.{% endblocktrans %}</p>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>{% trans 'Exercise database' %}</h4>
<h4 class="subheading">Exercises</h4>
</div>
<div class="timeline-body">
<p class="text-muted">{% blocktrans %}The exercise database contains around hundred exercises
from which you can choose when creating a workout. Some have important notes
about the form to perform them. This is displayed in the workout overview
page, so you keep them in mind.{% endblocktrans %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
The exercise database contains around hundred exercises
from which you can choose when creating a workout. Some have important notes
about the form to perform them. This is displayed in the workout overview
page, so you keep them in mind.
{% endblocktrans %}
</p>
</div>
</div>
</li>
@@ -138,37 +165,42 @@ it. Select from more than 8000 ingredients for this.{% endblocktrans %}</p>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>{% trans 'Gym management' %}</h4>
<h4 class="subheading">Manage Gyms</h4>
</div>
<div class="timeline-body">
<p class="text-muted">{% blocktrans %}Use the application for your gym to manage its
members, their workouts and attendance. Keep an eye on inactive members with
optional notifications. You can create users with different roles to
distribute the administrative tasks such as trainer or gym manager.{% endblocktrans %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
Use the application for your gym to manage its
members, their workouts and attendance. Keep an eye on inactive members with
optional notifications. You can create users with different roles to
distribute the administrative tasks such as trainer or gym manager.
{% endblocktrans %}
</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<img class="img-circle img-responsive" src="{% static 'images/workout-log.png' %}" alt="">
<img class="img-circle img-responsive" src="{% static 'images/rest-api.png' %}" alt="">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>{% trans 'Workout log' %}</h4>
<h4 class="subheading">Log Your Workouts</h4>
<h4>{% trans "REST API" %}</h4>
</div>
<div class="timeline-body">
<p class="text-muted">{% blocktrans %}You can enter
the weights and repetitions you did for each exercise. As with the (body) weight,
it will generate some diagrams so you can see at a glance how well you are doing.
The raw numbers are still accessible as a table.{% endblocktrans %}
{% trans "You can also enter notes and a general impression (great, neutral, etc.)" %}</p>
<p class="text-muted">
{% blocktrans trimmed %}
wger provides a REST API with full read write access to all data
so you can integrate your own application and tools. Publicly accessible
data such as exercises you don't need any form of authentication,
for other objects such as workouts you need to get an API key.
{% endblocktrans %}
</p>
</div>
</div>
</li>
<li class="timeline-inverted">
<div class="timeline-image">
<h4>{% blocktrans %}100% Free
<h4>{% blocktrans trimmed %}100% Free
<br>and
<br>Open Source{% endblocktrans %}
</h4>