direct-img/direct-img.link
1
0
Fork 0
mirror of https://github.com/direct-img/direct-img.link.git synced 2026-03-17 03:01:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor: Remove demo and add donation warning

Browse Source
This commit is contained in:
multipleof4
2026-02-13 16:05:43 -08:00
parent 8db9a006b2
commit 984ce17165
1 changed files with 32 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
index.html
View File

@@ -11,6 +11,7 @@
--text: #1a1a1a; --text: #1a1a1a;
--text-muted: #666666; --text-muted: #666666;
--accent: #0070f3; --accent: #0070f3;
--warning: #eb5757;
--code-bg: #f5f5f5; --code-bg: #f5f5f5;
--border: #eaeaea; --border: #eaeaea;
--radius: 8px; --radius: 8px;
@@ -46,43 +47,29 @@
p.tagline { p.tagline {
font-size: 1.25rem; font-size: 1.25rem;
color: var(--text-muted); color: var(--text-muted);
margin-bottom: 48px; margin-bottom: 32px;
} }
.search-demo { .status-notice {
margin-bottom: 48px; padding: 16px;
} background: #fff5f5;
border: 1px solid #ffe0e0;
.input-group {
display: flex;
gap: 8px;
background: var(--code-bg);
padding: 8px;
border-radius: var(--radius); border-radius: var(--radius);
border: 1px solid var(--border); margin-bottom: 48px;
} }
.input-group span { .status-notice p {
color: var(--text-muted); margin: 0;
padding-left: 8px; font-size: 0.95rem;
display: flex;
align-items: center;
user-select: none;
}
input {
flex: 1;
border: none;
background: transparent;
font-family: inherit;
font-size: 1rem;
outline: none;
color: var(--text); color: var(--text);
padding: 4px 0; }
.status-notice strong {
color: var(--warning);
} }
.usage { .usage {
margin-top: 48px; margin-bottom: 48px;
} }
h2 { h2 {
@@ -98,20 +85,12 @@
overflow-x: auto; overflow-x: auto;
font-size: 0.9rem; font-size: 0.9rem;
border: 1px solid var(--border); border: 1px solid var(--border);
position: relative;
} }
code { code {
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
} }
.copy-hint {
font-size: 0.8rem;
color: var(--text-muted);
margin-top: 8px;
text-align: right;
}
.grid { .grid {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
@@ -130,6 +109,17 @@
font-size: 1rem; font-size: 1rem;
} }
.btc-address {
font-family: monospace;
background: var(--code-bg);
padding: 4px 8px;
border-radius: 4px;
font-size: 0.85rem;
word-break: break-all;
display: inline-block;
margin-top: 8px;
}
footer { footer {
width: 100%; width: 100%;
max-width: 680px; max-width: 680px;
@@ -162,13 +152,12 @@
<h1>direct-img.link</h1> <h1>direct-img.link</h1>
<p class="tagline">Live images in markdown, powered by search.</p> <p class="tagline">Live images in markdown, powered by search.</p>
<section class="search-demo"> <section class="status-notice">
<h2>Try it out</h2> <p>
<div class="input-group"> This service is <strong>free</strong> to use. However, API and infrastructure costs are significant.
<span>direct-img.link/</span> Without community donations, <strong>this project will die quickly.</strong>
<input type="text" id="queryInput" placeholder="orange+cat" spellcheck="false"> </p>
</div> <div class="btc-address">BTC: bc1qkqdmhk0we49qn74ua9752ysfxzd7uxqettymhv</div>
<div class="copy-hint" id="urlPreview">![image](https://direct-img.link/orange+cat)</div>
</section> </section>
<section class="usage"> <section class="usage">
@@ -199,14 +188,5 @@
</div> </div>
</footer> </footer>
<script>
const input = document.getElementById('queryInput');
const preview = document.getElementById('urlPreview');
input.addEventListener('input', (e) => {
const val = e.target.value.trim().replace(/\s+/g, '+') || 'orange+cat';
preview.textContent = `![image](https://direct-img.link/${val})`;
});
</script>
</body> </body>
</html> </html>