fixed email composer bottom pannel breaking issue if email content gr…#1351
fixed email composer bottom pannel breaking issue if email content gr…#1351maniksharma424 wants to merge 1 commit intoMail-0:stagingfrom
Conversation
…ows past 500px height
WalkthroughThe maximum height constraint ( Changes
Sequence Diagram(s)No sequence diagram generated, as the change is purely a CSS/layout adjustment. Possibly related PRs
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
| )} | ||
| > | ||
| <div className="no-scrollbar dark:bg-panelDark max-h-[500px] grow overflow-y-auto"> | ||
| <div className="no-scrollbar dark:bg-panelDark grow overflow-y-auto"> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Make outer container a flex column for proper grow behavior
The inner scrollable div uses the grow class but its parent isn’t a flex container, so grow has no effect. Convert the outer wrapper to a flex column to ensure the message area expands correctly and the bottom panel stays pinned.
Apply this diff:
-<div
- className={cn(
- 'no-scrollbar max-h-[500px] w-full max-w-[750px] overflow-hidden rounded-2xl bg-[#FAFAFA] p-0 py-0 shadow-sm dark:bg-[#202020]',
- className,
- )}
->
+<div
+ className={cn(
+ 'flex flex-col no-scrollbar max-h-[500px] w-full max-w-[750px] overflow-hidden rounded-2xl bg-[#FAFAFA] p-0 py-0 shadow-sm dark:bg-[#202020]',
+ className,
+ )}
+>Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In apps/mail/components/create/email-composer.tsx at line 462, the outer
container div needs to be changed to a flex container with column direction to
enable the inner div's grow class to work properly. Update the className of the
outer div to include "flex flex-col" so that the inner scrollable div expands
correctly and the bottom panel remains pinned.
There was a problem hiding this comment.
Seems like the humans are having a chat. I'll hop back into my burrow for now. If you need me again, just tag @coderabbitai in a new comment, and I'll come hopping out!
|
Closed in another PR |
While composing the email both parent container and the child had max-h-[500px] which resulted in breaking the bottom bar when email content grows over 500px .
There's no need to have max height property on the children (email content container) as the body container is already taking up the remaining height
PR:
Summary by CodeRabbit