Commit 63ddb1e18247770a463500b04089782bbebae2cb
1 parent
bec0ea4cd3
Exists in
master
Ajout d'un template avec une variante sur le menu :
+ ouvert par défaut et affiché sur le côté gauche sur sa propre zone. + on peut le refermer augmentant la zone utilisée pour le contenu
Showing 2 changed files with 289 additions and 0 deletions Inline Diff
templates/html/Wize_with_index_sod.html
File was created | 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> | ||
2 | <html> | |||
3 | <head> | |||
4 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |||
5 | <title>[% title %]</title> | |||
6 | <meta name='Generator' content='[% generator.name %]'> | |||
7 | <link rel="stylesheet" | |||
8 | href="[% resource('common/zim-variables.css') %]" > | |||
9 | <link rel="stylesheet" | |||
10 | href="[% resource('common/zim-style.css') %]" > | |||
11 | <link rel="stylesheet" | |||
12 | href="[% resource('common/zim-table-style.css') %]" > | |||
13 | <link rel="stylesheet" | |||
14 | href="[% resource('common/zim-special.css') %]" > | |||
15 | <link rel="stylesheet" | |||
16 | href="[% resource('common/zim-hljs.css') %]" > | |||
17 | ||||
18 | <style type='text/css'> | |||
19 | ||||
20 | /* Comme on a le menu sur le côté */ | |||
21 | /* On augmente la taille de la page */ | |||
22 | :root { | |||
23 | --main-page-width: 80em; | |||
24 | } | |||
25 | ||||
26 | * { font-family: sans-serif } | |||
27 | ||||
28 | a:hover { text-decoration: underline; } | |||
29 | ||||
30 | /* Centre les images mais elles sont coupées aux sauts de page à l'impression */ | |||
31 | img { | |||
32 | display: block; | |||
33 | margin-left: auto; | |||
34 | margin-right: auto; | |||
35 | } | |||
36 | ||||
37 | /* Specifique au with index */ | |||
38 | span.insen { color: grey } | |||
39 | ||||
40 | .pages { | |||
41 | /*max-width: 1000px;*/ | |||
42 | /*padding-left: 320px;*/ | |||
43 | margin-left: 300px; | |||
44 | width: inherit; | |||
45 | transition: margin-left .3s; | |||
46 | background: white; | |||
47 | padding-left: 10px; | |||
48 | padding-right: 10px; | |||
49 | padding-bottom: 20px; | |||
50 | padding-top: 10px; | |||
51 | } | |||
52 | ||||
53 | .menu{ | |||
54 | float:left; | |||
55 | width: 300px; | |||
56 | color:var(--main-header-color); | |||
57 | overflow-x: hidden; | |||
58 | /*position: absolute;*/ | |||
59 | transition:.3s; | |||
60 | background: var(--main-menu-background-color); | |||
61 | border-style: solid; | |||
62 | border-width: 1px; | |||
63 | margin-left:-20px; | |||
64 | } | |||
65 | ||||
66 | .menu a,.menu a:link,.menu a:hover,.menu a:active,.menu a:visited { | |||
67 | color: var(--main-header-color); | |||
68 | } | |||
69 | ||||
70 | .menuOpen { | |||
71 | /*display: block;*/ | |||
72 | } | |||
73 | ||||
74 | .menuClosed { | |||
75 | border-style: unset; | |||
76 | } | |||
77 | ||||
78 | .header{ | |||
79 | max-width: var(--main-page-width); | |||
80 | position: fixed; | |||
81 | width: 100%; | |||
82 | top:0; | |||
83 | background:white; | |||
84 | z-index: 1; | |||
85 | } | |||
86 | ||||
87 | hr{ | |||
88 | clear:both; | |||
89 | border-style: solid; | |||
90 | border-width: 1px; | |||
91 | border-color: var(--main-header-color); | |||
92 | } | |||
93 | ||||
94 | body { | |||
95 | max-width: var(--main-page-width); | |||
96 | display:block; | |||
97 | margin-left:auto; | |||
98 | margin-right:auto; | |||
99 | background: var(--main-body-background-color); | |||
100 | } | |||
101 | ||||
102 | .intercalaire { | |||
103 | background:white; | |||
104 | margin-top: 48px; | |||
105 | padding: 10px; | |||
106 | } | |||
107 | ||||
108 | .bold-footer { | |||
109 | color: var(--main-header-color); | |||
110 | } | |||
111 | ||||
112 | .zemaster { | |||
113 | background: white; | |||
114 | } | |||
115 | ||||
116 | </style> | |||
117 | ||||
118 | <!-- Themes clair : | |||
119 | atom-one-light.css, vs.css googlecode.css github.css | |||
120 | qtcreator_light.css | |||
121 | Themes sombres : | |||
122 | agate.css vs2015.css atom-one-dark.css hybrid.css | |||
123 | ir-black.css sunburst.css tomorrow-night-bright.css | |||
124 | qtcreator_dark.css | |||
125 | Demo live : https://highlightjs.org/static/demo/ --> | |||
126 | <link rel="stylesheet" | |||
127 | href="[% resource('common/hljs/styles/sunburst.css') %]" > | |||
128 | ||||
129 | <!-- hljs --> | |||
130 | <script src="[% resource('common/hljs/highlight.pack.js') %]"></script> | |||
131 | ||||
132 | <script> | |||
133 | function openNav() { | |||
134 | if (document.getElementById("mySidenav").getAttribute("class").split(' ')[1] == "menuClosed") { | |||
135 | document.getElementById("mySidenav").style.width = "300px"; | |||
136 | document.getElementById("main").style.marginLeft = "300px"; | |||
137 | document.getElementById("mySidenav").setAttribute("class","menu menuOpen"); | |||
138 | /* Scroll to top when opening menu */ | |||
139 | document.body.scrollTop = 0 | |||
140 | document.documentElement.scrollTop = 0; | |||
141 | } else { | |||
142 | document.getElementById("mySidenav").style.width = "0"; | |||
143 | document.getElementById("main").style.marginLeft = "0"; | |||
144 | document.getElementById("mySidenav").setAttribute("class","menu menuClosed"); | |||
145 | } | |||
146 | } | |||
147 | </script> | |||
148 | </head> | |||
149 | <body> | |||
150 | ||||
151 | <!-- Header --> | |||
152 | <div class='header'> | |||
153 | <table class='navigation' style="float:left"> | |||
154 | <tr class='navigation'> | |||
155 | <td class='navigation'> | |||
156 | <span style="font-size:30px;cursor:pointer;color: var(--main-header-color);" onclick="openNav()">☰</span> | |||
157 | </td> | |||
158 | <td class='navigation'> | |||
159 | [% IF navigation.prev %] | |||
160 | <a href='[% uri(navigation.prev) %]'> | |||
161 | <img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> | |||
162 | </a> | |||
163 | [% ELSE %] | |||
164 | <img src="[% resource('common/arrow-left-inact.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> | |||
165 | [% END %] | |||
166 | </td> | |||
167 | <td class='navigation'> | |||
168 | [% IF links.get("index") %] | |||
169 | <a href='[% uri(links.get("index")) %]'> | |||
170 | <img src="[% resource('common/arrow-up.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> | |||
171 | </a> | |||
172 | [% ELSE %] | |||
173 | <img src="[% resource('common/arrow-up-inact.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> | |||
174 | [% END %] | |||
175 | </td> | |||
176 | <td class='navigation'> | |||
177 | [% IF navigation.next %] | |||
178 | <a href='[% uri(navigation.next) %]'> | |||
179 | <img src="[% resource('common/arrow-right.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> | |||
180 | </a> | |||
181 | [% ELSE %] | |||
182 | <img src="[% resource('common/arrow-right-inact.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> | |||
183 | [% END %] | |||
184 | </td> | |||
185 | </tr> | |||
186 | </table> | |||
187 | ||||
188 | <span> | |||
189 | [% FOR page IN pages %] | |||
190 | <a name='[% anchor(page) %]'></a> | |||
191 | <h1 style="display:inline-block;margin-left:20px;margin-top:5px;"> | |||
192 | [% page.title %]</h1> | |||
193 | [% END %] | |||
194 | </span> | |||
195 | ||||
196 | <table class='navigation' style="float:right;margin-right:10px;"> | |||
197 | <tr class='navigation'> | |||
198 | <td class='navigation'> | |||
199 | [% FOR page IN pages %] | |||
200 | [% FOR link IN page.backlinks %] | |||
201 | [% IF loop.first %]<a href="#backlinks"> | |||
202 | <img src='[% resource("common/backlink.png") %]' alt='[% gettext("Backlinks:") %]' title='[% gettext("Backlinks:") %]'> | |||
203 | </a>[% END %] | |||
204 | [% END %] | |||
205 | [% END %] | |||
206 | </td> | |||
207 | <td class='navigation'> | |||
208 | [% FOR page IN pages %] | |||
209 | [% FOR file IN page.attachments %] | |||
210 | [% IF loop.first %]<a href="#attach"> | |||
211 | <img src='[% resource("common/attachment.png") %]' alt='[% gettext("Attachments:") %]' title='[% gettext("Attachments:") %]'> | |||
212 | </a>[% END %] | |||
213 | [% END %] | |||
214 | [% END %] | |||
215 | </td> | |||
216 | </tr> | |||
217 | </table> | |||
218 | </div> | |||
219 | ||||
220 | <div class="intercalaire"> | |||
221 | <hr /> | |||
222 | </div> | |||
223 | ||||
224 | <div class="zemaster"> | |||
225 | ||||
226 | <div id="mySidenav" class="menu menuOpen"> | |||
227 | [% index() %] | |||
228 | </div> | |||
229 | ||||
230 | [% options.empty_lines = "default" %] | |||
231 | ||||
232 | <!-- Wiki content --> | |||
233 | ||||
234 | <div id="main" class='pages'> | |||
235 | <!--[% FOR page IN pages %]--> | |||
236 | <!-- | |||
237 | <div class='heading'> | |||
238 | <h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1> | |||
239 | </div> | |||
240 | --> | |||
241 | <div class='content'> | |||
242 | [% page.body %] | |||
243 | </div> | |||
244 | ||||
245 | <br /> |
templates/html/Wize_with_index_sod/common
File was created | 1 | ../common |