Add extra parallax layer over image
- Author
- Maarten 'Vngngdn' Vangeneugden
- Date
- July 8, 2017, 4:36 a.m.
- Hash
- c83b6725f56e44f45adeb33d43af6049319f2a25
- Parent
- ad8c0061cb5adb7f22903dbed792dc5f30af352d
- Modified file
- templates/about/index.html
templates/about/index.html ¶
6 additions and 0 deletions.
View changes Hide changes
1 |
1 |
{% load i18n %} |
2 |
2 |
|
3 |
3 |
{% block title %}{% trans "Maarten | Main page" %}{% endblock title %} |
4 |
4 |
{% block header %} |
5 |
5 |
{#{% include "website/navbar.html" %}#} |
6 |
6 |
{#{{ block.super }}#} |
7 |
7 |
{% comment %}{% if quote.link %} |
8 |
8 |
<p class="container white-text"> |
9 |
9 |
<a class="white-text" href="{{ quote.link }}" target="_blank"> |
10 |
10 |
{% endif %} |
11 |
11 |
{{ quote.author }} |
12 |
12 |
{% if quote.link %} |
13 |
13 |
</a> |
14 |
14 |
{% endif %} |
15 |
15 |
</p> |
16 |
16 |
{% endcomment %} |
17 |
17 |
</div> |
18 |
18 |
{% endblock header %} |
19 |
19 |
{% block description %}{% blocktrans %}Maarten's personal place on the internet. Make yourself at home!{% endblocktrans %} |
20 |
20 |
{% endblock description %} |
21 |
21 |
{% block main %} |
22 |
22 |
{% with mdac=materialDesign_accentColor %} {# You'll see why this is handy shortly. #} |
23 |
23 |
{% with mdc=materialDesign_color %} {# You'll see why this is handy shortly. #} |
24 |
24 |
<div class="parallax"> |
25 |
25 |
<div class="parallax_group"> |
26 |
26 |
<div class="parallax_layer parallax_layer-base"> |
27 |
27 |
<header> |
28 |
28 |
{% include "website/navbar.html" %} |
29 |
29 |
</header> |
30 |
30 |
</div> |
31 |
31 |
</div> |
32 |
32 |
<div class="parallax_group"> |
33 |
33 |
<div class="parallax_layer parallax_layer-back"> |
34 |
34 |
{{ parallax_src|safe }} |
35 |
35 |
</div> |
36 |
36 |
<div class="parallax_layer parallax_layer-base"> |
+ |
37 |
</div> |
+ |
38 |
<div class="parallax_group"> |
+ |
39 |
<div class="parallax_layer parallax_layer-base"> |
37 |
40 |
<div class="section {{ materialDesign_color }} lighten-2"> |
38 |
41 |
<p class="flow-text container white-text">{{ status }}</p> |
39 |
42 |
{# TODO: Make the "quote section" less obtrusive, i.e. make it smaller #} |
40 |
43 |
<div class="section {{ materialDesign_color }} z-depth-3"> |
41 |
44 |
<div class="container"> |
42 |
45 |
<div class="white-text"> |
43 |
46 |
<h3>{% trans "Welcome!" %}</h3> |
44 |
47 |
<p> |
45 |
48 |
{% blocktrans %}Hello there! I'm Maarten, a happy |
46 |
49 |
hacker from Belgium, and this is my amazing personal website. |
47 |
50 |
I like a lot of things, and I share some of those in here. Take |
48 |
51 |
a look around, read a bit, talk with me, and most importantly, |
49 |
52 |
enjoy your stay!{% endblocktrans %} |
50 |
53 |
</p> |
51 |
54 |
</div> |
52 |
55 |
</div> |
53 |
56 |
</div> |
54 |
57 |
{% include "about/main_content.html" %} |
55 |
58 |
</div> |
56 |
59 |
</div> |
57 |
60 |
</div> |
58 |
61 |
</div> |
59 |
62 |
{% endwith %} |
60 |
63 |
{% endwith %} |
61 |
64 |
{% endblock main %} |
62 |
65 |
|
+ |
66 |
{% block footer %} |
+ |
67 |
{% endblock footer %} |
+ |
68 |