<div class="flex flex-col items-center justify-center gap-y-8 w-fit">
    <h1 class="text-4xl">Invite an alias into this thread</h1>
    <div id="qrCodeCanvas"></div>
    <div class="input rounded-lg flex items-center w-full pr-0 gap-x-2 bg-base-100">
        <input id="invitationLinkInput" type="text" placeholder="Url" class="flex-1 bg-transparent border-none outline-none shadow-none" readonly/>
        <button id="copyBtn" type="button" class="p-2 rounded-lg fill-current text-base-content">
            <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px">
                <path d="M360-240q-33 0-56.5-23.5T280-320v-480q0-33 23.5-56.5T360-880h360q33 0 56.5 23.5T800-800v480q0 33-23.5 56.5T720-240H360Zm0-80h360v-480H360v480ZM200-80q-33 0-56.5-23.5T120-160v-560h80v560h440v80H200Zm160-240v-480 480Z" />
            </svg>
        </button>
    </div>
</div>