summaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
Diffstat (limited to 'templates')
-rw-r--r--templates/base.html12
-rw-r--r--templates/layouts/index.html79
-rw-r--r--templates/symbols.svg41
3 files changed, 88 insertions, 44 deletions
diff --git a/templates/base.html b/templates/base.html
index 1d0da4d..c7f641c 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -32,7 +32,7 @@
32</head> 32</head>
33 33
34<body> 34<body>
35 <nav class="c-nav"> 35 <!--<nav class="c-nav">
36 <a class="c-nav__logo" href="/" title="$site.title$"> 36 <a class="c-nav__logo" href="/" title="$site.title$">
37 <svg class="c-nav__logo-symbol"> 37 <svg class="c-nav__logo-symbol">
38 <use href="#logo"></use> 38 <use href="#logo"></use>
@@ -41,7 +41,15 @@
41 $for(menus.main.items)$ 41 $for(menus.main.items)$
42 <a class="c-nav__item $if(it.active)$c-nav__item--active$endif$" href="$it.url$">$it.label$</a> 42 <a class="c-nav__item $if(it.active)$c-nav__item--active$endif$" href="$it.url$">$it.label$</a>
43 $endfor$ 43 $endfor$
44 </nav> 44 </nav>-->
45
46 <a class="c-outer-button c-outer-button--logo c-logo" href="/" title="$site.title$">
47 <span class="c-outer-button__icon">
48 <svg class="c-outer-button__icon-symbol">
49 <use href="#logo"></use>
50 </svg>
51 </span>
52 </a>
45 53
46 $if(section.is_index)$ 54 $if(section.is_index)$
47${layouts/index()} 55${layouts/index()}
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index d819455..3145b69 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -1,5 +1,5 @@
1<main> 1<main>
2 <section class="l-landing"> 2 <section class="l-section l-landing">
3 <header class="l-landing__banner"> 3 <header class="l-landing__banner">
4 <div class="c-landing-banner l-container l-container--pad-x l-container--pad-y l-container--content"> 4 <div class="c-landing-banner l-container l-container--pad-x l-container--pad-y l-container--content">
5 <h1 class="c-landing-banner__title"> 5 <h1 class="c-landing-banner__title">
@@ -8,41 +8,40 @@
8 </span> 8 </span>
9 </h1> 9 </h1>
10 <p class="c-landing-banner__text"> 10 <p class="c-landing-banner__text">
11 Welcome to my website! I'm Volpeon, a red fox disguised as a human. 11 Hi, I'm Volpeon. I enjoy programming, creating vector art and designing user interfaces.
12 I enjoy programming, creating vector art and designing user interfaces.
13 </p> 12 </p>
14 </div> 13 </div>
15 </header> 14 </header>
16 15
17 <section class="l-landing__content"> 16 <section class="l-landing__content">
18 <div class="l-container l-container--pad-x l-container--pad-y l-container--content s-body"> 17 <div class="l-container l-container--pad-x l-container--pad-y l-container--content s-body">
19 <h1 class="c-section-heading">My profiles</h1>
20
21 <div class="l-card-grid"> 18 <div class="l-card-grid">
22 $for(profiles)$ 19 $for(profiles)$
23 $if(it.url)$ 20 $if(it.featured)$
24 <a class="c-card" href="$it.url$"> 21 $if(it.url)$
25 $else$ 22 <a class="l-card-grid__card c-card" href="$it.url$">
26 <div class="c-card"> 23 $else$
27 $endif$ 24 <div class="l-card-grid__card c-card">
28 $if(it.icon)$
29 <svg class="c-card__icon o-icon">
30 <use href="#icon-$it.icon$"></use>
31 </svg>
32 $endif$ 25 $endif$
33 <div class="c-card__content"> 26 $if(it.icon)$
34 <strong class="u-db">$it.platform$</strong> 27 <svg class="c-card__icon o-icon">
35 <small class="u-db">$it.username$</small> 28 <use href="#icon-$it.icon$"></use>
36 </div> 29 </svg>
30 $endif$
31 <div class="c-card__content">
32 <strong class="u-db">$it.platform$</strong>
33 <small class="u-db">$it.username$</small>
34 </div>
35 $if(it.url)$
36 <svg class="c-card__icon o-icon">
37 <use href="#icon-link-external"></use>
38 </svg>
39 $endif$
37 $if(it.url)$ 40 $if(it.url)$
38 <svg class="c-card__icon o-icon"> 41 </a>
39 <use href="#icon-link-external"></use> 42 $else$
40 </svg> 43 </div>
41 $endif$ 44 $endif$
42 $if(it.url)$
43 </a>
44 $else$
45 </div>
46 $endif$ 45 $endif$
47 $endfor$ 46 $endfor$
48 </div> 47 </div>
@@ -52,7 +51,31 @@ $body$
52 </section> 51 </section>
53 </section> 52 </section>
54 53
55 $-- <footer class="c-footer l-container"> 54 <section class="l-section">
56 $-- 9thPK7O3xn 55 <header class="l-section__heading">
57 $-- </footer> 56 <a class="c-outer-button" href="#projects" id="projects">
57 <span class="c-outer-button__icon">
58 <svg class="c-outer-button__icon-symbol o-icon">
59 <use href="#icon-arrow-down-right"></use>
60 </svg>
61 </span>
62 <span class="c-outer-button__content">
63 Projects
64 </span>
65 </a>
66 </header>
67 </section>
68
69 <footer class="c-footer">
70 <div class="c-footer__content">
71 9thPK7O3xn
72 </div>
73 <a class="c-outer-button" href="#">
74 <span class="c-outer-button__icon">
75 <svg class="c-outer-button__icon-symbol o-icon">
76 <use href="#icon-arrow-up"></use>
77 </svg>
78 </span>
79 </a>
80 </footer>
58</main> 81</main>
diff --git a/templates/symbols.svg b/templates/symbols.svg
index 7972457..902cc35 100644
--- a/templates/symbols.svg
+++ b/templates/symbols.svg
@@ -7,36 +7,49 @@
7 <path fill="currentColor" stroke="none" d="M 9.915975,13 H 12.08401 L 15.584018,3 h -2.168036 z" /> 7 <path fill="currentColor" stroke="none" d="M 9.915975,13 H 12.08401 L 15.584018,3 h -2.168036 z" />
8 </symbol> 8 </symbol>
9 9
10 <symbol id="icon-arrow-down-right" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
11 <path d="m5.25 11.75h6.5v-6.5m0 6.5-7.5-7.5" fill="none" stroke="currentColor" />
12 </symbol>
13
14 <symbol id="icon-arrow-up" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
15 <path d="m12.25 7.25-4.5-4.5-4.5 4.5m4.5-4.5v10.5" fill="none" stroke="currentColor" />
16 </symbol>
17
10 <symbol id="icon-envelope" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 18 <symbol id="icon-envelope" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
11 <path fill="none" stroke="currentColor" 19 <path
12 d="m1.25 4.9995 6.75 4.25 6.75-4.25m-12.75-2.125h12c0.4155 0 0.75 0.3345 0.75 0.75v8.8755c0 0.4155-0.3345 0.75-0.75 0.75h-12c-0.4155 0-0.75-0.3345-0.75-0.75v-8.8755c0-0.4155 0.3345-0.75 0.75-0.75z" /> 20 d="m1.25 3.5c0-0.4155 0.3345-0.75 0.75-0.75h12c0.4155 0 0.75 0.3345 0.75 0.75v8.5c0 0.4155-0.3345 0.75-0.75 0.75h-12c-0.4155 0-0.75-0.3345-0.75-0.75zm0 0.25 5.2845 4.3681c1.0065 0.83198 1.9181 0.82912 2.9676-0.03704l5.2479-4.3311"
21 fill="none" stroke="currentColor" />
13 </symbol> 22 </symbol>
14 23
15 <symbol id="icon-hash" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 24 <symbol id="icon-hash" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
16 <path fill="none" stroke="currentColor" d="m5.2497 13.75 1.0003-11m2.9997 11 1.0003-11m-7.5 3.5h10m-10 4h10" /> 25 <path d="m4.7501 14.25 0.99984-12m4 12 1.0002-12m-8.5001 3.5h11m-11 5h11" fill="none" stroke="currentColor" />
17 </symbol> 26 </symbol>
18 27
19 <symbol id="icon-messages" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 28 <symbol id="icon-messages" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
20 <path fill="none" stroke="currentColor" 29 <path
21 d="m 2.5,1.75 h 8 c 0.4155,0 0.75,0.3345 0.75,0.75 v 5.499875 c 0,0.4155 -0.3345,0.75 -0.75,0.75 H 4.75 l -3,3.00025 V 2.5 C 1.75,2.0845 2.0845,1.75 2.5,1.75 Z" /> 30 d="m1.5 1.25h9c0.4155 0 0.75 0.3345 0.75 0.75v6.9999c0 0.4155-0.3345 0.75-0.75 0.75h-7.25l-2.5 2.5001v-10.25c0-0.4155 0.3345-0.75 0.75-0.75z"
22 <path fill="none" stroke="currentColor" d="m 6.75,11.750125 h 4.5 l 3,3 V 6.25" /> 31 fill="none" stroke="currentColor" />
32 <path d="m5.25 12.75h7.5l2.5 2.5001v-10.25c0-0.4155-0.3345-0.75-0.75-0.75h-0.25" fill="none"
33 stroke="currentColor" />
23 </symbol> 34 </symbol>
24 35
25 <symbol id="icon-link-external" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 36 <symbol id="icon-link-external" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
26 <path fill="none" stroke="currentColor" d="m 5.25,4.25 h 6.5 v 6.5 m 0,-6.5 -7.5,7.5" /> 37 <path d="m5.25 4.25h6.5v6.5m0-6.5-7.5 7.5" fill="none" stroke="currentColor" />
27 </symbol> 38 </symbol>
28 39
29 <symbol id="icon-bandcamp" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 40 <symbol id="icon-parallelogram" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
30 <path fill="none" stroke="currentColor" d="m 15.25,4.25 -5,7.5 h -9.5 l 5,-7.5 z" /> 41 <path d="m15.25 4.25-5 7.5h-9.5l5-7.5z" fill="none" stroke="currentColor" />
31 </symbol> 42 </symbol>
32 43
33 <symbol id="icon-play" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 44 <symbol id="icon-video" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
34 <path fill="none" stroke="currentColor" d="M 4.25,3.25 11.75,8 4.25,12.75 Z" /> 45 <path d="m6.75 6.25 2.5 2-2.5 2z" fill="currentColor" stroke="currentColor" />
46 <rect x=".75" y="2.25" width="14.5" height="12" ry=".75" fill="none" stroke="currentColor" />
35 </symbol> 47 </symbol>
36 48
37 <symbol id="icon-share" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 49 <symbol id="icon-graph" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
38 <path fill="none" stroke="currentColor" 50 <path
39 d="M 5.75,8 A 1.75,1.75 0 0 1 4,9.75 1.75,1.75 0 0 1 2.25,8 1.75,1.75 0 0 1 4,6.25 1.75,1.75 0 0 1 5.75,8 Z m 7.5,-4 A 1.75,1.75 0 0 1 11.5,5.75 1.75,1.75 0 0 1 9.75,4 1.75,1.75 0 0 1 11.5,2.25 1.75,1.75 0 0 1 13.25,4 Z m 0,8 A 1.75,1.75 0 0 1 11.5,13.75 1.75,1.75 0 0 1 9.75,12 1.75,1.75 0 0 1 11.5,10.25 1.75,1.75 0 0 1 13.25,12 Z M 5.5273914,7.1280734 9.9,4.75 M 5.5098034,8.8930085 9.9,11.25" /> 51 d="m15.25 10.5a2.25 2.25 0 0 1-2.25 2.25 2.25 2.25 0 0 1-2.25-2.25 2.25 2.25 0 0 1 2.25-2.25 2.25 2.25 0 0 1 2.25 2.25zm-10 2.5a2.25 2.25 0 0 1-2.25 2.25 2.25 2.25 0 0 1-2.25-2.25 2.25 2.25 0 0 1 2.25-2.25 2.25 2.25 0 0 1 2.25 2.25zm2.5-10a2.25 2.25 0 0 1-2.25 2.25 2.25 2.25 0 0 1-2.25-2.25 2.25 2.25 0 0 1 2.25-2.25 2.25 2.25 0 0 1 2.25 2.25zm-2.5378 9.4469 5.5686-1.3921m0.61265-2.1613-4.2845-4.2845m-2.1627 0.6058-1.4004 5.6015"
52 fill="none" stroke="currentColor" />
40 </symbol> 53 </symbol>
41 </defs> 54 </defs>
42</svg> 55</svg>