Updated to add an example tab to showcase the size

[juneate]

Added an "Example" tab for demonstration. The font-size is set from the string value passed as a prop in index.svelte, computed using clampValue. May want to recompute here for precision.

[vercel[bot]]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/codeadrian/modern-fluid-typography-editor/5f3QWZdRYqkSbaE73KNfbsshZDBQ
✅ Preview: https://modern-fluid-typography-editor-git-fork-junea-3b9b1a-codeadrian.vercel.app

[codeAdrian]

Hi @juneate Thank you very much for your contribution. I like the idea of a preview screen. I'll review the PR as soon as possible and report back.

I've changed the target branch to develop, so we can use master only for hotfixes and releases in a regular interval.

Thanks once again!

[codeAdrian]

Hi @juneate, I think this is a good starting point for the preview feature. It would be awesome if the preview could also take Root Font Size value into account.

Additionally, I would like it to have more functionality.

First off, It would be more beneficial for both desktop and mobile users to have a range input and a regular text input so they can set the screen size manually without the need to resize the window or the container.

Second, it would be even more beneficial to explore the accessibility implications of the fluid font - how the user zoom affects the perceived font size.

Let me know what you think.

Thanks, Adrian