Przeglądaj źródła

define a template per operation mode

cdelorme 7 lat temu
rodzic
commit
809f63bf17
3 zmienionych plików z 490 dodań i 35 usunięć
  1. 0 35
      cmd/smd/template.tmpl
  2. 249 0
      cmd/smd/templates/book.tmpl
  3. 241 0
      cmd/smd/templates/web.tmpl

+ 0 - 35
cmd/smd/template.tmpl

@@ -1,35 +0,0 @@
-<!doctype html>
-<html lang="en">
-    <head>
-        {{/* depth stored for access inside navigation loop */}}
-        {{$depth := .Depth}}
-        <meta charset="utf-8">
-        <title>{{if .Name}}{{.Name}} | {{end}}sitename </title>
-        <link rel="stylesheet" type="text/css" href="{{$depth}}/css/main.css#{{.Version}}">
-    </head>
-    <body>
-
-        <header>
-            <h2>Site Title or Logo</h2>
-            {{if .Nav}}
-            <nav>
-                <ul>
-                {{range .Nav}}
-                    <li><a href='{{$depth}}{{.Link}}'>{{.Title}}</a></li>
-                {{end}}
-                </ul>
-            </nav>
-            {{end}}
-        </header>
-
-        <div class="content">{{.Content}}</div>
-
-        <div class="footer">
-            <p>copyrights, reference links, contact information, etc...</p>
-            <div class="scripts">
-                <script type="text/javascript" src="{{$depth}}/js/main.js#{{.Version}}"></script>
-            </div>
-        </div>
-
-    </body>
-</html>

+ 249 - 0
cmd/smd/templates/book.tmpl

