summaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-04-15 20:21:14 +0200
committerVolpeon <git@volpeon.ink>2021-04-15 20:21:14 +0200
commit9e373cfbb0bd98480560a00978fd6d51113ffe06 (patch)
treee8755ba923c66b992e1b5de591fb24a37a27d43b /templates
parentUpdate (diff)
downloadvolpeon.ink-9e373cfbb0bd98480560a00978fd6d51113ffe06.tar.gz
volpeon.ink-9e373cfbb0bd98480560a00978fd6d51113ffe06.tar.bz2
volpeon.ink-9e373cfbb0bd98480560a00978fd6d51113ffe06.zip
Fetch pages of sections
Diffstat (limited to 'templates')
-rw-r--r--templates/layouts/index.html192
-rw-r--r--templates/symbols.svg2
2 files changed, 88 insertions, 106 deletions
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index d39e70a..4163093 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -1,113 +1,95 @@
1<main> 1<main>
2 <section class="l-section l-landing"> 2 <section class="l-section l-section--no-head 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">
6 <span class="c-landing-banner__title-inner"> 6 <span class="c-landing-banner__title-inner">
7 I'm a <strong class="c-landing-banner__emph">red fox</strong> in disguise. 7 I'm a <strong class="c-landing-banner__emph">red fox</strong> in disguise.
8 </span> 8 </span>
9 </h1> 9 </h1>
10 <p class="c-landing-banner__text"> 10 <p class="c-landing-banner__text">
11 Hi, I'm Volpeon. I enjoy programming, creating vector art and designing user interfaces. 11 Hi, I'm Volpeon. I enjoy programming, creating vector art and designing user interfaces.
12 </p> 12 </p>
13 </div> 13 </div>
14 </header> 14 </header>
15 15
16 <section class="l-landing__content"> 16 <section class="l-landing__content">
17 <div class="l-container l-container--pad-x l-container--pad-y l-container--content s-body u-pt0@md-lo"> 17 <div class="l-container l-container--pad-x l-container--pad-y l-container--content s-body u-pt0@md-lo">
18 <div class="l-card-grid"> 18 <div class="l-card-grid">
19 $for(profiles)$ 19 $for(profiles)$
20 $if(it.featured)$ 20 $if(it.featured)$
21 $if(it.url)$ 21 $if(it.url)$
22 <a class="l-card-grid__card c-card" href="$it.url$"> 22 <a class="l-card-grid__card c-card" href="$it.url$">
23 $else$ 23 $else$
24 <div class="l-card-grid__card c-card"> 24 <div class="l-card-grid__card c-card">
25 $endif$ 25 $endif$
26 $if(it.icon)$ 26 $if(it.icon)$
27 <svg class="c-card__icon o-icon"> 27 <svg class="c-card__icon o-icon">
28 <use href="#icon-$it.icon$"></use> 28 <use href="#icon-$it.icon$"></use>
29 </svg> 29 </svg>
30 $endif$ 30 $endif$
31 <div class="c-card__content"> 31 <div class="c-card__content">
32 <strong class="u-db">$it.platform$</strong> 32 <strong class="u-db">$it.platform$</strong>
33 <small class="u-db">$it.username$</small> 33 <small class="u-db">$it.username$</small>
34 </div> 34 </div>
35 $if(it.url)$ 35 $if(it.url)$
36 <svg class="c-card__icon o-icon"> 36 <svg class="c-card__icon o-icon">
37 <use href="#icon-link-external"></use> 37 <use href="#icon-arrow-up-right"></use>
38 </svg> 38 </svg>
39 $endif$ 39 $endif$
40 $if(it.url)$ 40 $if(it.url)$
41 </a> 41 </a>
42 $else$ 42 $else$
43 </div> 43 </div>
44 $endif$ 44 $endif$
45 $endif$ 45 $endif$
46 $endfor$ 46 $endfor$
47 </div> 47 </div>
48 48
49$body$ 49$body$
50 </div> 50 </div>
51 </section> 51 </section>
52 </section> 52 </section>
53 53
54 <section class="l-section"> 54 <section class="l-section">
55 <header class="l-section__heading"> 55 <header class="l-section__head">
56 <a class="c-outer-button" href="#projects" id="projects"> 56 <a class="c-outer-button" href="#projects" id="projects">
57 <span class="c-outer-button__icon"> 57 <span class="c-outer-button__icon">
58 <svg class="c-outer-button__icon-symbol o-icon"> 58 <svg class="c-outer-button__icon-symbol o-icon">
59 <use href="#icon-arrow-down-right"></use> 59 <use href="#icon-arrow-down-right"></use>
60 </svg> 60 </svg>
61 </span> 61 </span>
62 <span class="c-outer-button__content"> 62 <span class="c-outer-button__content">
63 Projects 63 $sections.projects.title$
64 </span> 64 </span>
65 </a> 65 </a>
66 </header> 66 </header>
67 67
68 <div class="l-container l-container--pad-x l-container--pad-y l-card-grid u-my-auto"> 68 <div class="l-container l-container--pad-x l-container--pad-y l-container--content l-card-grid">
69 <a class="l-card-grid__card c-card" href="projects/blobfox-emojis/"> 69 $for(sections.projects.pages)$
70 <div class="c-card__content"> 70 <a class="l-card-grid__card c-card" href="$it.url.rel$">
71 <small class="u-db">Emojis</small> 71 <div class="c-card__content">
72 <strong class="u-db">Blobfox</strong> 72 <small class="u-db">$it.category.name$</small>
73 </div> 73 <strong class="u-db">$it.title$</strong>
74 <svg class="c-card__icon o-icon"> 74 </div>
75 <use href="#icon-arrow-right"></use> 75 <svg class="c-card__icon o-icon">
76 </svg> 76 <use href="#icon-arrow-right"></use>
77 </a> 77 </svg>
78 </a>
79 $endfor$
80 </div>
81 </section>
78 82
79 <a class="l-card-grid__card c-card" href="projects/bunhd-emojis/"> 83 <footer class="c-footer">
80 <div class="c-card__content"> 84 <a class="c-outer-button c-outer-button--icon-only" href="#" title="To the top">
81 <small class="u-db">Emojis</small> 85 <span class="c-outer-button__icon">
82 <strong class="u-db">BunHD</strong> 86 <svg class="c-outer-button__icon-symbol o-icon">
83 </div> 87 <use href="#icon-arrow-up"></use>
84 <svg class="c-card__icon o-icon"> 88 </svg>
85 <use href="#icon-arrow-right"></use> 89 </span>
86 </svg> 90 </a>
87 </a> 91 <div class="c-footer__content u-ar">
88 92 9thPK7O3xn
89 <!--<a class="l-card-grid__card c-card" href="#"> 93 </div>
90 <div class="c-card__content"> 94 </footer>
91 <small class="u-db">Icons</small>
92 <strong class="u-db">iro</strong>
93 </div>
94 <svg class="c-card__icon o-icon">
95 <use href="#icon-arrow-right"></use>
96 </svg>
97 </a>-->
98 </div>
99 </section>
100
101 <footer class="c-footer">
102 <a class="c-outer-button c-outer-button--icon-only" href="#" title="To the top">
103 <span class="c-outer-button__icon">
104 <svg class="c-outer-button__icon-symbol o-icon">
105 <use href="#icon-arrow-up"></use>
106 </svg>
107 </span>
108 </a>
109 <div class="c-footer__content u-ar">
110 9thPK7O3xn
111 </div>
112 </footer>
113</main> 95</main>
diff --git a/templates/symbols.svg b/templates/symbols.svg
index a5907e1..d884bc0 100644
--- a/templates/symbols.svg
+++ b/templates/symbols.svg
@@ -37,7 +37,7 @@
37 stroke="currentColor" /> 37 stroke="currentColor" />
38 </symbol> 38 </symbol>
39 39
40 <symbol id="icon-link-external" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 40 <symbol id="icon-arrow-up-right" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
41 <path d="m5.25 4.25h6.5v6.5m0-6.5-7.5 7.5" fill="none" stroke="currentColor" /> 41 <path d="m5.25 4.25h6.5v6.5m0-6.5-7.5 7.5" fill="none" stroke="currentColor" />
42 </symbol> 42 </symbol>
43 43