Commit 8acad7fc67f93b42817dfa22af1c494e36afc92f

Authored by William Daniau
1 parent 94ef5e4159
Exists in master

Utilisation d'un fichier de variables css

Showing 6 changed files with 56 additions and 21 deletions Inline Diff

templates/html/Default.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 1 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> 2 2 <html>
<head> 3 3 <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 4 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[% title %]</title> 5 5 <title>[% title %]</title>
<meta name='Generator' content='[% generator.name %]'> 6 6 <meta name='Generator' content='[% generator.name %]'>
7 <link rel="stylesheet"
8 href="[% resource('common/zim-variables.css') %]" >
<link rel="stylesheet" 7 9 <link rel="stylesheet"
href="[% resource('common/zim-style.css') %]" > 8 10 href="[% resource('common/zim-style.css') %]" >
<link rel="stylesheet" 9 11 <link rel="stylesheet"
href="[% resource('common/zim-table-style.css') %]" > 10 12 href="[% resource('common/zim-table-style.css') %]" >
<link rel="stylesheet" 11 13 <link rel="stylesheet"
href="[% resource('common/zim-special.css') %]" > 12 14 href="[% resource('common/zim-special.css') %]" >
<link rel="stylesheet" 13 15 <link rel="stylesheet"
href="[% resource('common/zim-hljs.css') %]" > 14 16 href="[% resource('common/zim-hljs.css') %]" >
15 17
<style type='text/css'> 16 18 <style type='text/css'>
* { font-family: sans-serif } 17 19 * { font-family: sans-serif }
18 20
a:hover { text-decoration: underline; } 19 21 a:hover { text-decoration: underline; }
20 22
/* Centre les images mais elles sont coupées aux sauts de page à l'impression */ 21 23 /* Centre les images mais elles sont coupées aux sauts de page à l'impression */
img { 22 24 img {
display: block; 23 25 display: block;
margin-left: auto; 24 26 margin-left: auto;
margin-right: auto; 25 27 margin-right: auto;
} 26 28 }
27 29
28 30
</style> 29 31 </style>
30 32
<!-- Themes clair : 31 33 <!-- Themes clair :
atom-one-light.css, vs.css googlecode.css github.css 32 34 atom-one-light.css, vs.css googlecode.css github.css
qtcreator_light.css 33 35 qtcreator_light.css
Themes sombres : 34 36 Themes sombres :
agate.css vs2015.css atom-one-dark.css hybrid.css 35 37 agate.css vs2015.css atom-one-dark.css hybrid.css
ir-black.css sunburst.css tomorrow-night-bright.css 36 38 ir-black.css sunburst.css tomorrow-night-bright.css
qtcreator_dark.css 37 39 qtcreator_dark.css
Demo live : https://highlightjs.org/static/demo/ --> 38 40 Demo live : https://highlightjs.org/static/demo/ -->
<link rel="stylesheet" 39 41 <link rel="stylesheet"
href="[% resource('common/hljs/styles/sunburst.css') %]" > 40 42 href="[% resource('common/hljs/styles/sunburst.css') %]" >
41 43
<!-- hljs --> 42 44 <!-- hljs -->
<script src="[% resource('common/hljs/highlight.pack.js') %]"></script> 43 45 <script src="[% resource('common/hljs/highlight.pack.js') %]"></script>
44 46
</head> 45 47 </head>
<body> 46 48 <body>
47 49
[% options.empty_lines = "default" %] 48 50 [% options.empty_lines = "default" %]
49 51
<!-- Header --> 50 52 <!-- Header -->
<div class='header'> 51 53 <div class='header'>
<table class='navigation'> 52 54 <table class='navigation'>
<tr class='navigation'> 53 55 <tr class='navigation'>
<td class='navigation'> 54 56 <td class='navigation'>
[% IF navigation.prev %] 55 57 [% IF navigation.prev %]
<a href='[% uri(navigation.prev) %]'> 56 58 <a href='[% uri(navigation.prev) %]'>
<img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> 57 59 <img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]">
</a> 58 60 </a>
[% ELSE %] 59 61 [% ELSE %]
<img src="[% resource('common/arrow-left-inact.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> 60 62 <img src="[% resource('common/arrow-left-inact.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]">
[% END %] 61 63 [% END %]
</td> 62 64 </td>
<td class='navigation'> 63 65 <td class='navigation'>
[% IF links.get("index") %] 64 66 [% IF links.get("index") %]
<a href='[% uri(links.get("index")) %]'> 65 67 <a href='[% uri(links.get("index")) %]'>
<img src="[% resource('common/arrow-up.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> 66 68 <img src="[% resource('common/arrow-up.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]">
</a> 67 69 </a>
[% ELSE %] 68 70 [% ELSE %]
<img src="[% resource('common/arrow-up-inact.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> 69 71 <img src="[% resource('common/arrow-up-inact.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]">
[% END %] 70 72 [% END %]
</td> 71 73 </td>
<td class='navigation'> 72 74 <td class='navigation'>
[% IF navigation.next %] 73 75 [% IF navigation.next %]
<a href='[% uri(navigation.next) %]'> 74 76 <a href='[% uri(navigation.next) %]'>
<img src="[% resource('common/arrow-right.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> 75 77 <img src="[% resource('common/arrow-right.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]">
</a> 76 78 </a>
[% ELSE %] 77 79 [% ELSE %]
<img src="[% resource('common/arrow-right-inact.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> 78 80 <img src="[% resource('common/arrow-right-inact.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]">
[% END %] 79 81 [% END %]
</td> 80 82 </td>
</tr> 81 83 </tr>
</table> 82 84 </table>
</div> 83 85 </div>
84 86
<hr /> 85 87 <hr />
86 88
<!-- Wiki content --> 87 89 <!-- Wiki content -->
88 90
<div class='pages'> 89 91 <div class='pages'>
<!--[% FOR page IN pages %]--> 90 92 <!--[% FOR page IN pages %]-->
<div class='heading'> 91 93 <div class='heading'>
<h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1> 92 94 <h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1>
</div> 93 95 </div>
94 96
<div class='content'> 95 97 <div class='content'>
[% page.body %] 96 98 [% page.body %]
</div> 97 99 </div>
98 100
<br /> 99 101 <br />
100 102
<div class='page-footer'> 101 103 <div class='page-footer'>
<!--[% FOR link IN page.backlinks %]--> 102 104 <!--[% FOR link IN page.backlinks %]-->
[% IF loop.first %]<b>[% gettext("Backlinks:") %]</b>[% END %] 103 105 [% IF loop.first %]<b>[% gettext("Backlinks:") %]</b>[% END %]
104 106
<a href='[% uri(link) %]'>[% link.name %]</a> 105 107 <a href='[% uri(link) %]'>[% link.name %]</a>
106 108
[% IF loop.last %]<br /><br />[% END %] 107 109 [% IF loop.last %]<br /><br />[% END %]
templates/html/Default_with_index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 1 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> 2 2 <html>
<head> 3 3 <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 4 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[% title %]</title> 5 5 <title>[% title %]</title>
<meta name='Generator' content='[% generator.name %]'> 6 6 <meta name='Generator' content='[% generator.name %]'>
<link rel="stylesheet" 7 7 <link rel="stylesheet"
8 href="[% resource('common/zim-variables.css') %]" >
9 <link rel="stylesheet"
href="[% resource('common/zim-style.css') %]" > 8 10 href="[% resource('common/zim-style.css') %]" >
<link rel="stylesheet" 9 11 <link rel="stylesheet"
href="[% resource('common/zim-table-style.css') %]" > 10 12 href="[% resource('common/zim-table-style.css') %]" >
<link rel="stylesheet" 11 13 <link rel="stylesheet"
href="[% resource('common/zim-special.css') %]" > 12 14 href="[% resource('common/zim-special.css') %]" >
<link rel="stylesheet" 13 15 <link rel="stylesheet"
href="[% resource('common/zim-hljs.css') %]" > 14 16 href="[% resource('common/zim-hljs.css') %]" >
15 17
<style type='text/css'> 16 18 <style type='text/css'>
* { font-family: sans-serif } 17 19 * { font-family: sans-serif }
18 20
a:hover { text-decoration: underline; } 19 21 a:hover { text-decoration: underline; }
20 22
/* Centre les images mais elles sont coupées aux sauts de page à l'impression */ 21 23 /* Centre les images mais elles sont coupées aux sauts de page à l'impression */
img { 22 24 img {
display: block; 23 25 display: block;
margin-left: auto; 24 26 margin-left: auto;
margin-right: auto; 25 27 margin-right: auto;
} 26 28 }
27 29
/* Specifique au with index */ 28 30 /* Specifique au with index */
span.insen { color: grey } 29 31 span.insen { color: grey }
30 32
.pages { 31 33 .pages {
/*max-width: 1000px;*/ 32 34 /*max-width: 1000px;*/
/*padding-left: 320px;*/ 33 35 /*padding-left: 320px;*/
width: inherit; 34 36 width: inherit;
transition: margin-left .3s; 35 37 transition: margin-left .3s;
background: white; 36 38 background: white;
padding-left: 10px; 37 39 padding-left: 10px;
padding-right: 10px; 38 40 padding-right: 10px;
padding-bottom: 20px; 39 41 padding-bottom: 20px;
padding-top: 10px; 40 42 padding-top: 10px;
} 41 43 }
42 44
.menu{ 43 45 .menu{
/*float:left; */ 44 46 /*float:left; */
width: 0; 45 47 width: 0;
color:#4e9a06; 46 48 color:#4e9a06;
overflow-x: hidden; 47 49 overflow-x: hidden;
position: absolute; 48 50 position: absolute;
transition:.3s; 49 51 transition:.3s;
background: #fafafa; 50 52 background: #fafafa;
border-style: solid; 51 53 border-style: solid;
border-width: 1px; 52 54 border-width: 1px;
margin-left:-20px; 53 55 margin-left:-20px;
} 54 56 }
55 57
.menu a,.menu a:link,.menu a:hover,.menu a:active,.menu a:visited { 56 58 .menu a,.menu a:link,.menu a:hover,.menu a:active,.menu a:visited {
color: #4e9a06; 57 59 color: #4e9a06;
} 58 60 }
59 61
.menuOpen { 60 62 .menuOpen {
/*display: block;*/ 61 63 /*display: block;*/
} 62 64 }
63 65
.menuClosed { 64 66 .menuClosed {
border-style: unset; 65 67 border-style: unset;
} 66 68 }
67 69
.header{ 68 70 .header{
max-width: 63em; 69 71 max-width: 63em;
position: fixed; 70 72 position: fixed;
width: 100%; 71 73 width: 100%;
top:0; 72 74 top:0;
background:white; 73 75 background:white;
z-index: 1; 74 76 z-index: 1;
} 75 77 }
76 78
hr{ 77 79 hr{
clear:both; 78 80 clear:both;
border-style: solid; 79 81 border-style: solid;
border-width: 1px; 80 82 border-width: 1px;
border-color: #4e9a06; 81 83 border-color: #4e9a06;
} 82 84 }
83 85
body { 84 86 body {
max-width:63em; 85 87 max-width:63em;
display:block; 86 88 display:block;
margin-left:auto; 87 89 margin-left:auto;
margin-right:auto; 88 90 margin-right:auto;
background: lightslategrey; 89 91 background: lightslategrey;
} 90 92 }
91 93
.intercalaire { 92 94 .intercalaire {
background:white; 93 95 background:white;
margin-top: 48px; 94 96 margin-top: 48px;
padding: 10px; 95 97 padding: 10px;
} 96 98 }
97 99
.bold-footer { 98 100 .bold-footer {
color: #4e9a06; 99 101 color: #4e9a06;
} 100 102 }
101 103
</style> 102 104 </style>
103 105
<!-- Themes clair : 104 106 <!-- Themes clair :
atom-one-light.css, vs.css googlecode.css github.css 105 107 atom-one-light.css, vs.css googlecode.css github.css
qtcreator_light.css 106 108 qtcreator_light.css
Themes sombres : 107 109 Themes sombres :
agate.css vs2015.css atom-one-dark.css hybrid.css 108 110 agate.css vs2015.css atom-one-dark.css hybrid.css
ir-black.css sunburst.css tomorrow-night-bright.css 109 111 ir-black.css sunburst.css tomorrow-night-bright.css
qtcreator_dark.css 110 112 qtcreator_dark.css
Demo live : https://highlightjs.org/static/demo/ --> 111 113 Demo live : https://highlightjs.org/static/demo/ -->
<link rel="stylesheet" 112 114 <link rel="stylesheet"
href="[% resource('common/hljs/styles/sunburst.css') %]" > 113 115 href="[% resource('common/hljs/styles/sunburst.css') %]" >
114 116
<!-- hljs --> 115 117 <!-- hljs -->
<script src="[% resource('common/hljs/highlight.pack.js') %]"></script> 116 118 <script src="[% resource('common/hljs/highlight.pack.js') %]"></script>
117 119
<script> 118 120 <script>
function openNav() { 119 121 function openNav() {
if (document.getElementById("mySidenav").getAttribute("class").split(' ')[1] == "menuClosed") { 120 122 if (document.getElementById("mySidenav").getAttribute("class").split(' ')[1] == "menuClosed") {
document.getElementById("mySidenav").style.width = "300px"; 121 123 document.getElementById("mySidenav").style.width = "300px";
/*document.getElementById("main").style.marginLeft = "300px";*/ 122 124 /*document.getElementById("main").style.marginLeft = "300px";*/
document.getElementById("mySidenav").setAttribute("class","menu menuOpen"); 123 125 document.getElementById("mySidenav").setAttribute("class","menu menuOpen");
/* Scroll to top when opening menu */ 124 126 /* Scroll to top when opening menu */
document.body.scrollTop = 0 125 127 document.body.scrollTop = 0
document.documentElement.scrollTop = 0; 126 128 document.documentElement.scrollTop = 0;
} else { 127 129 } else {
document.getElementById("mySidenav").style.width = "0"; 128 130 document.getElementById("mySidenav").style.width = "0";
/*document.getElementById("main").style.marginLeft = "0";*/ 129 131 /*document.getElementById("main").style.marginLeft = "0";*/
document.getElementById("mySidenav").setAttribute("class","menu menuClosed"); 130 132 document.getElementById("mySidenav").setAttribute("class","menu menuClosed");
} 131 133 }
} 132 134 }
</script> 133 135 </script>
</head> 134 136 </head>
<body> 135 137 <body>
136 138
<!-- Header --> 137 139 <!-- Header -->
<div class='header'> 138 140 <div class='header'>
<table class='navigation' style="float:left"> 139 141 <table class='navigation' style="float:left">
<tr class='navigation'> 140 142 <tr class='navigation'>
<td class='navigation'> 141 143 <td class='navigation'>
<span style="font-size:30px;cursor:pointer;color: #4e9a06;" onclick="openNav()">&#9776;</span> 142 144 <span style="font-size:30px;cursor:pointer;color: #4e9a06;" onclick="openNav()">&#9776;</span>
</td> 143 145 </td>
<td class='navigation'> 144 146 <td class='navigation'>
[% IF navigation.prev %] 145 147 [% IF navigation.prev %]
<a href='[% uri(navigation.prev) %]'> 146 148 <a href='[% uri(navigation.prev) %]'>
<img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> 147 149 <img src="[% resource('common/arrow-left.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]">
</a> 148 150 </a>
[% ELSE %] 149 151 [% ELSE %]
<img src="[% resource('common/arrow-left-inact.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]"> 150 152 <img src="[% resource('common/arrow-left-inact.png') %]" alt="[% gettext('Prev') %]" title="[% gettext('Prev') %]">
[% END %] 151 153 [% END %]
</td> 152 154 </td>
<td class='navigation'> 153 155 <td class='navigation'>
[% IF links.get("index") %] 154 156 [% IF links.get("index") %]
<a href='[% uri(links.get("index")) %]'> 155 157 <a href='[% uri(links.get("index")) %]'>
<img src="[% resource('common/arrow-up.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> 156 158 <img src="[% resource('common/arrow-up.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]">
</a> 157 159 </a>
[% ELSE %] 158 160 [% ELSE %]
<img src="[% resource('common/arrow-up-inact.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]"> 159 161 <img src="[% resource('common/arrow-up-inact.png') %]" alt="[% gettext('Index') %]" title="[% gettext('Index') %]">
[% END %] 160 162 [% END %]
</td> 161 163 </td>
<td class='navigation'> 162 164 <td class='navigation'>
[% IF navigation.next %] 163 165 [% IF navigation.next %]
<a href='[% uri(navigation.next) %]'> 164 166 <a href='[% uri(navigation.next) %]'>
<img src="[% resource('common/arrow-right.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> 165 167 <img src="[% resource('common/arrow-right.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]">
</a> 166 168 </a>
[% ELSE %] 167 169 [% ELSE %]
<img src="[% resource('common/arrow-right-inact.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]"> 168 170 <img src="[% resource('common/arrow-right-inact.png') %]" alt="[% gettext('Next') %]" title="[% gettext('Next') %]">
[% END %] 169 171 [% END %]
</td> 170 172 </td>
</tr> 171 173 </tr>
</table> 172 174 </table>
173 175
<span> 174 176 <span>
[% FOR page IN pages %] 175 177 [% FOR page IN pages %]
<a name='[% anchor(page) %]'></a> 176 178 <a name='[% anchor(page) %]'></a>
<h1 style="display:inline-block;margin-left:20px;margin-top:5px;"> 177 179 <h1 style="display:inline-block;margin-left:20px;margin-top:5px;">
[% page.title %]</h1> 178 180 [% page.title %]</h1>
[% END %] 179 181 [% END %]
</span> 180 182 </span>
181 183
<table class='navigation' style="float:right;margin-right:10px;"> 182 184 <table class='navigation' style="float:right;margin-right:10px;">
<tr class='navigation'> 183 185 <tr class='navigation'>
<td class='navigation'> 184 186 <td class='navigation'>
[% FOR page IN pages %] 185 187 [% FOR page IN pages %]
[% FOR link IN page.backlinks %] 186 188 [% FOR link IN page.backlinks %]
[% IF loop.first %]<a href="#backlinks"> 187 189 [% IF loop.first %]<a href="#backlinks">
<img src='[% resource("common/backlink.png") %]' alt='[% gettext("Backlinks:") %]' title='[% gettext("Backlinks:") %]'> 188 190 <img src='[% resource("common/backlink.png") %]' alt='[% gettext("Backlinks:") %]' title='[% gettext("Backlinks:") %]'>
</a>[% END %] 189 191 </a>[% END %]
[% END %] 190 192 [% END %]
[% END %] 191 193 [% END %]
</td> 192 194 </td>
<td class='navigation'> 193 195 <td class='navigation'>
[% FOR page IN pages %] 194 196 [% FOR page IN pages %]
[% FOR file IN page.attachments %] 195 197 [% FOR file IN page.attachments %]
[% IF loop.first %]<a href="#attach"> 196 198 [% IF loop.first %]<a href="#attach">
<img src='[% resource("common/attachment.png") %]' alt='[% gettext("Attachments:") %]' title='[% gettext("Attachments:") %]'> 197 199 <img src='[% resource("common/attachment.png") %]' alt='[% gettext("Attachments:") %]' title='[% gettext("Attachments:") %]'>
</a>[% END %] 198 200 </a>[% END %]
[% END %] 199 201 [% END %]
[% END %] 200 202 [% END %]
</td> 201 203 </td>
</tr> 202 204 </tr>
</table> 203 205 </table>
</div> 204 206 </div>
205 207
<div class="intercalaire"> 206 208 <div class="intercalaire">
<hr /> 207 209 <hr />
</div> 208 210 </div>
209 211
<div id="mySidenav" class="menu menuClosed"> 210 212 <div id="mySidenav" class="menu menuClosed">
[% index() %] 211 213 [% index() %]
</div> 212 214 </div>
213 215
[% options.empty_lines = "default" %] 214 216 [% options.empty_lines = "default" %]
215 217
<!-- Wiki content --> 216 218 <!-- Wiki content -->
217 219
<div id="main" class='pages'> 218 220 <div id="main" class='pages'>
<!--[% FOR page IN pages %]--> 219 221 <!--[% FOR page IN pages %]-->
<!-- 220 222 <!--
<div class='heading'> 221 223 <div class='heading'>
<h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1> 222 224 <h1>[% page.title %] <a name='[% anchor(page) %]'></a></h1>
</div> 223 225 </div>
--> 224 226 -->
<div class='content'> 225 227 <div class='content'>
[% page.body %] 226 228 [% page.body %]
</div> 227 229 </div>
228 230
<br /> 229 231 <br />
230 232
<div style="padding-bottom:10px;"> 231 233 <div style="padding-bottom:10px;">
<hr /> 232 234 <hr />
templates/html/Print.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 1 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> 2 2 <html>
<head> 3 3 <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 4 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[% title %]</title> 5 5 <title>[% title %]</title>
<meta name='Generator' content='[% generator.name %]'> 6 6 <meta name='Generator' content='[% generator.name %]'>
<!-- ATTENTION Le template Print ne supporte pas les ressources, 7 7 <!-- ATTENTION Le template Print ne supporte pas les ressources,
Il faut mettre des chemins absolus sur les fichiers :( --> 8 8 Il faut mettre des chemins absolus sur les fichiers :( -->
<link rel="stylesheet" 9 9 <link rel="stylesheet"
10 href="file:////home/daniau/.local/share/zim/templates/html/common/zim-variables.css" >
11 <link rel="stylesheet"
href="file:////home/daniau/.local/share/zim/templates/html/common/zim-style.css" > 10 12 href="file:////home/daniau/.local/share/zim/templates/html/common/zim-style.css" >
<link rel="stylesheet" 11 13 <link rel="stylesheet"
href="file:////home/daniau/.local/share/zim/templates/html/common/zim-table-style.css" > 12 14 href="file:////home/daniau/.local/share/zim/templates/html/common/zim-table-style.css" >
<link rel="stylesheet" 13 15 <link rel="stylesheet"
href="file:////home/daniau/.local/share/zim/templates/html/common/zim-special.css" > 14 16 href="file:////home/daniau/.local/share/zim/templates/html/common/zim-special.css" >
<link rel="stylesheet" 15 17 <link rel="stylesheet"
href="file:////home/daniau/.local/share/zim/templates/html/common/zim-hljs.css" > 16 18 href="file:////home/daniau/.local/share/zim/templates/html/common/zim-hljs.css" >
<style type='text/css'> 17 19 <style type='text/css'>
18 20
* { font-family: serif } 19 21 * { font-family: serif }
20 22
/* Centre les images mais elles sont coupées aux sauts de page à l'impression */ 21 23 /* Centre les images mais elles sont coupées aux sauts de page à l'impression */
/*img { 22 24 /*img {
display: block; 23 25 display: block;
margin-left: auto; 24 26 margin-left: auto;
margin-right: auto; 25 27 margin-right: auto;
}*/ 26 28 }*/
27 29
</style> 28 30 </style>
29 31
<!-- Themes clair : 30 32 <!-- Themes clair :
atom-one-light.css, vs.css 31 33 atom-one-light.css, vs.css
Themes sombres : 32 34 Themes sombres :
agate.css, vs2015.css, atom-one-dark.css 33 35 agate.css, vs2015.css, atom-one-dark.css
Demo live : https://highlightjs.org/static/demo/ --> 34 36 Demo live : https://highlightjs.org/static/demo/ -->
<link rel="stylesheet" 35 37 <link rel="stylesheet"
href="file:////home/daniau/.local/share/zim/templates/html/common/hljs/styles/atom-one-light-wb.css" > 36 38 href="file:////home/daniau/.local/share/zim/templates/html/common/hljs/styles/atom-one-light-wb.css" >
37 39
<!-- hljs --> 38 40 <!-- hljs -->
<script src="file:////home/daniau/.local/share/zim/templates/html/common/hljs/highlight.pack.js"></script> 39 41 <script src="file:////home/daniau/.local/share/zim/templates/html/common/hljs/highlight.pack.js"></script>
40 42
</head> 41 43 </head>
<body> 42 44 <body>
43 45
[% options.empty_lines = "default" %] 44 46 [% options.empty_lines = "default" %]
45 47
templates/html/common/zim-style.css
/* Common zim definitions */ 1 1 /* Common zim definitions */
2 2
a { text-decoration: none; 3 3 a { text-decoration: none;
color: blue;} 4 4 color: var(--main-link-color);}
a:link { text-decoration: none; 5 5 a:link { text-decoration: none;
color: blue;} 6 6 color: var(--main-link-color);}
a:hover { text-decoration: none; 7 7 a:hover { text-decoration: none;
color: blue;} 8 8 color: var(--main-link-color);}
a:active { text-decoration: none; 9 9 a:active { text-decoration: none;
color: blue;} 10 10 color: var(--main-link-color);}
a:visited { text-decoration: none; 11 11 a:visited { text-decoration: none;
color: blue;} 12 12 color: var(--main-link-color);}
13 13
strike { color: grey } 14 14 strike { color: var(--main-strike-color);}
15 15
u { text-decoration: underline; 16 16 u { text-decoration: underline;
background-color: white } 17 17 /*background-color: white*/ }
18 18
tt { color: darkmagenta; 19 19 tt { color: var(--main-tt-color);
font-family: monospace; 20 20 font-family: monospace;
font-size: large} 21 21 font-size: large}
22 22
pre { color: darkmagenta; 23 23 pre { color: var(--main-pre-color);
margin-left: 20px; 24 24 margin-left: 20px;
margin-right: 5px; 25 25 margin-right: 5px;
margin-bottom: 5px; 26 26 margin-bottom: 5px;
margin-top: 5px; 27 27 margin-top: 5px;
font-family: monospace; 28 28 font-family: monospace;
font-size: large } 29 29 font-size: large }
30 30
code { font-size: large; font-family: monospace; color: saddlebrown} 31 31 code { font-size: large; font-family: monospace; color: var(--main-code-color)}
32 32
h1 { text-decoration: underline; 33 33 h1 { text-decoration: underline;
color: #4e9a06; 34 34 color: var(--main-header-color);
margin-bottom: 0; 35 35 margin-bottom: 0;
margin-top: 1em; } 36 36 margin-top: 1em; }
37 37
h2 { color: #4e9a06; 38 38 h2 { color: var(--main-header-color);
margin-bottom: 0; 39 39 margin-bottom: 0;
margin-left: 20px; 40 40 margin-left: 20px;
margin-top: 1em;} 41 41 margin-top: 1em;}
42 42
h3 { color: #4e9a06; 43 43 h3 { color: var(--main-header-color);
margin-bottom: 0; 44 44 margin-bottom: 0;
margin-left: 40px; 45 45 margin-left: 40px;
margin-top: 1em; 46 46 margin-top: 1em;
font-style: italic; } 47 47 font-style: italic; }
48 48
h4 { color: #4e9a06; 49 49 h4 { color: var(--main-header-color);
margin-bottom: 0; 50 50 margin-bottom: 0;
margin-left: 60px; 51 51 margin-left: 60px;
margin-top: 1em;} 52 52 margin-top: 1em;}
53 53
h5 { color: #4e9a06; 54 54 h5 { color: var(--main-header-color);
margin-bottom: 0; 55 55 margin-bottom: 0;
margin-left: 80px; 56 56 margin-left: 80px;
margin-top: 1em;} 57 57 margin-top: 1em;}
58 58
p { margin-top: 0 } 59 59 p { margin-top: 0 }
60 60
61 61
62 62
templates/html/common/zim-table-style.css
/* Table definition */ 1 1 /* Table definition */
2 2
table { 3 3 table {
border-collapse: collapse; 4 4 border-collapse: collapse;
width: 98%; 5 5 width: 98%;
margin-left: auto; 6 6 margin-left: auto;
margin-right: auto; 7 7 margin-right: auto;
} 8 8 }
9 9
td,th { 10 10 td,th {
border: 1px solid #ddd; 11 11 border: 1px solid var(--main-td-th-border-color);
padding: 4px; 12 12 padding: 4px;
} 13 13 }
14 14
15 tr:nth-child(odd){background-color: var(--main-tr-odd-background-color);}
16
17 tr:nth-child(even){background-color: var(--main-tr-even-background-color);}
15 18
tr:nth-child(even){background-color: #f2f2f2;} 16 19 tr:hover {background-color: var(--main-tr-hover-background-color);}
17 20
tr:hover {background-color: #ddd;} 18
19
th { 20 21 th {
padding-top: 6px; 21 22 padding-top: 6px;
padding-bottom: 6px; 22 23 padding-bottom: 6px;
/*background-color: #4CAF50;*/ 23 24 /*background-color: #4CAF50;*/
/*background-color: #3a853c;*/ 24 25 /*background-color: #3a853c;*/
/*background-color: #85733a;*/ 25 26 /*background-color: #85733a;*/
/*background-color: #3a7685;*/ 26 27 /*background-color: #3a7685;*/
/*background-color: #295e2a;*/ 27 28 /*background-color: #295e2a;*/
/*color: white;*/ 28 29 /*color: white;*/
29 30
/*background-color: #d1e1c1;*/ 30 31 /*background-color: #d1e1c1;*/
background-color: #bbb; 31 32 background-color: var(--main-th-background-color);
color: black; 32 33 color: var(--main-th-color);
} 33 34 }
34 35
36 /* Overriding for the navigation table in header */
table.navigation { 35 37 table.navigation {
border-collapse: collapse; 36 38 border-collapse: collapse;
width: auto; 37 39 width: auto;
margin-left: 0; 38 40 margin-left: 0;
margin-right: auto; 39 41 margin-right: auto;
} 40 42 }
41 43
td.navigation, th.navigation { 42 44 td.navigation, th.navigation {
border: 0; 43 45 border: 0;
padding: 0; 44 46 padding: 0;
47 }
48
49 tr.navigation {
templates/html/common/zim-variables.css
File was created 1
2 /* Variables */
3
4 :root {
5 /* General */
6 --main-header-color: #4e9a06; /* Headers color */
7 --main-link-color: blue; /* Links color */
8 --main-strike-color: grey; /* Strike color */
9 --main-pre-color: darkmagenta; /* Verbatim bloc color */
10 --main-tt-color: darkmagenta; /* Inline verbatim */
11 --main-code-color: saddlebrown; /* Code color (if hljs not used) */
12 --main-body-color: lightslategrey; /* Color of the background body */
13
14 /* Tables */
15 /* Table headers */
16 --main-th-color: black; /* Table header text color */
17 --main-th-background-color: #bbb; /* Table header background */
18 /* Table Row and Data */
19 --main-tr-even-background-color: #f2f2f2; /* Even row background color */
20 --main-tr-odd-background-color: white; /* Odd row background color */