@@ -0,0 +1,249 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<title>{{.Title}}</title>
+		<style>
+
+			/**
+			 * css reset
+			 * html5 display-role reset
+			 * and default styles
+			 */
+			html, body, div, span, object, h1, h2, h3, h4, h5,
+			h6, p, blockquote, pre, a, code, em, img, strong,
+			dl, ol, ul, li, embed, footer, header, menu, nav,
+			time, audio, video, progress {
+			    margin: 0;
+			    padding: 0;
+			    border: 0;
+			    font: inherit;
+			    vertical-align: baseline;
+			}
+			footer, header, menu, nav {
+			    display: block;
+			}
+			audio, canvas, progress, video {
+			    display: inline-block;
+			    vertical-align: baseline;
+			}
+			html {
+			    font-family: helvetica;
+			    font-size: 22px;
+			}
+			body {
+			    line-height: 1.4;
+			    color: #333;
+			    background-color: #fff;
+			}
+			h1 {
+			    font-size: 1.75em;
+			}
+			h2 {
+			    font-size: 1.5em;
+			}
+			h3 {
+			    font-size: 1.25em;
+			}
+			h1, h2, h3, h4, h5, h6 {
+			    font-family: sans-serif, georgia;
+			    margin-top: 20px;
+			    margin-bottom: 12px;
+			    letter-spacing: 2px;
+			}
+			h3, h4 {
+			    margin-top: 15px;
+			    margin-bottom: 10px;
+			}
+			h5, h6 {
+			    margin-top: 10px;
+			}
+			h1, h2 {
+			    font-weight: bolder;
+			}
+			h3, h4, strong, b {
+			    font-weight: bold;
+			}
+			em {
+			    font-style: italic;
+			    font-weight: 200;
+			}
+			blockquote {
+			    font-family: sans-serif, helvetica;
+			    quotes: none;
+			    padding: 10px 20px;
+			    margin: 0 0 20px;
+			    border-left: 5px solid #eee;
+			    font-style: italic;
+			}
+			hr {
+			    height: 0;
+			    margin: 20px 0;
+			    border: 0;
+			    border-top: 1px solid #eee;
+			}
+			pre {
+			    font-family: monospace;
+			}
+			code {
+			    padding: 2px 4px;
+			    font-size: 0.9em;
+			    padding: 0.05em 4px;
+			    border-radius: 4px;
+			    background: #000;
+			    overflow-x: auto;
+			    color: #f8f8f8;
+			}
+			pre code {
+			    display: block;
+			    margin: 10px 0;
+			    padding: 0.5em;
+			}
+			ul {
+			    list-style: disc;
+			}
+			ol {
+			    list-style: decimal;
+			}
+			li {
+			    margin-left: 45px;
+			    margin-bottom: 5px;
+			    line-height: 1.25;
+			}
+			ul, ol, dl, p {
+			    margin-bottom: 10px;
+			}
+			a, a:visited {
+			    color: #337ab7;
+			}
+			a:hover, a:active {
+			    background-color: transparent;
+			    text-decoration: underline;
+			    outline: 0;
+			    color: inherit;
+			}
+			a:hover, a:focus {
+			    text-decoration: underline;
+			    color: #23527c;
+			}
+			a:focus {
+			    outline: thin dotted;
+			    text-decoration: underline;
+			    outline-offset: -2px;
+			}
+			h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited,
+			h4 a, h4 a:visited, strong a, strong a:visited {
+			    color: #444;
+			    text-decoration: underline;
+			}
+			img {
+			    display: block;
+			    border: none;
+			    max-width: 100%;
+			    height: auto;
+			    vertical-align: middle;
+			}
+
+			/* containers */
+			header, .content, footer {
+			    max-width: 980px;
+			    margin: 20px auto;
+			    padding: 0 2%;
+			}
+
+			/* header & navigation */
+			header>a {
+			    color: #000;
+			    text-decoration: none;
+			}
+			header h1 {
+			    margin-bottom: 15px;
+			}
+			nav li {
+			    font-size: 1.5em;
+			    line-height: 2;
+			    padding: 0 15px;
+			    list-style: none;
+			}
+
+			/* footer styles */
+			footer {
+			    text-align: center;
+			}
+
+			/* clearfix */
+			.group:after {
+			    content: "";
+			    display: table;
+			    clear: both;
+			}
+
+			/* responsive font sizes and link styles */
+			@media only screen and (min-width: 981px) {
+			    html {
+			        font-size: 19px;
+			    }
+			}
+			@media only screen and (min-width: 1200px) {
+			    html {
+			        font-size: 16px;
+			    }
+			    a, a:hover, a:active, a:visited, h1 a, h2 a, h3 a, h4 a, strong a {
+			        text-decoration: none;
+			    }
+			    header h1 {
+			        font-size: 3em;
+			    }
+			    nav li {
+			        display: inline;
+			    }
+			}
+
+			/* for print support */
+			@media print {
+			    p, ul, ol, li {
+			        orphans: 5;
+			        widows: 3;
+			    }
+			    ul, ol, blockquote, pre, code {
+			        page-break-inside: avoid;
+			    }
+			    h2, h3, h4 {
+			        page-break-after: avoid;
+			    }
+			    html {
+			        font-size: 1em;
+			    }
+			    body {
+			        background: white;
+			    }
+			    .content {
+			        background: transparent;
+			    }
+			    p a[href^="http"]:after, li a[href^="http"]:after {
+			        content: " (" attr(href) ")";
+			    }
+			}
+
+		</style>
+	</head>
+	<body>
+		<header>
+			<h2>{{.Title}}</h2>
+			<nav>
+			</nav>
+		</header>
+
+		<div class="content">{{.Content}}</div>
+
+		<footer>
+			<p>Created on {{.Date}}{{if .Version}} ({{.Version}}){{end}}</p>
+			<div class="scripts">
+				<script>
+					// remove absolute path links
+					// automate navigation using headers
+				</script>
+			</div>
+		</footer>
+	</body>
+</html>

+ 241 - 0
cmd/smd/templates/web.tmpl

