Add a feature to be able to select a custom background image for surf

[ForLoopCodes]

• Added input field and buttons in Settings.svelte
• Wired up the logic to save the URL to user settings and trigger updates
• Fixed some timing issues for smooth, immediate feedback

sometimes, i write bad code
please let me know if the code is not production ready or needs any changes

[Omarplayz233]

i mean they can bring the surflets and the desktop surf back (like that thing with the wallpaper on it) and improve the vertical tab a bit
and revamp the new tab page to be custom (either the old style or the new style aka the surflets and desktop or the search and docs)
and also jst so it can be customizable and not THAT boring

[ForLoopCodes]

i think i should add some features like preload link pages

this will be a great revolution as no browser does this and this can make things fast AF

[GeoffBao]

May I ask if directly uploading custom local images is allowed?

[GeoffBao]

so beautiful ...

[ForLoopCodes]

yo, i dont think custom images are allowed due to the cors restrictions

however it might work with some changes that move the image to appdata (windows) or the config folders where surf's data is stored

btw, can i get the link to that background its lovely

[GeoffBao]

GeoffBao@7da66f8#diff-214729737fb237e4f6cfa94ec26a2733e1fe390ce759404247178a5a8015825e

I made some modifications for reference, thank you.

[GeoffBao]

yo, i dont think custom images are allowed due to the cors restrictions

however it might work with some changes that move the image to appdata (windows) or the config folders where surf's data is stored

btw, can i get the link to that background its lovely

https://blog-frontend.envato.com/cdn-cgi/image/width=2400,quality=75,format=auto/uploads/sites/2/2025/02/Ghibli-aesthetic.webp

[ForLoopCodes]

GeoffBao@7da66f8#diff-214729737fb237e4f6cfa94ec26a2733e1fe390ce759404247178a5a8015825e

I made some modifications for reference, thank you.

hell yeah

[Omarplayz233]

yo, i dont think custom images are allowed due to the cors restrictions

however it might work with some changes that move the image to appdata (windows) or the config folders where surf's data is stored

btw, can i get the link to that background its lovely

@ForLoopCodes no? i mean u can still upload it locally, NOT pull it online

[ForLoopCodes]

wym

[Omarplayz233]

wym

@ForLoopCodes i mean like i can drag and drop to the desktop (old method) and right click it and set it as a wallpaper for my rice :3

[ForLoopCodes]

good idea :o

[aavshr]

thanks a lot for the PR @ForLoopCodes , the vibes are great with the custom background!

Loading arbitrary image urls like this is susceptible to css injection attacks (even though the user puts the url, they might not always be aware) without sanitization, and also could be a privacy concern.

I think the best implementation of a v0 of this feature would be to allow setting/removing an image you already have in Surf as the background through the right-click context menu! And from the Settings, you can just remove an already set background.

After this, we could additionally allow you to choose a local image from the Settings itself.

You also committed the bun.lock file which we should not be there. Also the yarn.lock file has a lot of changes, not sure why.

There seem to be other changes unrelated to the feature, (tsconfig, package.json etc) which might make sense but can you please open them in a different PR?

[ForLoopCodes]

surely, would love to do that once my exams are finished