38 lines
2.2 KiB
HTML
38 lines
2.2 KiB
HTML
<!-- Krita modal for ORA Editor -->
|
|
|
|
<div x-show="showKritaModal" @keydown.escape.window="closeKritaModal()"
|
|
class="fixed inset-0 z-[50] pt-12 lg:pt-0">
|
|
<!-- Backdrop (allows clicks to close) -->
|
|
<div @click="closeKritaModal()" class="absolute inset-0 bg-black bg-opacity-75"></div>
|
|
|
|
<!-- Close button (top right, above backdrop) -->
|
|
<button
|
|
@click="closeKritaModal()"
|
|
class="absolute top-4 right-4 z-[51] bg-gray-700 hover:bg-gray-600 rounded-full w-10 h-10 flex items-center justify-center text-xl min-h-[2.5rem] touch-manipulation lg:top-4"
|
|
>✕</button>
|
|
|
|
<!-- Modal content - above backdrop, full screen on mobile, centered on desktop -->
|
|
<div class="absolute inset-0 pt-12 lg:pt-0 overflow-auto p-4 z-[51]">
|
|
<div class="max-w-lg mx-auto h-full flex flex-col lg:bg-gray-800 lg:rounded-lg lg:p-6 lg:border lg:border-gray-600 lg:my-auto">
|
|
<h2 class="text-xl font-bold mb-4">Open in Krita (Desktop Only)</h2>
|
|
|
|
<p class="text-yellow-400 text-sm mb-4">⚠️ This feature only works on desktop. Mobile browsers cannot export to local filesystem.</p>
|
|
|
|
<p class="text-gray-300 mb-4">File exported to:</p>
|
|
|
|
<div class="bg-gray-700 rounded p-3 mb-4 font-mono text-sm text-green-400 break-all" x-text="kritaTempPath"></div>
|
|
|
|
<p class="text-gray-400 text-sm mb-4">Copy the path and open it in Krita manually. Browsers cannot open local files directly.</p>
|
|
|
|
<div class="flex gap-4 justify-end lg:flex lg:justify-end flex-col">
|
|
<button
|
|
@click="copyKritaPath()"
|
|
:class="kritaPathCopied ? 'bg-green-600' : 'bg-blue-600 hover:bg-blue-700'"
|
|
class="w-full px-4 py-2 rounded transition min-h-[2.5rem] touch-manipulation"
|
|
x-text="kritaPathCopied ? 'Copied!' : 'Copy Path'"
|
|
></button>
|
|
<button @click="closeKritaModal()" class="w-full bg-gray-600 hover:bg-gray-500 px-4 py-2 rounded transition min-h-[2.5rem] touch-manipulation">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |