Sample templates
This commit is contained in:
Clément GOUIN
@@ -3,10 +3,16 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Error <%= error %></title>
|
||||
<link rel="stylesheet" type="text/css" href="/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>Error <%= error %> at path <%= path %></h1>
|
||||
<h1>Somehing went wrong
|
||||
<small>(Error <%= error %>)</small>
|
||||
</h1>
|
||||
It means the resource you're trying to access is unavailable right now.<br>
|
||||
We're terribly sorry that you encountered this error.<br><br>
|
||||
<a href="/">Back to home</a>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,143 @@
|
||||
/* PrismJS 1.16.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+abnf+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+csharp+autohotkey+autoit+bash+basic+batch+bison+bnf+brainfuck+bro+cpp+aspnet+arduino+cil+coffeescript+cmake+clojure+ruby+csp+css-extras+d+dart+diff+markup-templating+docker+ebnf+eiffel+ejs+elixir+elm+erb+erlang+fsharp+flow+fortran+gcode+gedcom+gherkin+git+glsl+gml+go+graphql+groovy+less+handlebars+haskell+haxe+hcl+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+scala+php+javastacktrace+jolie+jq+javadoclike+n4js+json+jsonp+json5+julia+keyman+kotlin+latex+markdown+liquid+lisp+livescript+lolcode+lua+makefile+crystal+django+matlab+mel+mizar+monkey+n1ql+typescript+nand2tetris-hdl+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+jsdoc+phpdoc+php-extras+sql+powershell+processing+prolog+properties+protobuf+scss+puppet+pure+python+q+qore+r+js-extras+jsx+renpy+reason+vala+rest+rip+roboconf+textile+rust+sas+sass+stylus+javadoc+scheme+shell-session+smalltalk+smarty+plsql+soy+twig+swift+yaml+tcl+haml+toml+tt2+pug+tsx+t4-templating+visual-basic+t4-cs+regex+vbnet+velocity+verilog+vhdl+vim+t4-vb+wasm+wiki+xeora+xojo+xquery+tap */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
+132
-6
@@ -1,18 +1,144 @@
|
||||
body, html {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font: 14px/1.45 -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
|
||||
color: #111;
|
||||
-webkit-text-size-adjust: none;
|
||||
|
||||
background-color: #F5F5F5;
|
||||
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 70ch;
|
||||
padding: 2ch;
|
||||
margin: auto;
|
||||
|
||||
background-color: #F0F0F0;
|
||||
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.article a, .article a:visited {
|
||||
color: black;
|
||||
q:before {
|
||||
content: open-quote;
|
||||
}
|
||||
|
||||
.article a:visited {
|
||||
color: black;
|
||||
q:after {
|
||||
content: close-quote;
|
||||
}
|
||||
|
||||
.article img {
|
||||
hr {
|
||||
background: #e1e4e8;
|
||||
border: 0;
|
||||
height: 0.25em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #3C3CA1;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #8484C6;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
font-size: 96%;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
table td {
|
||||
vertical-align: baseline;
|
||||
padding-left: 8px;
|
||||
}
|
||||
|
||||
table td:first-of-type {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
div.header span.time span {
|
||||
color: #888;
|
||||
font-family: serif;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
main.article div.header a.link-home {
|
||||
text-decoration: none;
|
||||
float: right;
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
main.article div.header h1, main.article div.header h2 {
|
||||
margin-top: 0.85em;
|
||||
margin-bottom: 0.25em;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
main.article div.header h1 a, main.article div.header h2 a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
main.article div.header span.time {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#text h1:first-child {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#text {
|
||||
text-align: justify;
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
#text li, #text table, #text blockquote {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#text img {
|
||||
max-width: 100%;
|
||||
max-height: 10vh;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.note {
|
||||
padding: 1em;
|
||||
background: #ff02;
|
||||
}
|
||||
|
||||
.note > p {
|
||||
margin: 0.6rem 0;
|
||||
}
|
||||
|
||||
.important {
|
||||
padding: 1em;
|
||||
background: #eff5ff;
|
||||
}
|
||||
|
||||
.important > p {
|
||||
margin: 0.6rem 0;
|
||||
}
|
||||
|
||||
/* Sidenotes */
|
||||
|
||||
#text .side > p:nth-child(2n+0) {
|
||||
font-style: italic;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
#text .side > p:nth-child(2n+0) > i, #text .side > p:nth-child(2n+0) > em {
|
||||
font-style: normal;
|
||||
}
|
||||
@@ -2,12 +2,20 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>GitBlog.md - Home</title>
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<title>GitBlog.md - <%= article.title %></title>
|
||||
<link rel="stylesheet" type="text/css" href="/prism.css">
|
||||
<link rel="stylesheet" type="text/css" href="/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<%- article.content %>
|
||||
<main class="article">
|
||||
<div class="header">
|
||||
<a class="link-home" href="/">↑</a>
|
||||
<h1><%= article.title %></h1>
|
||||
<span class="time"><span>Published on</span> <%= article.year + '-' + article.month + '-' + article.day %></span>
|
||||
</div>
|
||||
<div id="text"><%- article.content %></div>
|
||||
<hr>
|
||||
<a href="#top">Go to top</a> - <a href="/">Back to home</a>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user