mirror of
https://github.com/BBaoVanC/bobatheme.git
synced 2025-06-27 07:37:29 -05:00
Compare commits
13 Commits
4808585bd0
...
custom-fon
Author | SHA1 | Date | |
---|---|---|---|
72b5479472
|
|||
4d1a0d6be2
|
|||
ac580e1995
|
|||
cee1cd3a82
|
|||
3fae019148
|
|||
8ef1e3840a
|
|||
629b3758b9
|
|||
9412906b4f
|
|||
f8cfad647f
|
|||
b200623dca
|
|||
80f5994d96
|
|||
342710a755
|
|||
8eb642dbc8
|
@ -1,4 +1,6 @@
|
|||||||
/* bobatheme is available under the MIT license at
|
/* vim: foldmethod=marker
|
||||||
|
*
|
||||||
|
* bobatheme is available under the MIT license at
|
||||||
* https://github.com/BBaoVanC/bobatheme.
|
* https://github.com/BBaoVanC/bobatheme.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
@ -46,6 +48,7 @@
|
|||||||
--text-gray-1: #919191; /* lch(60, 0, X) */
|
--text-gray-1: #919191; /* lch(60, 0, X) */
|
||||||
|
|
||||||
--link-0: #3a94fb; /* lch(60, 60, 270) */
|
--link-0: #3a94fb; /* lch(60, 60, 270) */
|
||||||
|
--link-1: #4ea1ff; /* lch(65, 60, 270) -- out of sRGB */
|
||||||
|
|
||||||
--figure-border: #1f5593; /* lch(35, 40, 270) */
|
--figure-border: #1f5593; /* lch(35, 40, 270) */
|
||||||
|
|
||||||
@ -116,6 +119,166 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* Fonts */
|
||||||
|
|
||||||
|
/* Open Sans {{{ */
|
||||||
|
/* cyrillic-ext */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4taVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||||
|
}
|
||||||
|
/* cyrillic */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4kaVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||||
|
}
|
||||||
|
/* greek-ext */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4saVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+1F00-1FFF;
|
||||||
|
}
|
||||||
|
/* greek */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4jaVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0370-03FF;
|
||||||
|
}
|
||||||
|
/* hebrew */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4iaVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
|
||||||
|
}
|
||||||
|
/* vietnamese */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4vaVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||||
|
}
|
||||||
|
/* latin-ext */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4uaVIGxA.woff2) format('woff2');
|
||||||
|
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||||
|
}
|
||||||
|
/* latin */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Open Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-stretch: 100%;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/opensans/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0B4gaVI.woff2) format('woff2');
|
||||||
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||||
|
}
|
||||||
|
/* }}} */
|
||||||
|
/* JetBrains Mono {{{ */
|
||||||
|
/* cyrillic-ext */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTN1OVgaY.woff2) format('woff2');
|
||||||
|
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||||
|
}
|
||||||
|
/* cyrillic */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTPlOVgaY.woff2) format('woff2');
|
||||||
|
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||||
|
}
|
||||||
|
/* greek */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOVOVgaY.woff2) format('woff2');
|
||||||
|
unicode-range: U+0370-03FF;
|
||||||
|
}
|
||||||
|
/* vietnamese */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTNVOVgaY.woff2) format('woff2');
|
||||||
|
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||||
|
}
|
||||||
|
/* latin-ext */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTNFOVgaY.woff2) format('woff2');
|
||||||
|
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||||
|
}
|
||||||
|
/* latin */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'JetBrains Mono';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/font/jetbrainsmono/tDbY2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKxTOlOV.woff2) format('woff2');
|
||||||
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||||
|
}
|
||||||
|
/* }}} */
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--font-sans: "Open Sans", "Noto Sans", sans-serif;
|
||||||
|
--font-mono: "JetBrains Mono", monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
font-family: var(--font-sans);
|
||||||
|
}
|
||||||
|
pre, code, kbd, samp {
|
||||||
|
font-family: var(--font-mono);
|
||||||
|
font-size: 0.75em;
|
||||||
|
}
|
||||||
|
pre > code {
|
||||||
|
/* otherwise it ends up being 0.75^2 em */
|
||||||
|
font-size: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Post layout (in list pages) */
|
/* Post layout (in list pages) */
|
||||||
.list-page-content {
|
.list-page-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -272,7 +435,7 @@
|
|||||||
.sections {
|
.sections {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 40px;
|
gap: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section {
|
.section {
|
||||||
@ -423,16 +586,15 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.share-buttons button,
|
|
||||||
.share-buttons a {
|
.share-buttons a {
|
||||||
background-color: var(--background-2);
|
background-color: var(--background-2);
|
||||||
color: var(--text-2);
|
color: var(--text-2);
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
.share-buttons a:hover {
|
||||||
.share-buttons button {
|
background-color: var(--background-3);
|
||||||
border: none;
|
color: var(--text-3);
|
||||||
}
|
}
|
||||||
|
|
||||||
.share-buttons svg {
|
.share-buttons svg {
|
||||||
@ -570,7 +732,6 @@ html {
|
|||||||
body {
|
body {
|
||||||
background-color: var(--background-0);
|
background-color: var(--background-0);
|
||||||
color: var(--text-0);
|
color: var(--text-0);
|
||||||
font-family: "Open Sans", "Noto Sans", sans-serif;
|
|
||||||
margin: 20px;
|
margin: 20px;
|
||||||
max-width: 720px;
|
max-width: 720px;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
@ -583,6 +744,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
|
margin-top: 20px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -630,6 +792,7 @@ a:hover {
|
|||||||
blockquote {
|
blockquote {
|
||||||
border-left: 5px solid var(--background-2);
|
border-left: 5px solid var(--background-2);
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
@ -700,10 +863,12 @@ table.markdown {
|
|||||||
}
|
}
|
||||||
.code-block > .code-header > .code-type {
|
.code-block > .code-header > .code-type {
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
font-family: monospace;
|
|
||||||
margin: auto 0;
|
margin: auto 0;
|
||||||
}
|
}
|
||||||
/* TODO: make the code copy button prettier */
|
/* TODO: make the code copy button prettier */
|
||||||
|
.code-block > .code-header > .code-copy-button {
|
||||||
|
color: var(--link-1);
|
||||||
|
}
|
||||||
.code-block > .code-header > .code-copy-button:hover {
|
.code-block > .code-header > .code-copy-button:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
@ -738,6 +903,7 @@ table.markdown {
|
|||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.code-block > .code-header > .code-type,
|
||||||
code {
|
code {
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
@ -12,14 +12,19 @@ window.onscroll = function() {
|
|||||||
window.onload = () => {
|
window.onload = () => {
|
||||||
document.querySelectorAll(".code-block").forEach(codeBlock => {
|
document.querySelectorAll(".code-block").forEach(codeBlock => {
|
||||||
const button = codeBlock.querySelector(".code-header > .code-copy-button");
|
const button = codeBlock.querySelector(".code-header > .code-copy-button");
|
||||||
// TODO: maybe get this from HTMLElement.innerText on the actual code block content element
|
|
||||||
// but it's hard to select it; `data-lang` attribute might not always be there (if lang is unset)
|
// lang will not be unset because we default it to text
|
||||||
const rawCode = codeBlock.querySelector("pre.code-raw").innerText;
|
// clone it so it doesn't change the actual DOM element
|
||||||
|
const codeElem = codeBlock.querySelector("code[data-lang]").cloneNode(true);
|
||||||
|
// bashsession: remove command output lines
|
||||||
|
codeElem.querySelectorAll(".go").forEach(e => e.parentNode.removeChild(e));
|
||||||
|
// bashsession: remove prompt symbol
|
||||||
|
codeElem.querySelectorAll(".gp").forEach(e => e.parentNode.removeChild(e));
|
||||||
|
const rawCode = codeElem.innerText;
|
||||||
|
|
||||||
const originalCopyText = button.innerHTML;
|
const originalCopyText = button.innerHTML;
|
||||||
button.onclick = event => {
|
button.onclick = event => {
|
||||||
navigator.clipboard.writeText(rawCode);
|
navigator.clipboard.writeText(rawCode);
|
||||||
console.log(rawCode);
|
|
||||||
// TODO: maybe we could add a fancier indicator, like a flash or something
|
// TODO: maybe we could add a fancier indicator, like a flash or something
|
||||||
event.target.innerHTML = "Copied!";
|
event.target.innerHTML = "Copied!";
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
@ -1,13 +1,15 @@
|
|||||||
|
{{ $type := "text" }}
|
||||||
|
{{ with .Type }}
|
||||||
|
{{ $type = . }}
|
||||||
|
{{ end }}
|
||||||
<div class="code-block">
|
<div class="code-block">
|
||||||
<div class="code-header">
|
<div class="code-header">
|
||||||
<span class="code-type">{{ .Type }}</span>
|
<pre class="code-type">{{ $type }}</pre>
|
||||||
<a class="code-copy-button">
|
<a href="javascript:void(0)" class="code-copy-button">
|
||||||
{{ i18n "copy_to_clipboard" }}
|
{{ i18n "copy_to_clipboard" }}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
{{/* a div.highlight is already created by highlight function */}}
|
|
||||||
{{ highlight .Inner .Type }}
|
|
||||||
|
|
||||||
{{/* for copy to clipboard */}}
|
{{/* a div.highlight is already created by highlight function */}}
|
||||||
<pre class="code-raw" style="display: none;">{{ .Inner }}</pre>
|
{{ highlight .Inner $type }}
|
||||||
</div>
|
</div>
|
||||||
|
@ -21,7 +21,6 @@
|
|||||||
</main>
|
</main>
|
||||||
|
|
||||||
{{ if or .Site.Copyright .Site.Params.footer }}
|
{{ if or .Site.Copyright .Site.Params.footer }}
|
||||||
<hr>
|
|
||||||
<footer>
|
<footer>
|
||||||
<small>
|
<small>
|
||||||
{{ with .Site.Copyright }}
|
{{ with .Site.Copyright }}
|
||||||
|
@ -5,6 +5,10 @@
|
|||||||
{{ partial "rss-link.html" . }}
|
{{ partial "rss-link.html" . }}
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
{{ with .Content }}
|
||||||
|
{{ . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
<div class="list-page-content">
|
<div class="list-page-content">
|
||||||
{{ with .Sections }}
|
{{ with .Sections }}
|
||||||
<div class="sections">
|
<div class="sections">
|
||||||
|
@ -4,6 +4,10 @@
|
|||||||
{{ .Title | markdownify }}
|
{{ .Title | markdownify }}
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
{{ with .Content }}
|
||||||
|
{{ . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
<div class="page-list">
|
<div class="page-list">
|
||||||
{{ with .Paginator.Pages }}
|
{{ with .Paginator.Pages }}
|
||||||
{{ range . }}
|
{{ range . }}
|
||||||
|
@ -54,9 +54,10 @@
|
|||||||
*/}}
|
*/}}
|
||||||
|
|
||||||
{{ if .Site.Params.shareButtons.print }}
|
{{ if .Site.Params.shareButtons.print }}
|
||||||
<button class="print-share"
|
<a class="print-share"
|
||||||
|
href="javascript:void(0)"
|
||||||
onclick="window.print(); share_event('Print');">
|
onclick="window.print(); share_event('Print');">
|
||||||
{{- partial "icon.html" "printer" -}}
|
{{- partial "icon.html" "printer" -}}
|
||||||
</button>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
@ -4,6 +4,10 @@
|
|||||||
{{ .Title | markdownify }}
|
{{ .Title | markdownify }}
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
{{ with .Content }}
|
||||||
|
{{ . }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
<div class="series-taxonomy-list">
|
<div class="series-taxonomy-list">
|
||||||
{{ with .Pages }}
|
{{ with .Pages }}
|
||||||
{{ range . }}
|
{{ range . }}
|
||||||
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Reference in New Issue
Block a user