diff --git a/web/i18n/en/save.json b/web/i18n/en/save.json index e6edc0de..361361f8 100644 --- a/web/i18n/en/save.json +++ b/web/i18n/en/save.json @@ -21,5 +21,7 @@ "tutorial.shortcut.photos": "to photos", "tutorial.shortcut.files": "to files", - "label.community_instance": "community instance" + "label.community_instance": "community instance", + + "tooltip.captcha": "cloudflare turnstile is checking if you're not a bot, please wait!" } diff --git a/web/src/components/save/CaptchaTooltip.svelte b/web/src/components/save/CaptchaTooltip.svelte new file mode 100644 index 00000000..ec05a9af --- /dev/null +++ b/web/src/components/save/CaptchaTooltip.svelte @@ -0,0 +1,77 @@ + + + + + diff --git a/web/src/components/save/Omnibox.svelte b/web/src/components/save/Omnibox.svelte index 1b2fe2ed..36138521 100644 --- a/web/src/components/save/Omnibox.svelte +++ b/web/src/components/save/Omnibox.svelte @@ -25,6 +25,7 @@ import Switcher from "$components/buttons/Switcher.svelte"; import OmniboxIcon from "$components/save/OmniboxIcon.svelte"; import ActionButton from "$components/buttons/ActionButton.svelte"; + import CaptchaTooltip from "$components/save/CaptchaTooltip.svelte"; import SettingsButton from "$components/buttons/SettingsButton.svelte"; import IconMute from "$components/icons/Mute.svelte"; @@ -44,6 +45,8 @@ let isDisabled = $state(false); let isLoading = $state(false); + let isHovered = $state(false); + let isBotCheckOngoing = $derived($turnstileEnabled && !$turnstileSolved); let linkPrefill = $derived( @@ -148,6 +151,12 @@ {/if}
+ {#if $turnstileEnabled} + + {/if} +
+ (isFocused = true)} onfocus={() => (isFocused = true)} onblur={() => (isFocused = false)} + onmouseover={() => (isHovered = true)} + onmouseleave={() => (isHovered = false)} spellcheck="false" autocomplete="off" autocapitalize="off" @@ -225,6 +237,7 @@ max-width: 640px; width: 100%; gap: 6px; + position: relative; } #input-container {