From 9fcf5d41922f40a56f7da2174d0446580d249490 Mon Sep 17 00:00:00 2001
From: Claire <claire.github-309c@sitedethib.com>
Date: Mon, 4 Dec 2023 13:30:27 +0100
Subject: [PATCH] [Glitch] Fix emoji picker button scrolling with textarea
 content in single-column view (#2501)

Port bbea0529354c392f70843860956421e9bc25f2c6 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 .../glitch/features/compose/components/compose_form.jsx         | 2 +-
 app/javascript/flavours/glitch/styles/components/columns.scss   | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
index 47cf124932..c4cba922f5 100644
--- a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
@@ -362,13 +362,13 @@ class ComposeForm extends ImmutablePureComponent {
             autoFocus={!showSearch && !isMobile(window.innerWidth, layout)}
             lang={this.props.lang}
           >
-            <EmojiPickerDropdown onPickEmoji={handleEmojiPick} />
             <TextareaIcons advancedOptions={advancedOptions} />
             <div className='compose-form__modifiers'>
               <UploadFormContainer />
               <PollFormContainer />
             </div>
           </AutosuggestTextarea>
+          <EmojiPickerDropdown onPickEmoji={handleEmojiPick} />
 
           <div className='compose-form__buttons-wrapper'>
             <OptionsContainer
diff --git a/app/javascript/flavours/glitch/styles/components/columns.scss b/app/javascript/flavours/glitch/styles/components/columns.scss
index cffafffa78..940b5cd206 100644
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -1240,6 +1240,7 @@ $ui-header-height: 55px;
   border-radius: 4px;
   transition: box-shadow 300ms linear;
   min-height: 0;
+  position: relative;
 
   &.active {
     transition: none;