smaller buttons
This commit is contained in:
Gamosoft
parent
e0022951ce
commit
7ad159a77e
|
|
@ -55,6 +55,7 @@ function noteApp() {
|
||||||
totalMatches: 0, // Total number of matches in the note
|
totalMatches: 0, // Total number of matches in the note
|
||||||
isSaving: false,
|
isSaving: false,
|
||||||
lastSaved: false,
|
lastSaved: false,
|
||||||
|
linkCopied: false,
|
||||||
saveTimeout: null,
|
saveTimeout: null,
|
||||||
|
|
||||||
// Theme state
|
// Theme state
|
||||||
|
|
@ -4016,10 +4017,7 @@ function noteApp() {
|
||||||
|
|
||||||
// Copy current note link to clipboard
|
// Copy current note link to clipboard
|
||||||
async copyNoteLink() {
|
async copyNoteLink() {
|
||||||
if (!this.currentNote) {
|
if (!this.currentNote) return;
|
||||||
alert('No note selected');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Build the full URL
|
// Build the full URL
|
||||||
const pathWithoutExtension = this.currentNote.replace('.md', '');
|
const pathWithoutExtension = this.currentNote.replace('.md', '');
|
||||||
|
|
@ -4028,14 +4026,6 @@ function noteApp() {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await navigator.clipboard.writeText(url);
|
await navigator.clipboard.writeText(url);
|
||||||
|
|
||||||
// Brief visual feedback (change button text temporarily)
|
|
||||||
const btn = event.target.closest('button');
|
|
||||||
const originalHTML = btn.innerHTML;
|
|
||||||
btn.innerHTML = '<span class="hidden md:inline">✓ Copied!</span><span class="md:hidden">✓</span>';
|
|
||||||
setTimeout(() => {
|
|
||||||
btn.innerHTML = originalHTML;
|
|
||||||
}, 1500);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
// Fallback for older browsers
|
// Fallback for older browsers
|
||||||
const textArea = document.createElement('textarea');
|
const textArea = document.createElement('textarea');
|
||||||
|
|
@ -4044,8 +4034,13 @@ function noteApp() {
|
||||||
textArea.select();
|
textArea.select();
|
||||||
document.execCommand('copy');
|
document.execCommand('copy');
|
||||||
document.body.removeChild(textArea);
|
document.body.removeChild(textArea);
|
||||||
alert('Link copied to clipboard!');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Show brief "Copied!" feedback
|
||||||
|
this.linkCopied = true;
|
||||||
|
setTimeout(() => {
|
||||||
|
this.linkCopied = false;
|
||||||
|
}, 1500);
|
||||||
},
|
},
|
||||||
|
|
||||||
// Homepage folder navigation methods
|
// Homepage folder navigation methods
|
||||||
|
|
|
||||||
|
|
@ -1848,30 +1848,45 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Export HTML Button -->
|
<!-- Note Actions Toolbar -->
|
||||||
|
<div
|
||||||
|
x-show="currentNote"
|
||||||
|
class="flex items-center rounded overflow-hidden"
|
||||||
|
style="background-color: var(--bg-tertiary); border: 1px solid var(--border-primary);"
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
@click="exportToHTML()"
|
@click="exportToHTML()"
|
||||||
class="px-2 md:px-3 py-1 md:py-1.5 text-xs md:text-sm rounded transition hover:opacity-80"
|
class="p-2 transition"
|
||||||
style="background-color: var(--bg-tertiary); color: var(--text-secondary);"
|
style="color: var(--text-secondary);"
|
||||||
title="Export as HTML"
|
title="Export as HTML"
|
||||||
|
@mouseenter="$el.style.backgroundColor = 'var(--bg-secondary)'"
|
||||||
|
@mouseleave="$el.style.backgroundColor = 'transparent'"
|
||||||
>
|
>
|
||||||
<span class="hidden md:inline">📄 Export HTML</span>
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
<span class="md:hidden">📄</span>
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
|
<div style="width: 1px; height: 20px; background-color: var(--border-primary);"></div>
|
||||||
<!-- Copy Link Button -->
|
|
||||||
<button
|
<button
|
||||||
@click="copyNoteLink()"
|
@click="copyNoteLink()"
|
||||||
x-show="currentNote"
|
class="p-2 transition hover:bg-opacity-80"
|
||||||
class="px-2 md:px-3 py-1 md:py-1.5 text-xs md:text-sm rounded transition hover:opacity-80"
|
:title="linkCopied ? 'Copied!' : 'Copy link to clipboard'"
|
||||||
style="background-color: var(--bg-tertiary); color: var(--text-secondary);"
|
:style="'color: ' + (linkCopied ? 'var(--success, #22c55e)' : 'var(--text-secondary)') + ';'"
|
||||||
title="Copy link to clipboard"
|
@mouseenter="$el.style.backgroundColor = 'var(--bg-secondary)'"
|
||||||
|
@mouseleave="$el.style.backgroundColor = 'transparent'"
|
||||||
>
|
>
|
||||||
<span class="hidden md:inline">🔗 Copy Link</span>
|
<!-- Link icon (default) -->
|
||||||
<span class="md:hidden">🔗</span>
|
<svg x-show="!linkCopied" class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"></path>
|
||||||
|
</svg>
|
||||||
|
<!-- Checkmark icon (after copy) -->
|
||||||
|
<svg x-show="linkCopied" x-cloak class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Editor/Preview/Graph -->
|
<!-- Editor/Preview/Graph -->
|
||||||
<div class="flex-1 flex relative" style="min-height: 0;">
|
<div class="flex-1 flex relative" style="min-height: 0;">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue