src/whiskr
1
0
Fork 0
mirror of https://github.com/coalaura/whiskr.git synced 2025-12-02 20:22:52 +00:00
Code Activity

sticky markdown copy

Browse Source
This commit is contained in:
Laura
2025-11-30 22:52:16 +01:00
parent 4d1bdf981a
commit cb9a724770
4 changed files with 51 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
static/css/chat.css
View File

@@ -225,7 +225,6 @@ body:not(.loading) #loading {
display: block;
height: 14px;
flex-shrink: 0;
margin-bottom: -40px;
}
#messages:empty::before {
@@ -233,7 +232,7 @@ body:not(.loading) #loading {
color: var(--c-subtext);
font-style: italic;
align-self: center;
margin-top: 20px;
margin-top: 5px;
}
#message,
@@ -446,7 +445,7 @@ body:not(.loading) #loading {
.message .body {
position: relative;
border-radius: 6px;
overflow: hidden;
overflow: visible;
padding: 14px 12px;
display: flex;
flex-direction: column;
@@ -456,6 +455,7 @@ body:not(.loading) #loading {
.message.collapsed .body {
height: 32px;
overflow: hidden;
}
.message.collapsed .body>* {
@@ -1182,6 +1182,7 @@ label[for="reasoning-tokens"] {
height: 20px;
background-image: url(icons/up.svg);
transition: 150ms;
z-index: 15;
}
#bottom {

29
static/css/markdown.css
View File

@@ -2,7 +2,7 @@
font-size: 15px;
line-height: 23px;
color: var(--c-text);
overflow: hidden;
overflow: visible;
word-wrap: break-word;
}
@@ -153,37 +153,38 @@
.markdown pre {
background: var(--c-mantle);
white-space: pre-wrap;
padding: 10px 12px;
padding: 0;
border-radius: 6px;
line-height: 18px;
overflow: hidden;
tab-size: 4;
position: relative;
}
.markdown pre code {
display: block;
background: transparent;
padding: 0;
padding: 10px 12px;
margin: 0;
}
.markdown .pre-header {
position: relative;
background: var(--c-surface0);
padding: 8px 12px;
margin: -10px -12px;
margin-bottom: 10px;
margin: 0;
font-size: 12px;
line-height: 14px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.markdown .pre-copy {
position: absolute;
top: 6px;
right: 10px;
width: 18px;
height: 18px;
opacity: 0;
transition: 150ms;
position: sticky;
top: 34px;
float: right;
margin-top: -30px;
width: 30px;
height: 30px;
background-size: 20px;
}
.markdown pre:hover .pre-copy {

11
static/js/chat.js
View File

@@ -258,6 +258,17 @@
this.#_message.appendChild(_header);
_header.addEventListener("auxclick", event => {
if (event.button !== 1) {
return;
}
this.#_message.scrollIntoView({
behavior: "smooth",
block: "start",
});
});
// message role (wrapper)
const _wrapper = make("div", "role", this.#role);

15
static/js/markdown.js
View File

@@ -50,9 +50,10 @@
renderer: {
code: code => {
const header = `<div class="pre-header">${escapeHtml(code.lang)}<button class="pre-copy" title="Copy code contents"></button></div>`;
const header = `<div class="pre-header">${escapeHtml(code.lang)}</div>`;
const button = `<button class="pre-copy" title="Copy code contents"></button>`;
return `<pre class="l-${escapeHtml(code.lang)}">${header}<code>${code.text}</code></pre>`;
return `<pre class="l-${escapeHtml(code.lang)}">${header}${button}<code>${code.text}</code></pre>`;
},
link: link => `<a href="${link.href}" target="_blank">${escapeHtml(link.text || link.href)}</a>`,
@@ -140,9 +141,13 @@
}
addEventListener("click", event => {
const button = event.target,
header = button.closest(".pre-header"),
pre = header?.closest("pre"),
const button = event.target;
if (!button.classList.contains("pre-copy")) {
return;
}
const pre = button.closest("pre"),
code = pre?.querySelector("code");
if (!code) {