diff --git a/frontend/src/lib/components/sessions/writebox.svelte b/frontend/src/lib/components/sessions/writebox.svelte index 73e1ecacf14ae033a0fe041fa8fe72f9a0479d32..7f30aa20657a1e07d1ca9e989a750b3fcc377bb1 100644 --- a/frontend/src/lib/components/sessions/writebox.svelte +++ b/frontend/src/lib/components/sessions/writebox.svelte @@ -56,7 +56,7 @@ <div class="w-full border-t-2"> {#if showSpecials} - <ul class="flex justify-around divide-x-2 border-b-2 py-1"> + <ul class="flex justify-around divide-x-2 border-b-2 py-1 flex-wrap md:flex-nowrap"> {#each config.SPECIAL_CHARS as char (char)} <button class="border-none" @@ -106,9 +106,15 @@ data-tooltip="tooltip-emoji" role="tooltip" class:hidden={!showPicker} - class="absolute z-10 tooltip bottom-0 left-0" + class="absolute z-10 tooltip bottom-16 right-0 lg:left-0 lg:right-auto" > - <emoji-picker class="light" on:emoji-click={(event) => (message += event.detail.unicode)}> + <emoji-picker + class="light" + on:emoji-click={(event) => { + message += event.detail.unicode; + textearea.focus(); + }} + > </emoji-picker> </div> </div> diff --git a/frontend/src/routes/session/+page.svelte b/frontend/src/routes/session/+page.svelte index c890071b2b28a1152f7dda3f00b0e711ea43ffd2..dd110f559dc1bfb59d694eda0d7c7e6c03a68601 100644 --- a/frontend/src/routes/session/+page.svelte +++ b/frontend/src/routes/session/+page.svelte @@ -5,7 +5,6 @@ import Session from '$lib/types/session'; import { getBaseURL } from '$lib/utils/login'; import { onMount } from 'svelte'; - import { t } from '$lib/services/i18n'; import { user } from '$lib/types/user'; import { AcademicCap, Icon, Sparkles, User } from 'svelte-hero-icons'; export let data; @@ -30,10 +29,8 @@ </script> {#if session} - <div class="h-full grid lg:grid-cols-4"> + <div class="h-full grid lg:grid-cols-7"> <div class="justify-evenly h-full p-2"> - <!-- <p>{$t('session.title')} {session.otherUsersList()}</p> --> - <!-- <p>{$t('session.participants')}:</p> --> <ul class="ml-2"> {#each session.users as sessionUser (sessionUser.id)} <li @@ -57,7 +54,7 @@ {/each} </ul> </div> - <div class="flex flex-row flex-grow col-span-2"> + <div class="flex flex-row flex-grow col-span-5"> <Chatbox {session} token={data.token} /> </div> <div class=""></div>