summaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
Diffstat (limited to 'templates')
-rw-r--r--templates/base.html61
-rw-r--r--templates/layouts/categorized_list.html37
-rw-r--r--templates/layouts/index.html165
-rw-r--r--templates/layouts/page.html18
-rw-r--r--templates/symbols.svg6
5 files changed, 144 insertions, 143 deletions
diff --git a/templates/base.html b/templates/base.html
index c7f641c..625b025 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -32,32 +32,51 @@
32</head> 32</head>
33 33
34<body> 34<body>
35 <!--<nav class="c-nav"> 35 <nav class="c-header">
36 <a class="c-nav__logo" href="/" title="$site.title$"> 36 <a class="c-outer-button c-outer-button--inverted" href="/" title="$site.title$">
37 <svg class="c-nav__logo-symbol"> 37 <span class="c-outer-button__icon">
38 <use href="#logo"></use> 38 <svg class="c-outer-button__icon-symbol">
39 </svg> 39 <use href="#logo"></use>
40 </svg>
41 </span>
40 </a> 42 </a>
41 $for(menus.main.items)$ 43 $if(section.is_index)$
42 <a class="c-nav__item $if(it.active)$c-nav__item--active$endif$" href="$it.url$">$it.label$</a> 44 $else$
43 $endfor$ 45 $for(menus.main.items)$
44 </nav>--> 46 $if(it.active)$
45 47 <a class="c-outer-button" href="$it.url$">
46 <a class="c-outer-button c-outer-button--logo c-logo" href="/" title="$site.title$"> 48 <span class="c-outer-button__content">
47 <span class="c-outer-button__icon"> 49 $it.label$
48 <svg class="c-outer-button__icon-symbol"> 50 </span>
49 <use href="#logo"></use> 51 </a>
50 </svg> 52 $endif$
51 </span> 53 $endfor$
52 </a> 54 $endif$
55 </nav>
53 56
54 $if(section.is_index)$ 57 <main>
58 $if(section.is_index)$
55${layouts/index()} 59${layouts/index()}
56 $elseif(layout.is_categorized_list)$ 60 $elseif(layout.is_categorized_list)$
57${layouts/categorized_list()} 61${layouts/categorized_list()}
58 $else$ 62 $else$
59${layouts/page()} 63${layouts/page()}
60 $endif$ 64 $endif$
65
66 <a class="c-outer-button c-outer-button--scroll-top" href="#" title="To the top">
67 <span class="c-outer-button__icon">
68 <svg class="c-outer-button__icon-symbol o-icon">
69 <use href="#icon-arrow-up"></use>
70 </svg>
71 </span>
72 </a>
73
74 <footer class="c-footer">
75 <div class="c-footer__content">
76 9thPK7O3xn
77 </div>
78 </footer>
79 </main>
61 80
62 ${symbols.svg()} 81 ${symbols.svg()}
63</body> 82</body>
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index 8c25ec0..0e9142f 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -1,23 +1,22 @@
1<main> 1<section class="l-section l-section--no-head">
2 <div class="c-page s-page l-container l-container--content l-container--pad-x l-container--pad-y"> 2 <div class="l-container l-container--pad-x l-container--pad-y l-container--content">
3 <div class="c-page__content s-page-content">
4$body$ 3$body$
5 4
6 $for(pages.by_category)$ 5 $for(pages.by_category)$
7 <h2 class="c-page__prefixed c-page__prefixed--h2"> 6 <h2>
8 $for(it.value/first)$ 7 $for(it.value/first)$
9 $it.category.name$ 8 $it.category.name$
10 $endfor$ 9 $endfor$
11 </h2> 10 </h2>
12 <ul> 11 <ul>
13 $for(it.value)$ 12 $for(it.value)$
14 <li class="c-page__prefixed c-page__prefixed--ref"> 13 <li>
15 <a href="$it.url.rel$">$it.title$</a> 14 <a href="$it.url.rel$">$it.title$</a>
16 </li> 15 </li>
17 $endfor$ 16 $endfor$
18 </ul> 17 </ul>
19 $endfor$ 18 $endfor$
20 </div>
21 </div> 19 </div>
22</main> 20</section>
21
23 22
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index 4163093..327f9f5 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -1,95 +1,80 @@
1<main> 1<section class="l-section l-section--no-head l-landing">
2 <section class="l-section l-section--no-head l-landing"> 2 <header class="l-landing__banner">
3 <header class="l-landing__banner"> 3 <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"> 4 <h1 class="c-landing-banner__title">
5 <h1 class="c-landing-banner__title"> 5 <span class="c-landing-banner__title-inner">
6 <span class="c-landing-banner__title-inner"> 6 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. 7 </span>
8 </span> 8 </h1>
9 </h1> 9 <p class="c-landing-banner__text">
10 <p class="c-landing-banner__text"> 10 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. 11 </p>
12 </p> 12 </div>
13 </div> 13 </header>
14 </header>
15 14
16 <section class="l-landing__content"> 15 <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"> 16 <div class="l-container l-container--pad-x l-container--pad-y l-container--content u-pt0@md-lo">
18 <div class="l-card-grid"> 17 <div class="l-card-grid">
19 $for(profiles)$ 18 $for(profiles)$
20 $if(it.featured)$ 19 $if(it.featured)$
21 $if(it.url)$ 20 $if(it.url)$
22 <a class="l-card-grid__card c-card" href="$it.url$"> 21 <a class="l-card-grid__card c-card" href="$it.url$">
23 $else$ 22 $else$
24 <div class="l-card-grid__card c-card"> 23 <div class="l-card-grid__card c-card">
25 $endif$ 24 $endif$
26 $if(it.icon)$ 25 $if(it.icon)$
27 <svg class="c-card__icon o-icon"> 26 <svg class="c-card__icon o-icon">
28 <use href="#icon-$it.icon$"></use> 27 <use href="#icon-$it.icon$"></use>
29 </svg> 28 </svg>
30 $endif$ 29 $endif$
31 <div class="c-card__content"> 30 <div class="c-card__content">
32 <strong class="u-db">$it.platform$</strong> 31 <strong class="u-db">$it.platform$</strong>
33 <small class="u-db">$it.username$</small> 32 <small class="u-db">$it.username$</small>
34 </div> 33 </div>
35 $if(it.url)$ 34 $if(it.url)$
36 <svg class="c-card__icon o-icon"> 35 <svg class="c-card__icon o-icon">
37 <use href="#icon-arrow-up-right"></use> 36 <use href="#icon-arrow-up-right"></use>
38 </svg> 37 </svg>
39 $endif$ 38 $endif$
40 $if(it.url)$ 39 $if(it.url)$
41 </a> 40 </a>
42 $else$ 41 $else$
43 </div> 42 </div>
44 $endif$ 43 $endif$
45 $endif$ 44 $endif$
46 $endfor$ 45 $endfor$
47 </div> 46 </div>
48 47
49$body$ 48$body$
50 </div> 49 </div>
51 </section> 50 </section>
52 </section> 51</section>
53 52
54 <section class="l-section"> 53<section class="l-section">
55 <header class="l-section__head"> 54 <header class="l-section__head">
56 <a class="c-outer-button" href="#projects" id="projects"> 55 <a class="c-outer-button" href="#projects" id="projects">
57 <span class="c-outer-button__icon"> 56 <span class="c-outer-button__icon">
58 <svg class="c-outer-button__icon-symbol o-icon"> 57 <svg class="c-outer-button__icon-symbol o-icon">
59 <use href="#icon-arrow-down-right"></use> 58 <use href="#icon-arrow-down-right"></use>
60 </svg> 59 </svg>
61 </span> 60 </span>
62 <span class="c-outer-button__content"> 61 <span class="c-outer-button__content">
63 $sections.projects.title$ 62 $subsections.projects.title$
64 </span> 63 </span>
65 </a> 64 </a>
66 </header> 65 </header>
67 66
68 <div class="l-container l-container--pad-x l-container--pad-y l-container--content l-card-grid"> 67 <div class="l-container l-container--pad-x l-container--pad-y l-container--content l-card-grid">
69 $for(sections.projects.pages)$ 68 $for(subsections.projects.pages)$
70 <a class="l-card-grid__card c-card" href="$it.url.rel$"> 69 <a class="l-card-grid__card c-card" href="$it.url.rel$">
71 <div class="c-card__content"> 70 <div class="c-card__content">
72 <small class="u-db">$it.category.name$</small> 71 <small class="u-db">$it.category.name$</small>
73 <strong class="u-db">$it.title$</strong> 72 <strong class="u-db">$it.title$</strong>
74 </div> 73 </div>
75 <svg class="c-card__icon o-icon"> 74 <svg class="c-card__icon o-icon">
76 <use href="#icon-arrow-right"></use> 75 <use href="#icon-arrow-right"></use>
77 </svg> 76 </svg>
78 </a> 77 </a>
79 $endfor$ 78 $endfor$
80 </div> 79 </div>
81 </section> 80</section>
82
83 <footer class="c-footer">
84 <a class="c-outer-button c-outer-button--icon-only" href="#" title="To the top">
85 <span class="c-outer-button__icon">
86 <svg class="c-outer-button__icon-symbol o-icon">
87 <use href="#icon-arrow-up"></use>
88 </svg>
89 </span>
90 </a>
91 <div class="c-footer__content u-ar">
92 9thPK7O3xn
93 </div>
94 </footer>
95</main>
diff --git a/templates/layouts/page.html b/templates/layouts/page.html
index 9e7d85a..e006ddc 100644
--- a/templates/layouts/page.html
+++ b/templates/layouts/page.html
@@ -1,15 +1,7 @@
1<main> 1<section class="l-section l-section--no-head">
2 <div class="c-page l-container l-container--content l-container--pad-x l-container--pad-y"> 2 <div class="l-container l-container--pad-x l-container--pad-y l-container--content s-body">
3 <div class="c-page__content s-page-content"> 3 <h1>$title$</h1>
4 <header class="c-page__header">
5 <h1 class="c-page__prefixed c-page__prefixed--h1 c-page__header__title">$title$</h1>
6 $if(category)$
7 <h2 class="c-page__header__meta">in $category.name$</h2>
8 $endif$
9 </header>
10 4
11$body$ 5 $body$
12 </div>
13 </div> 6 </div>
14</main> 7</section>
15
diff --git a/templates/symbols.svg b/templates/symbols.svg
index d884bc0..958e271 100644
--- a/templates/symbols.svg
+++ b/templates/symbols.svg
@@ -55,5 +55,11 @@
55 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" 55 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"
56 fill="none" stroke="currentColor" /> 56 fill="none" stroke="currentColor" />
57 </symbol> 57 </symbol>
58
59 <symbol id="icon-git-branch" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
60 <path
61 d="m12.25 5.75c0 3.5899-2.9101 6.5-6.5 6.5m3e-7 0c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm8.5-8.5c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm-10.5 6.4998v-7.9998"
62 fill="none" stroke="currentColor" />
63 </symbol>
58 </defs> 64 </defs>
59</svg> 65</svg>