diff --git a/src/routes/chat/+page.svelte b/src/routes/chat/+page.svelte index 07f7642..fbf5f0f 100644 --- a/src/routes/chat/+page.svelte +++ b/src/routes/chat/+page.svelte @@ -32,6 +32,9 @@ let scrollableDiv; let answerMessageTextShow = false let answerMessageImgShow = false + let imageFile = undefined + let imageShow = false; + $: console.log(imageFile, "картинка") let answerMessage = "" let answerMessageImg = "" @@ -134,6 +137,7 @@ function adjustTextareaHeight() { const textarea = document.getElementById("msg"); + //console.log(textarea.scrollHeight) if (textarea) { textarea.style.height = '1em'; //?? textarea.style.height = (textarea.scrollHeight > maxRows * 18) ? `${maxRows * 18}px` : `${textarea.scrollHeight}px`; // Limit height based on maxRows and font size @@ -223,12 +227,8 @@ function helperDivShow(event, id, text, img, username) { "user_id": userId, "id": pickedId })); - - } - - let imageFile = undefined - let imageShow = false; - $: console.log(imageFile, "картинка") + pinnedMsg = pinnedMsg.filter(pinnedMsg => pinnedMsg.id !== pickedId) + } function triggerFileInput() { imageFile.click(); @@ -409,13 +409,15 @@ function helperDivShow(event, id, text, img, username) { on:input={onInput} name="msg" id="msg"> - document.getElementById('fileInput').click()}> +
+ document.getElementById('fileInput').click()}> +
- + {/if} @@ -551,20 +553,24 @@ function helperDivShow(event, id, text, img, username) { .pinnedMsg{ display: flex; width: 90%; + margin-bottom: 10px; } .pinDiv{ display: flex; - width: 100%; + //background-color: red; } .pinnedMain{ display: flex; flex-direction: column; - margin: 10px; width: 100%; height: 100%; - margin-bottom: 10px; + margin: 0 10px; + overflow: auto; + scroll-behavior: smooth; + + //background-color: red; } .nameAnswerDiv > p,img{ @@ -689,18 +695,23 @@ function helperDivShow(event, id, text, img, username) { } .logoForImage{ - display: flex; - justify-self: center; - align-self: flex-start; - width: 2rem; + width: 2rem; height: 2rem; - padding: 5px; +} + +.logoForImageDiv{ + display: flex; + justify-content: center; + align-items: flex-end; + margin-top: -7px; + width: 50px; + height: 100%; //background-color: red; } .messageImage{ padding-bottom: 0px; - border-radius: 0 0 10px 10px; + border-radius: 10px; max-width: 500px; max-height: 500px; } @@ -738,9 +749,7 @@ padding-bottom: 10px; display: flex; flex-direction: column; height: 100%; - margin-bottom: 10px; overflow: auto; - //background-color: red; scroll-behavior: smooth; } @@ -752,12 +761,14 @@ padding-bottom: 10px; background: linear-gradient(#101010, #101010) padding-box, var(--gradient) border-box; + margin-top: 5px; //padding: 5px; //background-color: red; } #msg{ width: 100%; + height: 34px; background-color: transparent; border: 0; line-height: 1em; @@ -769,8 +780,9 @@ padding-bottom: 10px; .chatDiv{ //background-color: red; - width: 98%; - height: 98%; + width: 100%; + height: 99%; + margin: 0 10px 5px 10px; display: flex; flex-direction: column; align-self: center;