@@ -0,0 +1,241 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<title>{{ if .Name}}{{.Name}} | {{End}}{{.Title}}</title>
+		<style>
+
+			/**
+			 * css reset
+			 * html5 display-role reset
+			 * and default styles
+			 */
+			html, body, div, span, object, h1, h2, h3, h4, h5,
+			h6, p, blockquote, pre, a, code, em, img, strong,
+			dl, ol, ul, li, embed, footer, header, menu, nav,
+			time, audio, video, progress {
+			    margin: 0;
+			    padding: 0;
+			    border: 0;
+			    font: inherit;
+			    vertical-align: baseline;
+			}
+			footer, header, menu, nav {
+			    display: block;
+			}
+			audio, canvas, progress, video {
+			    display: inline-block;
+			    vertical-align: baseline;
+			}
+			html {
+			    font-family: helvetica;
+			    font-size: 22px;
+			}
+			body {
+			    line-height: 1.4;
+			    color: #333;
+			    background-color: #fff;
+			}
+			h1 {
+			    font-size: 1.75em;
+			}
+			h2 {
+			    font-size: 1.5em;
+			}
+			h3 {
+			    font-size: 1.25em;
+			}
+			h1, h2, h3, h4, h5, h6 {
+			    font-family: sans-serif, georgia;
+			    margin-top: 20px;
+			    margin-bottom: 12px;
+			    letter-spacing: 2px;
+			}
+			h3, h4 {
+			    margin-top: 15px;
+			    margin-bottom: 10px;
+			}
+			h5, h6 {
+			    margin-top: 10px;
+			}
+			h1, h2 {
+			    font-weight: bolder;
+			}
+			h3, h4, strong, b {
+			    font-weight: bold;
+			}
+			em {
+			    font-style: italic;
+			    font-weight: 200;
+			}
+			blockquote {
+			    font-family: sans-serif, helvetica;
+			    quotes: none;
+			    padding: 10px 20px;
+			    margin: 0 0 20px;
+			    border-left: 5px solid #eee;
+			    font-style: italic;
+			}
+			hr {
+			    height: 0;
+			    margin: 20px 0;
+			    border: 0;
+			    border-top: 1px solid #eee;
+			}
+			pre {
+			    font-family: monospace;
+			}
+			code {
+			    padding: 2px 4px;
+			    font-size: 0.9em;
+			    padding: 0.05em 4px;
+			    border-radius: 4px;
+			    background: #000;
+			    overflow-x: auto;
+			    color: #f8f8f8;
+			}
+			pre code {
+			    display: block;
+			    margin: 10px 0;
+			    padding: 0.5em;
+			}
+			ul {
+			    list-style: disc;
+			}
+			ol {
+			    list-style: decimal;
+			}
+			li {
+			    margin-left: 45px;
+			    margin-bottom: 5px;
+			    line-height: 1.25;
+			}
+			ul, ol, dl, p {
+			    margin-bottom: 10px;
+			}
+			a, a:visited {
+			    color: #337ab7;
+			}
+			a:hover, a:active {
+			    background-color: transparent;
+			    text-decoration: underline;
+			    outline: 0;
+			    color: inherit;
+			}
+			a:hover, a:focus {
+			    text-decoration: underline;
+			    color: #23527c;
+			}
+			a:focus {
+			    outline: thin dotted;
+			    text-decoration: underline;
+			    outline-offset: -2px;
+			}
+			h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited,
+			h4 a, h4 a:visited, strong a, strong a:visited {
+			    color: #444;
+			    text-decoration: underline;
+			}
+			img {
+			    display: block;
+			    border: none;
+			    max-width: 100%;
+			    height: auto;
+			    vertical-align: middle;
+			}
+
+			/* containers */
+			header, .content, footer {
+			    max-width: 980px;
+			    margin: 20px auto;
+			    padding: 0 2%;
+			}
+
+			/* header & navigation */
+			header>a {
+			    color: #000;
+			    text-decoration: none;
+			}
+			header h1 {
+			    margin-bottom: 15px;
+			}
+			nav li {
+			    font-size: 1.5em;
+			    line-height: 2;
+			    padding: 0 15px;
+			    list-style: none;
+			}
+
+			/* footer styles */
+			footer {
+			    text-align: center;
+			}
+
+			/* clearfix */
+			.group:after {
+			    content: "";
+			    display: table;
+			    clear: both;
+			}
+
+			/* responsive font sizes and link styles */
+			@media only screen and (min-width: 981px) {
+			    html {
+			        font-size: 19px;
+			    }
+			}
+			@media only screen and (min-width: 1200px) {
+			    html {
+			        font-size: 16px;
+			    }
+			    a, a:hover, a:active, a:visited, h1 a, h2 a, h3 a, h4 a, strong a {
+			        text-decoration: none;
+			    }
+			    header h1 {
+			        font-size: 3em;
+			    }
+			    nav li {
+			        display: inline;
+			    }
+			}
+
+			/* for print support */
+			@media print {
+			    p, ul, ol, li {
+			        orphans: 5;
+			        widows: 3;
+			    }
+			    ul, ol, blockquote, pre, code {
+			        page-break-inside: avoid;
+			    }
+			    h2, h3, h4 {
+			        page-break-after: avoid;
+			    }
+			    html {
+			        font-size: 1em;
+			    }
+			    body {
+			        background: white;
+			    }
+			    .content {
+			        background: transparent;
+			    }
+			    p a[href^="http"]:after, li a[href^="http"]:after {
+			        content: " (" attr(href) ")";
+			    }
+			}
+
+		</style>
+	</head>
+	<body>
+		<header>
+			<h2><a href='/'>{{.Title}}</a></h2>
+		</header>
+
+		<div class="content">{{.Content}}</div>
+
+		<footer>
+			<p>Created on {{.Date}}{{if .Version}} ({{.Version}}){{end}}</p>
+		</footer>
+	</body>
+</html>