<script>
    import AcortadorForm from "./assets/lib/AcortadorForm.svelte";
    import svelteLogo from "./assets/svelte.svg";
    import viteLogo from "./assets/vite.svg";
</script>

<section id="center">
    <div>
        <h1 class="underline">Acortador de Urls</h1>
    </div>
    <AcortadorForm />
</section>

<div class="ticks"></div>

<section id="next-steps">
    <div id="docs">
        <!-- <svg class="icon" role="presentation" aria-hidden="true">
            <use href="/icons.svg#documentation-icon"></use>
        </svg> -->
        <h2>Hecho por: Fedep</h2>
    </div>
    <div id="social">
        <h2>FOSS</h2>
        <p>El código se puede encontrar en mi Gitea</p>
        <a
            href="https://fedesrv.ddns.net/git/fede/url-short"
            target="_blank"
            rel="noreferrer"
            class="button"
        >
            Ver URL del Gitea
        </a>
        <!-- <ul> -->
        <!-- <li>
                <a
                    href="https://chat.vite.dev/"
                    target="_blank"
                    rel="noreferrer"
                >
                    <svg
                        class="button-icon"
                        role="presentation"
                        aria-hidden="true"
                    >
                        <use href="/icons.svg#discord-icon"></use>
                    </svg>
                    Discord
                </a>
            </li> -->
        <!-- </ul> -->
    </div>
</section>

<div class="ticks"></div>
<section id="spacer"></section>

<style>
    h2,
    h1,
    p,
    a {
        font-family: "Instrument Serif", serif;
        font-weight: 400;
        font-style: normal;
    }
</style>
