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) */
--link-0: #3a94fb; /* lch(60, 60, 270) */
--link-1: #4ea1ff; /* lch(65, 60, 270) -- out of sRGB */
--figure-border: #1f5593; /* lch(35, 40, 270) */
@ -290,7 +289,7 @@
.sections {
display: flex;
flex-direction: column;
gap: 10px;
gap: 40px;
}
.section {
@ -441,15 +440,16 @@
justify-content: center;
}
.share-buttons button,
.share-buttons a {
background-color: var(--background-2);
color: var(--text-2);
padding: 4px;
border-radius: 8px;
}
.share-buttons a:hover {
background-color: var(--background-3);
color: var(--text-3);
.share-buttons button {
border: none;
}
.share-buttons svg {
@ -602,7 +602,6 @@ body {
}
footer {
margin-top: 20px;
text-align: center;
}
@ -650,7 +649,6 @@ a:hover {
blockquote {
border-left: 5px solid var(--background-2);
padding-left: 15px;
margin-left: 0;
}
hr {
@ -724,9 +722,6 @@ table.markdown {
margin: auto 0;
}
/* 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 {
cursor: pointer;
}

View File

@ -12,19 +12,14 @@ window.onscroll = function() {
window.onload = () => {
document.querySelectorAll(".code-block").forEach(codeBlock => {
const button = codeBlock.querySelector(".code-header > .code-copy-button");
// lang will not be unset because we default it to text
// 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;
// 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)
const rawCode = codeBlock.querySelector("pre.code-raw").innerText;
const originalCopyText = button.innerHTML;
button.onclick = event => {
navigator.clipboard.writeText(rawCode);
console.log(rawCode);
// TODO: maybe we could add a fancier indicator, like a flash or something
event.target.innerHTML = "Copied!";
setTimeout(() => {

View File

@ -1,15 +1,13 @@
{{ $type := "text" }}
{{ with .Type }}
{{ $type = . }}
{{ end }}
<div class="code-block">
<div class="code-header">
<span class="code-type">{{ $type }}</span>
<a href="javascript:void(0)" class="code-copy-button">
<span class="code-type">{{ .Type }}</span>
<a class="code-copy-button">
{{ i18n "copy_to_clipboard" }}
</a>
</div>
{{/* 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>

View File

@ -21,6 +21,7 @@
</main>
{{ if or .Site.Copyright .Site.Params.footer }}
<hr>
<footer>
<small>
{{ with .Site.Copyright }}

View File

@ -5,10 +5,6 @@
{{ partial "rss-link.html" . }}
</h1>
{{ with .Content }}
{{ . }}
{{ end }}
<div class="list-page-content">
{{ with .Sections }}
<div class="sections">

View File

@ -4,10 +4,6 @@
{{ .Title | markdownify }}
</h1>
{{ with .Content }}
{{ . }}
{{ end }}
<div class="page-list">
{{ with .Paginator.Pages }}
{{ range . }}

View File

@ -54,10 +54,9 @@
*/}}
{{ if .Site.Params.shareButtons.print }}
<a class="print-share"
href="javascript:void(0)"
<button class="print-share"
onclick="window.print(); share_event('Print');">
{{- partial "icon.html" "printer" -}}
</a>
</button>
{{ end }}
</div>

View File

@ -4,10 +4,6 @@
{{ .Title | markdownify }}
</h1>
{{ with .Content }}
{{ . }}
{{ end }}
<div class="series-taxonomy-list">
{{ with .Pages }}
{{ range . }}