openpencil/src/components/SafariBanner.vue
Danila Poyarkov c8af1c35e7 Improve Save for browsers without File System Access API
- Save As prompts for filename via prompt() before downloading
- Save reuses the filename from last Save As (no repeated prompts)
- Banner in Safari/Firefox explaining the limitation with Chrome link
- Banner is dismissible
2026-03-01 15:41:27 +03:00

26 lines
851 B
Vue

<script setup lang="ts">
import { ref } from 'vue'
import { IS_TAURI } from '@/constants'
const dismissed = ref(false)
const show = !IS_TAURI && typeof window !== 'undefined' && !window.showSaveFilePicker
</script>
<template>
<div
v-if="show && !dismissed"
class="flex items-center gap-2 border-b border-amber-500/30 bg-amber-500/10 px-3 py-1.5 text-xs text-amber-200"
>
<span class="flex-1">
Your browser doesn't support the local file API. Files will be downloaded instead of saved in place.
<a href="https://www.google.com/chrome/" target="_blank" class="underline">Use Chrome</a> or Edge for full support.
</span>
<button
class="shrink-0 rounded px-1.5 py-0.5 text-amber-300 transition-colors hover:bg-amber-500/20"
@click="dismissed = true"
>
Dismiss
</button>
</div>
</template>