テンプレートの変更
- DOCTYPEをXHTMLからHTMLに変更 - ヘッダーとフッターのアイコンとリンクを調整 - ページの一覧を共通化 - コードブロックのスタイルを移動 - "container"を"header"に統合
このコミットが含まれているのは:
コミット
639f2932ca
1
config
1
config
|
@ -19,7 +19,6 @@ blog/**/*.md:
|
|||
ext .html
|
||||
directorify
|
||||
template tag
|
||||
markdown chroma=emacs
|
||||
template page
|
||||
|
||||
blog.atom: blog/**/*.md
|
||||
|
|
94
site.tmpl
94
site.tmpl
|
@ -1,70 +1,75 @@
|
|||
{{ define "header" }}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
|
||||
{{ define "header" }}<!DOCTYPE html>
|
||||
<html lang="ja">
|
||||
<head>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
||||
<meta charset="utf-8" />
|
||||
<meta name="author" content="{{ html .Site.Other.Author }}" />
|
||||
<meta name="description" content="デジタル自主のロリ神様" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="alternate" type="application/atom+xml" title="{{ html .Site.Other.Title }} feed" href="/blog.atom" />
|
||||
<title>{{ .Site.Other.Title }}{{ if .Title }}: {{ .Title }}{{ end }}</title>
|
||||
<link rel="stylesheet" type="text/css" href="/static/style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="jswarning" id="jswarning">注意:JavsScriptはONです。安全・安心の為、JavaScriptをOFFにしてお願い致します。</div>
|
||||
<script type="text/javascript">
|
||||
document.getElementById('jswarning').style.display = 'block';
|
||||
</script>
|
||||
{{ end }}
|
||||
|
||||
{{ define "container" }} <div class="container">
|
||||
<div id="jswarning">JavaScriptが有効です。安全・安心の為、JavaScriptを無効にしてください。</div>
|
||||
<script>document.getElementById('jswarning').style.display = 'block';</script>
|
||||
<div class="container">
|
||||
<img src="/static/Eqjk_WgVQAE2psn-new.jpeg" class="header-img" alt="ヘッダー" />
|
||||
{{ end }}
|
||||
|
||||
{{ define "footer" }}
|
||||
<hr />
|
||||
<a href="https://github.com/piranha/gostatic">gostatic</a>で創作しました。<a href="https://git.076.ne.jp/TechnicalSuwako/StaticSuwako"><img src="/static/git.png" alt="Git" /></a>
|
||||
{{ define "footer" }} <hr />
|
||||
<a href="https://github.com/piranha/gostatic">gostatic</a>で創作しました。
|
||||
<a href="https://git.076.ne.jp/TechnicalSuwako/StaticSuwako">ページの<span class="icon git-icon">Git</span>リポジトリ</a>
|
||||
<div class="emblems">
|
||||
<a href="https://validator.w3.org/check?uri=https%3A%2F%2Ftechnicalsuwako.moe%2F">
|
||||
<img src="/static/valid-xhtml11.png" alt="Valid XHTML 1.1" height="31" width="88" />
|
||||
</a>
|
||||
<a href="https://jigsaw.w3.org/css-validator/validator?lang=ja&profile=none&uri=https%3A%2F%2Ftechnicalsuwako.moe%2F&usermedium=all&vextwarning=&warning=1">
|
||||
<img style="border:0;width:88px;height:31px" src="/static/valid-css.png" alt="正当なCSSです!" />
|
||||
<img style="border:0;width:88px;height:31px" src="/static/valid-css.png" alt="正当なCSSです!" />
|
||||
</a>
|
||||
<a href="https://anybrowser.org/campaign/images/button_enhanced.gif">
|
||||
<img style="border:0;width:88px;height:31px" src="/static/any1.gif" alt="どっちでもブラウザで表示出来ます!" />
|
||||
<img style="border:0;width:88px;height:31px" src="/static/any1.gif" alt="どのブラウザでも表示出来ます!" />
|
||||
</a>
|
||||
<a href="http://www.catb.org/hacker-emblem/">
|
||||
<img src="/static/hacker.png" alt="hacker emblem" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
{{ end }}
|
||||
|
||||
{{ define "page" }}{{ template "header" . }} <div class="header-links">
|
||||
<a href="/">トップ</a>
|
||||
<a href="/about/">自己紹介</a>
|
||||
<a href="/contact/">連絡先</a>
|
||||
<a href="/skill/">スキル</a>
|
||||
<a href="/portfolio/">ポートフォリオ</a>
|
||||
<a href="/service/">サービス</a>
|
||||
<a href="/webring/">リング</a>
|
||||
<a href="/i2pabout/">I2Pについて</a>
|
||||
</div>
|
||||
<div class="header-links">
|
||||
<a href="/blog.atom"><span class="icon atom-icon">Atom</span>で登録</a>
|
||||
<a href="https://social.076.ne.jp/TechnicalSuwako"><span class="icon mastodon-icon">Mastodon</span> / <span class="icon pleroma-icon">Pleroma</span>でフォロー</a>
|
||||
<a href="https://video.076.ne.jp/c/technicalsuwako"><span class="icon peertube-icon">PeerTube</span>で登録</a>
|
||||
<a href="https://technicalsuwako.moe/"><span class="icon clearnet-icon">一般ネット</span></a>
|
||||
<a href="http://6qiatzlijtqo6giwvuhex5zgg3czzwrq5g6yick3stnn4xekw26zf7qd.onion/"><span class="icon tor-icon">Tor</span></a>
|
||||
<a href="http://technicalsuwako.i2p/"><span class="icon i2p-icon">I2P</span></a>
|
||||
</div>
|
||||
<div>
|
||||
支援♡:
|
||||
<a href="/support/monero/"><span class="icon monero-icon">Monero</span></a>
|
||||
</div>
|
||||
<hr />
|
||||
{{ replace "<code>" "<code lang=\"\">" ( replace "<pre style=\"background-color:#f8f8f8;overflow-x: auto\">" "<pre>" .Content ) }}{{ template "footer" . }}{{ end }}
|
||||
|
||||
{{ define "date" }}{{ .Format "2006年01月02日" }}{{ end }}
|
||||
|
||||
{{ define "page" }}{{ template "header" . }}{{ template "container" . }} <p>
|
||||
<a href="/">トップ</a> |
|
||||
<a href="/about/">自己紹介</a> |
|
||||
<a href="/contact/">連絡先</a> |
|
||||
<a href="/skill/">スキル</a> |
|
||||
<a href="/portfolio/">ポートフォリオ</a> |
|
||||
<a href="/service/">サービス</a> |
|
||||
<a href="/webring/">リング</a> |
|
||||
<a href="/i2pabout/">I2Pについて</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="/blog.atom"><img src="/static/rssa.png" alt="RSS" />で登録</a> |
|
||||
<a href="https://social.076.ne.jp/TechnicalSuwako"><img src="/static/mastodon.png" alt="Mastodon" />/<img src="/static/pleroma.png" alt="Pleroma" />でフォロー</a> |
|
||||
<a href="https://video.076.ne.jp/c/technicalsuwako"><img src="/static/peertube.png" alt="PeerTube" />で登録</a> |
|
||||
<a href="https://technicalsuwako.moe/"><img src="/static/clearnet.png" alt="一般ネット" /></a> |
|
||||
<a href="http://6qiatzlijtqo6giwvuhex5zgg3czzwrq5g6yick3stnn4xekw26zf7qd.onion/"><img src="/static/tor.png" alt="Tor" /></a> |
|
||||
<a href="http://technicalsuwako.i2p/"><img src="/static/i2p.png" alt="I2P" /></a>
|
||||
</p>
|
||||
<p>
|
||||
支援♡:
|
||||
<a href="/support/monero/"><img src="/static/monero.png" alt="Monero" /></a>
|
||||
</p>
|
||||
<hr />
|
||||
{{ .Content }} {{ template "footer" . }}{{ end }}
|
||||
{{ define "pagelist" }}{{ range . }} <div class="mb5{{ if .Date.Year | changed "year" }} mt15{{ end }}">
|
||||
<div>{{ template "date" .Date }}</div>
|
||||
<div><a href="/{{ .Url }}">{{ .Title }}</a></div>
|
||||
</div>
|
||||
{{ end }}{{ end }}
|
||||
|
||||
{{ define "post" }}<div class="header">
|
||||
<h1>{{ .Title }}</h1>
|
||||
|
@ -78,11 +83,8 @@
|
|||
</div>
|
||||
<hr />
|
||||
<div class="section">
|
||||
{{ .Content }} </div>{{ end }}
|
||||
{{ .Content }} </div>
|
||||
{{ end }}
|
||||
|
||||
{{define "tag"}}
|
||||
# {{ .Title }} でタグ付いているページ
|
||||
{{ range .Site.Pages.WithTag .Title }}
|
||||
- [{{ .Title }}](../../{{ .Url }})
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ define "tag" }} <h1>{{ .Title }} のタグが付いているページ</h1>
|
||||
{{ template "pagelist" .Site.Pages.WithTag .Title }}{{ end }}
|
||||
|
|
|
@ -1,9 +1,4 @@
|
|||
title: トップページ
|
||||
----
|
||||
<p class="lead">
|
||||
ようこそ、あたしのウェブページへ!諏訪子です。
|
||||
</p>{{ range (((.Site.Pages.Children "blog/").Where "Url" "/$").WhereNot "Draft" "true") }}
|
||||
<div class="mb5 {{ if .Date.Year | changed "year" }}mt15{{ end }}">
|
||||
{{ template "date" .Date }}
|
||||
<a href="{{ $.Rel .Url }}">{{ .Title }}</a>
|
||||
</div>{{ end }}
|
||||
<p class="lead">ようこそ、あたしのウェブページへ!諏訪子です。</p>
|
||||
{{ template "pagelist" (((.Site.Pages.Children "blog/").Where "Url" "/$").WhereNot "Draft" "true") }}
|
||||
|
|
|
@ -26,6 +26,7 @@ td, th {
|
|||
padding: 10px;
|
||||
border: 4px #dde22d ridge;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
@ -47,7 +48,6 @@ td, th {
|
|||
.header-img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
a {
|
||||
|
@ -56,13 +56,18 @@ a {
|
|||
}
|
||||
|
||||
pre {
|
||||
background-color: #4b364b !important;
|
||||
background-color: #4b364b;
|
||||
padding: 8px;
|
||||
border: 1px #ff61ff dashed;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
font: 1rem monospace, monospace;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 600px;
|
||||
max-width: min(600px, 100%);
|
||||
max-height: 500px;
|
||||
}
|
||||
|
||||
|
@ -95,3 +100,78 @@ h1 {
|
|||
.danger {
|
||||
background-color: #da4453;
|
||||
}
|
||||
|
||||
.mb5 {
|
||||
margin-block: 0.5em;
|
||||
}
|
||||
|
||||
.mb5 > div {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.header-links {
|
||||
margin-block: 0.25em;
|
||||
}
|
||||
|
||||
.header-links > a {
|
||||
border-left: 1px solid #fcfcfc;
|
||||
display: inline-block;
|
||||
padding-left: 0.25em;
|
||||
}
|
||||
|
||||
.header-links > a:first-of-type {
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.icon::before {
|
||||
content: '';
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
display: inline-block;
|
||||
background-size: auto 1em;
|
||||
background-repeat: no-repeat;
|
||||
vertical-align: sub;
|
||||
padding-right: 0.25em;
|
||||
}
|
||||
|
||||
.atom-icon::before {
|
||||
background-image: url('/static/rssa.png');
|
||||
}
|
||||
|
||||
.mastodon-icon::before {
|
||||
background-image: url('/static/mastodon.png');
|
||||
}
|
||||
|
||||
.pleroma-icon::before {
|
||||
background-image: url('/static/pleroma.png');
|
||||
width: 0.65em;
|
||||
}
|
||||
|
||||
.peertube-icon::before {
|
||||
background-image: url('/static/peertube.png');
|
||||
}
|
||||
|
||||
.clearnet-icon::before {
|
||||
background-image: url('/static/clearnet.png');
|
||||
}
|
||||
|
||||
.tor-icon::before {
|
||||
background-image: url('/static/tor.png');
|
||||
}
|
||||
|
||||
.i2p-icon::before {
|
||||
background-image: url('/static/i2p.png');
|
||||
}
|
||||
|
||||
.monero-icon::before {
|
||||
background-image: url('/static/monero.png');
|
||||
}
|
||||
|
||||
.git-icon:before {
|
||||
background-image: url('/static/git.png');
|
||||
}
|
||||
|
||||
.emblems {
|
||||
float: right;
|
||||
}
|
||||
|
|
読み込み中…
新しいイシューから参照