Add a copy button to the article title

This commit is contained in:
2025-12-02 23:19:12 +00:00
parent 169a84faa1
commit 482753e96a
5 changed files with 9 additions and 9 deletions

View File

@@ -44,7 +44,7 @@ function Article({ cache }) {
}, [id]); }, [id]);
const copyLink = () => { const copyLink = () => {
navigator.clipboard.writeText(`${story.title} ${window.location.href}`).then(() => { navigator.clipboard.writeText(`${story.title}:\n${window.location.href}`).then(() => {
setCopyButtonText('\uea10'); setCopyButtonText('\uea10');
setTimeout(() => setCopyButtonText('\ue92c'), 2000); setTimeout(() => setCopyButtonText('\ue92c'), 2000);
}, () => { }, () => {
@@ -82,10 +82,7 @@ function Article({ cache }) {
<meta name="robots" content="noindex" /> <meta name="robots" content="noindex" />
</Helmet> </Helmet>
<div className='article-title'> <h1>{story.title} <button className='copy-button' onClick={copyLink}>{copyButtonText}</button></h1>
<h1>{story.title}</h1>
<button className='copy-button' onClick={copyLink}>{copyButtonText}</button>
</div>
<div className='info'> <div className='info'>
Source: {sourceLink(story)} Source: {sourceLink(story)}

View File

@@ -101,7 +101,7 @@ function Feed({ updateCache }) {
<title>QotNews</title> <title>QotNews</title>
<meta name="robots" content="index" /> <meta name="robots" content="index" />
</Helmet> </Helmet>
{loadingStatus && <p>Fetching stories {loadingStatus.current} / {loadingStatus.total}...</p>} {loadingStatus && <p>Preloading stories {loadingStatus.current} / {loadingStatus.total}...</p>}
{error && {error &&
<details style={{marginBottom: '1rem'}}> <details style={{marginBottom: '1rem'}}>
<summary>Connection error? Click to expand.</summary> <summary>Connection error? Click to expand.</summary>

View File

@@ -130,7 +130,6 @@ span.source {
.article h1 { .article h1 {
font-size: 1.6rem; font-size: 1.6rem;
margin: 0;
} }
.article h2 { .article h2 {
@@ -270,10 +269,9 @@ span.source {
} }
.copy-button { .copy-button {
font: 2rem/1 'icomoon'; font: 1.5rem/1 'icomoon2';
background: transparent; background: transparent;
border: none; border: none;
cursor: pointer; cursor: pointer;
padding: 0 0.5rem;
vertical-align: middle; vertical-align: middle;
} }

View File

@@ -26,3 +26,8 @@
font-family: 'Icomoon'; font-family: 'Icomoon';
src: url('icomoon.ttf') format('truetype'); src: url('icomoon.ttf') format('truetype');
} }
@font-face {
font-family: 'Icomoon2';
src: url('icomoon2.ttf') format('truetype');
}

Binary file not shown.