summaryrefslogtreecommitdiff
path: root/themes/24-unification/layouts/_default/baseof.html
diff options
context:
space:
mode:
Diffstat (limited to 'themes/24-unification/layouts/_default/baseof.html')
-rw-r--r--themes/24-unification/layouts/_default/baseof.html539
1 files changed, 270 insertions, 269 deletions
diff --git a/themes/24-unification/layouts/_default/baseof.html b/themes/24-unification/layouts/_default/baseof.html
index 8911927..23bcf48 100644
--- a/themes/24-unification/layouts/_default/baseof.html
+++ b/themes/24-unification/layouts/_default/baseof.html
@@ -59,26 +59,26 @@
--breakpoint: 800px;
}
- @font-face {
- font-family: "bryle";
- {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Regular-102a.woff2" -}}
- src: url("{{ $font.Permalink }}");
- font-weight: normal;
- }
-
- @font-face {
- font-family: "bryle";
- {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Bold-102a.woff2" -}}
- src: url("{{ $font.Permalink }}");
- font-weight: bold;
- }
-
- @font-face {
- font-family: "bryle";
- {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Italic-102a.woff2" -}}
- src: url("{{ $font.Permalink }}");
- font-style: italic;
- }
+ @font-face {
+ font-family: "bryle";
+ {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Regular-102a.woff2" -}}
+ src: url("{{ $font.Permalink }}");
+ font-weight: normal;
+ }
+
+ @font-face {
+ font-family: "bryle";
+ {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Bold-102a.woff2" -}}
+ src: url("{{ $font.Permalink }}");
+ font-weight: bold;
+ }
+
+ @font-face {
+ font-family: "bryle";
+ {{- $font := resources.Get "fonts/Atkinson-Hyperlegible-Italic-102a.woff2" -}}
+ src: url("{{ $font.Permalink }}");
+ font-style: italic;
+ }
html {
min-height: 100dvh;
}
@@ -150,7 +150,7 @@
margin: 0;
padding: 0;
}
-
+
li {
box-sizing: border-box;
background-color: var(--bg-nav-section);
@@ -185,7 +185,7 @@
box-sizing: border-box;
padding-left: 20px;
border-bottom: var(--cool-border);
-
+
li {
background-color: var(--panel-color);
border: 0;
@@ -207,266 +207,267 @@
display: block;
}
}
-
- @media only screen and (max-width: 800px) {
- .logo {
- display: none;
- }
-
- .nav {
- width: 100%;
- margin-bottom: 20px;
- border-bottom: var(--cool-border);
- border-right: none;
-
- .nav-box {
- width: 100%;
- border: 0;
- }
-
- ol.section {
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- }
-
- ol.subsection {
- display: none!important;
- }
-
- li {
- flex-shrink: 1;
- border: var(--cool-border)!important;
- padding: 5px;
-
- a {
- width: 100%!important;
- border: 0!important;
- }
- }
- }
-
- .webbuttons {
- display: none;
- }
-
- }
-
- /* Main */
- main {
- padding-left: 20px;
- box-sizing: border-box;
- width: 100%;
- padding-top: 20px;
-
- article {
- background-color: var(--panel-color);
- margin-bottom: 20px;
- border: var(--cool-border);
- display: flow-root;
-
- h2 {
- margin: 0;
- padding-top: 10px;
- padding-bottom: 5px;
- padding-left: 20px;
- padding-right: 20px;
-
- }
- p {
- padding-left: 20px;
- padding-right: 20px;
- text-align: justify;
- }
-
- time {
- padding-left: 20px;
- padding-right: 20px;
- }
-
- > pre, table {
- padding-left: 20px;
- padding-right: 20px;
- overflow-x: scroll;
- }
-
- .highlight {
- padding-left: 20px;
- padding-right: 20px;
-
- pre {
- overflow-x: scroll;
-
- }
- }
-
- aside.post-meta {
- border-top: var(--cool-border);
- padding-left: 20px;
- padding-right: 20px;
- padding-top: 5px;
- padding-bottom: 5px;
- background-color: var(--panel-meta-color);
- }
-
- figure {
- text-align: center;
- margin: 0;
- max-width: 100%;
- font-size: 0.8em;
- }
-
- img.float-right {
- float: right;
- display: inline;
- margin-left: 10px;
- }
-
- img.center {
- max-width: 100%;
- height: auto;
- }
+
+ @media only screen and (max-width: 800px) {
+ .logo {
+ display: none;
+ }
+
+ .nav {
+ width: 100%;
+ margin-bottom: 20px;
+ border-bottom: var(--cool-border);
+ border-right: none;
+
+ .nav-box {
+ width: 100%;
+ border: 0;
+ }
+
+ ol.section {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ }
+
+ ol.subsection {
+ display: none!important;
+ }
+
+ li {
+ flex-shrink: 1;
+ border: var(--cool-border)!important;
+ padding: 5px;
+
+ a {
+ width: 100%!important;
+ border: 0!important;
+ }
+ }
+ }
+
+ .webbuttons {
+ display: none;
+ }
- .button img {
- width: 88px;
- padding-left: 44px;
- }
-
- .pull-left {
- float: left;
- margin: 10px;
- }
-
- .pull-right {
- float: right;
- margin: 10px;
- }
- }
- article.link {
- padding: 20px;
- display: flex;
- justify-content: center;
+
+ }
+nav.horizontal {
+ display: flex;
+ width: 100%;
+
+ a {
+ display: block;
+ flex-grow: 1;
+ border: var(--cool-border);
+ padding: 5px;
+ text-align: center;
+ margin-bottom: 10px;
+ margin-top: 10px;
+ background-color: var(--panel-color);
+ }}
+
+
+ /* Main */
+ main {
+ padding-left: 20px;
+ box-sizing: border-box;
+ width: 100%;
+ padding-top: 20px;
+
+ article {
+ background-color: var(--panel-color);
+ margin-bottom: 20px;
+ border: var(--cool-border);
+ display: flow-root;
+
+ h1.comic-title {
+ margin: 0;
+ border-bottom: var(--cool-border);
+ padding-left: 20px;
+ padding-right: 20px;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ background-color: var(--panel-meta-color);
+
+ time {
+ padding: 0;
+ }
+ }
+
+ h2, h3, h4, h5 {
+ margin: 0;
+ padding-top: 10px;
+ padding-bottom: 5px;
+ padding-left: 20px;
+ padding-right: 20px;
+
+ }
+ p {
+ padding-left: 20px;
+ padding-right: 20px;
+ text-align: justify;
+ }
+
+ time {
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+
+ > pre, table {
+ padding-left: 20px;
+ padding-right: 20px;
+ overflow-x: scroll;
+ }
+
+ .highlight {
+ padding-left: 20px;
+ padding-right: 20px;
- time {
- padding-left: 0;;
- }
- .img {
- padding-right: 20px;
- flex-grow: 0;
- height: 32px;
- width: 32px;
- }
- .text {
- flex-grow: 1;
- }
- }
+ pre {
+ overflow-x: scroll;
+ padding: 10px;
+ border: var(--cool-border);
- table.eptab {
- width: 100%;
-
- th {
- text-align: center;
- padding: 20px;
- }
-
- tr td {
- text-align: center;
- }
- tr td:last-child {
- text-align: left;
- }
- }
-
- }
+ }
+ }
+
+ .post-meta {
+ border-top: var(--cool-border);
+ padding-left: 20px;
+ padding-right: 20px;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ background-color: var(--panel-meta-color);
+ }
+
+ figure {
+ text-align: center;
+ margin: 0;
+ max-width: 100%;
+ font-size: 0.8em;
+ }
+
+ img.float-right {
+ float: right;
+ display: inline;
+ margin-left: 10px;
+ }
+
+ img.center {
+ max-width: 100%;
+ height: auto;
+ }
+
+ .button img {
+ width: 88px;
+ padding-left: 44px;
+ }
+
+ .pull-left {
+ float: left;
+ margin: 10px;
+ }
+
+ .pull-right {
+ float: right;
+ margin: 10px;
+ }
+ }
+ article.link {
+ padding: 20px;
+ display: flex;
+ justify-content: center;
+
+ time {
+ padding-left: 0;;
+ }
+ .img {
+ padding-right: 20px;
+ flex-grow: 0;
+ height: 32px;
+ width: 32px;
+ }
+ .text {
+ flex-grow: 1;
+ }
+ }
+
+ table.eptab {
+ width: 100%;
+
+ th {
+ text-align: center;
+ padding: 20px;
+ }
+
+ tr td {
+ text-align: center;
+ }
+ tr td:last-child {
+ text-align: left;
+ }
+ }
+
+ a.list-button-link {
+ margin-left: 5px;
+ }
+ a.visit-marked:visited {
+ color: #888!important;
+ }
+
+ }
+
+ @media only screen and (max-width: 650px) {
+ table.eptab {
+ th, td {
+ display: none;
+ }
+ tr th:nth-child(2) {
+ display: table-cell;
+ }
+ tr th:last-child {
+ display: table-cell;
+ }
+ tr td:last-child {
+ display: table-cell;
+ }
+ tr td:nth-child(2) {
+ display: table-cell;
+ }
+ tr td:last-child {
+ display: table-cell;
+ }
+ }
+ }
+
+ img {
+ max-width: 100%;
+ height: auto;
+
+ }
- @media only screen and (max-width: 650px) {
- table.eptab {
- th, td {
- display: none;
- }
- tr th:nth-child(2) {
- display: table-cell;
- }
- tr th:last-child {
- display: table-cell;
- }
- tr td:last-child {
- display: table-cell;
- }
- tr td:nth-child(2) {
- display: table-cell;
- }
- tr td:last-child {
- display: table-cell;
- }
- }
- }
-
- img {
- max-width: 100%;
- height: auto;
-
- }
+ .blog-pages-list {
+ border: var(--cool-border);
+ margin-bottom: 20px;
+ padding: 20px;
+ background-color: var(--panel-color);
+ }
- .blog-pages-list {
- border: var(--cool-border);
- margin-bottom: 20px;
- padding: 20px;
- background-color: var(--panel-color);
- }
+ @media only screen and (max-width: 800px) {
+ main {
+ padding: 10px;
+ }
+ }
- @media only screen and (max-width: 800px) {
- main {
- padding: 10px;
- }
- }
</style>
</head>
<body>
<nav class="nav">
-<a href="#content" style="height: 1px; left: 0; overflow: hidden; position: absolute; top: -1000px; width: 1px;">Skip to content</a>
- <div class="nav-box">
- <div class="logo" id="faceBg">
- {{ partial "blog/face-game.html" . }}
- </div>
- {{ $page := . }}
- {{- with index site.Menus "sections" }}
- <ol class="section">
- <li class="name"><a href="/"><b>CRYS</b>SITE</a></li>
- {{- range . }}
- <li
- {{ $sectionSlice := slice .Params.section}}
- {{ if intersect $page.Params.Categories $sectionSlice}}
- class="active"
- {{ end }}
-
- ><a href="{{ .URL }}">{{ .Name }}</a>
- {{- with index site.Menus .Params.submenu }}
- <ol class="subsection">
- {{- range .}}
- <li><a href="{{ .URL}}">{{ .Name }}</a></li>
- {{- end}}
- </ol>
-
- {{- end}}
- </li>
-
- {{- end}}
-
- <li class="section" id="moneyLink">
- <a href="https://ko-fi.com/mmspl" target="blank">Buy me a Ko-Fi</a>
- </li>
- </ol>
- {{- end}}
-
- </div>
-
- <div class="webbuttons">
- {{ partial "button-31" (dict "file" "rss.gif" "alt" "RSS Feed" "href" "https://michal.sapka.me/blog/index.xml") }}
- </div>
+ {{ partialCached "24-unification/nav.html" . .Section }}
</nav>
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-04 02:36:00 +0000