Commit c0f20deb126b68213d010fe1f2a0e64eafc9a1da
1 parent
33afad1d3e
Exists in
master
Nouveau template with index avec menu glissant sur le côté gauche.
Showing 3 changed files with 108 additions and 10 deletions Side-by-side Diff
templates/html/Default_with_index.html
... | ... | @@ -29,13 +29,53 @@ |
29 | 29 | span.insen { color: grey } |
30 | 30 | |
31 | 31 | .pages { |
32 | - max-width: 1000px; | |
33 | - padding-left: 320px; | |
32 | + /*max-width: 1000px;*/ | |
33 | + /*padding-left: 320px;*/ | |
34 | + width: inherit; | |
35 | + transition: margin-left .3s; | |
34 | 36 | } |
37 | + | |
35 | 38 | .menu{ |
36 | - float:left; width: 300px; | |
39 | + /*float:left; */ | |
40 | + width: 0; | |
41 | + color:#4e9a06; | |
42 | + overflow-x: hidden; | |
43 | + position: absolute; | |
44 | + transition:.3s; | |
45 | + background: #fafafa; | |
46 | + border-style: solid; | |
47 | + border-width: 1px; | |
37 | 48 | } |
49 | + | |
50 | + .menu a,.menu a:link,.menu a:hover,.menu a:active,.menu a:visited { | |
51 | + color: #4e9a06; | |
52 | + } | |
53 | + | |
54 | + .menuOpen { | |
55 | + /*display: block;*/ | |
56 | + } | |
57 | + | |
58 | + .menuClosed { | |
59 | + border-style: unset; | |
60 | + } | |
61 | + | |
62 | + .header{ | |
63 | + max-width: 63em; | |
64 | + position: fixed; | |
65 | + width: 100%; | |
66 | + top:0; | |
67 | + background:white; | |
68 | + z-index: 1; | |
69 | + } | |
70 | + | |
38 | 71 | hr{clear:both;} |
72 | + | |
73 | + body { | |
74 | + max-width:63em; | |
75 | + display:block; | |
76 | + margin-left:auto; | |
77 | + margin-right:auto; | |
78 | + } | |
39 | 79 | |
40 | 80 | </style> |
41 | 81 | |
42 | 82 | |
43 | 83 | |
44 | 84 | |
... | ... | @@ -51,16 +91,38 @@ |
51 | 91 | href="[% resource('common/hljs/styles/sunburst.css') %]" > |
52 | 92 | |
53 | 93 | <!-- hljs --> |
54 | - <script src="[% resource('common/hljs/highlight.pack.js') %]"></script> | |
94 | + <script src="[% resource('common/hljs/highlight.pack.js') %]"></script> | |
95 | + | |
96 | + <script> | |
97 | + function openNav() { | |
98 | + if (document.getElementById("mySidenav").getAttribute("class").split(' ')[1] == "menuClosed") { | |
99 | + document.getElementById("mySidenav").style.width = "300px"; | |
100 | + /*document.getElementById("main").style.marginLeft = "300px";*/ | |
101 | + document.getElementById("mySidenav").setAttribute("class","menu menuOpen"); | |
102 | + /* Scroll to top when opening menu */ | |
103 | + document.body.scrollTop = 0 | |
104 | + document.documentElement.scrollTop = 0; | |
105 | + } else { | |
106 | + document.getElementById("mySidenav").style.width = "0"; | |
107 | + /*document.getElementById("main").style.marginLeft = "0";*/ | |
108 | + document.getElementById("mySidenav").setAttribute("class","menu menuClosed"); | |
109 | + | |
110 | + } | |
111 | + } | |
112 | + </script> | |
55 | 113 | |
114 | + | |
56 | 115 | </head> |
57 | 116 | <body> |
58 | 117 | |
59 | 118 | <!-- Header --> |
60 | 119 | <div class='header'> |
61 | -<table class='navigation'> | |
120 | +<table class='navigation' style="float:left"> | |
62 | 121 | <tr class='navigation'> |
63 | 122 | <td class='navigation'> |
123 | +<span style="font-size:30px;cursor:pointer;color: #4e9a06;" onclick="openNav()">☰</span> | |
124 | +</td> | |
125 | +<td class='navigation'> | |
64 | 126 | [% IF navigation.prev %] |
65 | 127 | <a href='[% uri(navigation.prev) %]'> |
66 | 128 | <img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> |
67 | 129 | |
68 | 130 | |
... | ... | @@ -89,11 +151,42 @@ |
89 | 151 | </td> |
90 | 152 | </tr> |
91 | 153 | </table> |
154 | + | |
155 | +<span> | |
156 | +[% FOR page IN pages %] | |
157 | +<a name='[% anchor(page) %]'></a> | |
158 | +<h1 style="display:inline-block;margin-left:20px;margin-top:5px;"> | |
159 | +[% page.title %]</h1> | |
160 | +[% END %] | |
161 | +</span> | |
162 | + | |
163 | +<table class='navigation' style="float:right;margin-right:10px;"> | |
164 | +<tr class='navigation'> | |
165 | +<td class='navigation'> | |
166 | +[% FOR page IN pages %] | |
167 | +[% FOR link IN page.backlinks %] | |
168 | +[% IF loop.first %]<a href="#backlinks"> | |
169 | +<img src='[% resource("common/backlink.png") %]' alt='[% gettext("Backlinks:") %]' title='[% gettext("Backlinks:") %]'> | |
170 | +</a>[% END %] | |
171 | +[% END %] | |
172 | +[% END %] | |
173 | +</td> | |
174 | +<td class='navigation'> | |
175 | +[% FOR page IN pages %] | |
176 | +[% FOR file IN page.attachments %] | |
177 | +[% IF loop.first %]<a href="#attach"> | |
178 | +<img src='[% resource("common/attachment.png") %]' alt='[% gettext("Attachments:") %]' title='[% gettext("Attachments:") %]'> | |
179 | +</a>[% END %] | |
180 | +[% END %] | |
181 | +[% END %] | |
182 | +</td> | |
183 | +</tr> | |
184 | +</table> | |
92 | 185 | </div> |
93 | 186 | |
94 | -<hr /> | |
187 | +<hr style="margin-top:50px" /> | |
95 | 188 | |
96 | -<div class="menu"> | |
189 | +<div id="mySidenav" class="menu menuClosed"> | |
97 | 190 | [% index() %] |
98 | 191 | </div> |
99 | 192 | |
100 | 193 | |
101 | 194 | |
... | ... | @@ -101,12 +194,13 @@ |
101 | 194 | |
102 | 195 | <!-- Wiki content --> |
103 | 196 | |
104 | -<div class='pages'> | |
197 | +<div id="main" class='pages'> | |
105 | 198 | <!--[% FOR page IN pages %]--> |
199 | +<!-- | |
106 | 200 | <div class='heading'> |
107 | 201 | <h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1> |
108 | 202 | </div> |
109 | - | |
203 | +--> | |
110 | 204 | <div class='content'> |
111 | 205 | [% page.body %] |
112 | 206 | </div> |
... | ... | @@ -115,7 +209,10 @@ |
115 | 209 | |
116 | 210 | <div class='page-footer'> |
117 | 211 | <!--[% FOR link IN page.backlinks %]--> |
118 | - [% IF loop.first %]<b>[% gettext("Backlinks:") %]</b>[% END %] | |
212 | + [% IF loop.first %] | |
213 | + <a name="backlinks"></a> | |
214 | + <b>[% gettext("Backlinks:") %]</b> | |
215 | + [% END %] | |
119 | 216 | |
120 | 217 | <a href='[% uri(link) %]'>[% link.name %]</a> |
121 | 218 | |
... | ... | @@ -124,6 +221,7 @@ |
124 | 221 | |
125 | 222 | <!--[% FOR file IN page.attachments %]--> |
126 | 223 | [% IF loop.first %] |
224 | + <a name="attach"></a> | |
127 | 225 | <b>[% gettext("Attachments:") %]</b> |
128 | 226 | <table> |
129 | 227 | [% END %] |
templates/html/common/attachment.png
1.74 KB
templates/html/common/backlink.png
4.94 KB