AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bugfixing comment height when click on edit

Browse Source
This commit is contained in:
MuslemRahimi 2024-06-26 16:50:11 +02:00
parent acea773614
commit 3a1f477e09
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/lib/components/TextEditor.svelte
View File

@ -180,9 +180,8 @@ const updateComment = async (event) => {
function handleInput(event) { function handleInput(event) {
inputValue = event.target.value; inputValue = event.target.value;
/*
const textarea = event.target; const textarea = event.target;
if($screenWidth >= 640) if($screenWidth >= 640)
{ {
textarea.style.height = 'auto'; textarea.style.height = 'auto';
@ -192,6 +191,8 @@ function handleInput(event) {
textarea.style.height = 'auto'; textarea.style.height = 'auto';
textarea.style.height = Math.min(textarea.scrollHeight, 10000) + 'px'; textarea.style.height = Math.min(textarea.scrollHeight, 10000) + 'px';
} }
*/
} }
function handleCancel() { function handleCancel() {
@ -212,6 +213,14 @@ function handleCancel() {
} }
// Function to adjust textarea height
function adjustHeight() {
if (ref) {
ref.style.height = 'auto';
ref.style.height = Math.min(ref.scrollHeight, 10000) + 'px';
}
}
function handleImageInput(event) { function handleImageInput(event) {
imageInput = event.target.files; imageInput = event.target.files;
//console.log(imageInput) //console.log(imageInput)
@ -222,6 +231,7 @@ function handleImageInput(event) {
$: { $: {
if (expandField === true && typeof window !== 'undefined') { if (expandField === true && typeof window !== 'undefined') {
ref?.focus() ref?.focus()
adjustHeight();
} }
} }
@ -232,7 +242,7 @@ function handleImageInput(event) {
<div class="p-2 w-full max-w-xl mr-auto overflow-y-scroll {commentId?.length !== 0 ? '-ml-2' : ''}"> <div class="p-2 w-full max-w-xl mr-auto overflow-y-scroll {commentId?.length !== 0 ? '-ml-2' : ''}">
<textarea <textarea
on:click={() => expandField = true} on:click={() => expandField = true}
class="rounded-lg text-sm {expandField ? 'min-h-28 h-full border-[#1C4090]' : 'h-12 border-gray-500'} overflow-hidden sm:hover:border-[#1C4090] sm:hover:ring-1 transition sm:ease-out placeholder-gray-500 w-full bg-[#202020] text-white border border-1 ring-2 sm:ring-0 ring-[#1C4090]" class="rounded-lg text-sm {expandField ? 'min-h-24 h-auto border-[#1C4090]' : 'h-12 border-gray-500'} overflow-hidden sm:hover:border-[#1C4090] sm:hover:ring-1 transition sm:ease-out placeholder-gray-500 w-full bg-[#202020] text-white border border-1 ring-2 sm:ring-0 ring-[#1C4090]"
placeholder={placeholder} placeholder={placeholder}
value={inputValue} value={inputValue}
bind:this={ref} bind:this={ref}