forked from 20minutes/colette-kss-builder
-
Notifications
You must be signed in to change notification settings - Fork 0
/
base.twig
124 lines (117 loc) · 5.55 KB
/
base.twig
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<title>{{ options.title }}</title>
<meta name="description" content="">
<meta name="generator" content="kss-node">
<meta name="viewport" content="width=device-width">
<script>
document.documentElement.className = document.documentElement.className.replace(/\bno-js\b/, 'js');
if (window.localStorage && window.localStorage.getItem('colette-font')) {
document.documentElement.className += ' webfont';
}
</script>
<link rel="stylesheet" href="kss-assets/kss.min.css" />
{{ styles|raw }}
</head>
<body class="co">
{#
Inject svg symboles
use this inline style to prevent bug from display:none with svg mask and gradients
#}
{% if options.svgSprite -%}
<div aria-hidden="true" style="height:0;width:0;position:absolute;visibility:hidden;overflow:hidden">{{ options.svgSprite|raw }}</div>
{%- endif %}
{% block body %}
<div class="co_wrapper">
{% block navigation %}
<header>
<div class="co_navbar">
<div class="co_wrap co_navbar-layout">
<button class="co_navbar-menuButton" id="trigger">
<svg width="30" height="30"><use xlink:href="#symbol-menu"/></svg>
<span class="co_mask">Aller au menu</span>
</button>
<div>
Night mode
<button role="switch" class="co_switch co_switch-darkMode" aria-checked="false" data-target="html">
<span class="co_switch-wrap">
<span class="co_switch-on">On</span>
<svg class="co_switch-thumb" height="11" width="11">
<use xlink:href="#symbol-tick"></use>
</svg>
<span class="co_switch-off">Off</span>
</span>
</button>
</div>
</div>
</div>
<div id="sidebar" class="co_sidebar">
<div class="co_sidebar-brand">
<a href="./">
<svg width="60" height="60"><use xlink:href="#symbol-logo"/></svg>
<span class="co_mask">Retour à l’accueil</span>
</a>
</div>
<div class="co_pa1 co_align-center">
Night mode
<button role="switch" class="co_switch co_switch-darkMode" aria-checked="false" data-target="html">
<span class="co_switch-wrap">
<span class="co_switch-on">On</span>
<svg class="co_switch-thumb" height="11" width="11">
<use xlink:href="#symbol-tick"></use>
</svg>
<span class="co_switch-off">Off</span>
</span>
</button>
</div>
<ul>
<li><a href="./">About</a></li>
{% for menu_item in menu %}
<li {% if menu_item.isActive %} class="co_sidebar-active"{% endif %}>
<a href="section-{{ menu_item.referenceURI }}.html">{{ menu_item.header }}</a>
{% if menu_item.children|length %}
{# Display 1st level of sub navigation #}
<ul class="co_sidebar-children">
{% for child in menu_item.children if not child.isGrandChild %}
<li {% if child.isActive %} class="co_sidebar-active"{% endif %}>
<a href="section-{{ menu_item.referenceURI ~ '.html#kssref-' ~ child.referenceURI }}">{{ child.header }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
</header>
{% endblock %}
{% block content %}
<article role="main" class="co_page co_pb6">
Base template
</article>
{% endblock %}
{% block footer %}
<footer class="co_footer co_footerbar">
<div class="co_wrap co_clearfix">
<p class="co_float-left">© Copyright <a href="http://www.20minutes.fr">20 Minutes</a></p>
<p class="co_float-right"><a href="https://twitter.com/Tech20Minutes" class="co_ml2"> Follow us </a></p>
<p class="co_float-right"><a href="https://github.com/20minutes/colette" class="co_ml2"> View it on Github</a></p>
</div>
</footer>
{% endblock %}
</div>
{% block overlay %}
<span id="overlay" class="co_overlay" aria-hidden="true">
<button id="close">✕<span class="co_mask">Fermer</span></button>
</span>
{% endblock %}
{% endblock %}
<!-- scripts -->
{% block kss_scripts %}
<script async src="kss-assets/kss.bundle.js"></script>
{% endblock %}
{{ scripts|raw }}
</body>
</html>