Compare commits

..

2 Commits

Author SHA1 Message Date
4808585bd0
WIP 2023-01-21 23:19:49 -06:00
a7ff8afb9f
WIP 2023-01-21 23:19:32 -06:00
8 changed files with 18 additions and 42 deletions

View File

@ -46,7 +46,6 @@
--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) */
@ -290,7 +289,7 @@
.sections { .sections {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 10px; gap: 40px;
} }
.section { .section {
@ -441,15 +440,16 @@
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 {
background-color: var(--background-3); .share-buttons button {
color: var(--text-3); border: none;
} }
.share-buttons svg { .share-buttons svg {
@ -602,7 +602,6 @@ body {
} }
footer { footer {
margin-top: 20px;
text-align: center; text-align: center;
} }
@ -650,7 +649,6 @@ 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 {
@ -724,9 +722,6 @@ table.markdown {
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;
} }

View File

@ -12,19 +12,14 @@ 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
// lang will not be unset because we default it to text // but it's hard to select it; `data-lang` attribute might not always be there (if lang is unset)
// clone it so it doesn't change the actual DOM element const rawCode = codeBlock.querySelector("pre.code-raw").innerText;
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(() => {

View File

@ -1,15 +1,13 @@
{{ $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> <span class="code-type">{{ .Type }}</span>
<a href="javascript:void(0)" class="code-copy-button"> <a 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 */}} {{/* a div.highlight is already created by highlight function */}}
{{ highlight .Inner $type }} {{ highlight .Inner .Type }}
{{/* for copy to clipboard */}}
<pre class="code-raw" style="display: none;">{{ .Inner }}</pre>
</div> </div>

View File

@ -21,6 +21,7 @@
</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 }}

View File

@ -5,10 +5,6 @@
{{ 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">

View File

@ -4,10 +4,6 @@
{{ .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 . }}

View File

@ -54,10 +54,9 @@
*/}} */}}
{{ if .Site.Params.shareButtons.print }} {{ if .Site.Params.shareButtons.print }}
<a class="print-share" <button 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" -}}
</a> </button>
{{ end }} {{ end }}
</div> </div>

View File

@ -4,10 +4,6 @@
{{ .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 . }}