William Daniau / wize

Download as
Browse Code »

Commit 63ddb1e18247770a463500b04089782bbebae2cb

Authored by William Daniau
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 Side-by-side Diff

templates/html/Wize_with_index_sod.html
Diff comments   View file @ 63ddb1e
  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()">&#9776;</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 />
  246 +
  247 + <div style="padding-bottom:10px;">
  248 + <hr />
  249 + </div>
  250 +
  251 + <div class='page-footer'>
  252 + <!--[% FOR link IN page.backlinks %]-->
  253 + [% IF loop.first %]
  254 + <a name="backlinks"></a>
  255 + <b class="bold-footer">[% gettext("Backlinks:") %]</b>
  256 + [% END %]
  257 +
  258 + <a href='[% uri(link) %]'>[% link.name %]</a>
  259 +
  260 + [% IF loop.last %]<br /><br />[% END %]
  261 + <!--[% END %]-->
  262 +
  263 + <!--[% FOR file IN page.attachments %]-->
  264 + [% IF loop.first %]
  265 + <a name="attach"></a>
  266 + <b class="bold-footer">[% gettext("Attachments:") %]</b>
  267 + <table>
  268 + [% END %]
  269 +
  270 + <tr><td><a href='[% uri(file) %]'>[% file.basename %]</a></td><td>&nbsp;</td><td>[% file.size %]</td></tr>
  271 +
  272 + [% IF loop.last %]
  273 + </table>
  274 + [% END %]
  275 + <!--[% END %]-->
  276 + </div>
  277 +
  278 + [% IF not loop.last %]<hr />[% END %]
  279 +
  280 +<!--[% END %]-->
  281 +</div>
  282 +</div>
  283 +
  284 +<script src="[% resource('common/go-hljs.js') %]"></script>
  285 +
  286 +</body>
  287 +
  288 +</html>
templates/html/Wize_with_index_sod/common
Diff comments   View file @ 63ddb1e
  1 +../common