fix(inbox/mobile): reply composer no longer hides the "Envoyer" button
On mobile the conversation full-page used a fixed height + overflow:hidden, and the reply q-editor had no max-height — a long body/signature grew it unbounded and pushed the send button past the clipped bottom (user had to shorten the email). - q-editor: max-height=40vh → content scrolls internally, toolbar + send row stay put. - ConversationFullPage @media (max-width:700px): height auto + min-height 100dvh + overflow visible → the page scrolls vertically instead of clipping. Verified at 390x844 with a 27-line signature: editor caps at 40vh (overflow auto), "Envoyer le courriel" stays in view. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
0f65c02d83
commit
e604cbf237
|
|
@ -397,7 +397,7 @@
|
|||
</div>
|
||||
<!-- COURRIEL : éditeur WYSIWYG (type Gmail) → envoie du HTML dans le même fil -->
|
||||
<template v-if="isEmailConv">
|
||||
<q-editor v-model="draftHtml" min-height="6rem" class="email-editor"
|
||||
<q-editor v-model="draftHtml" min-height="6rem" max-height="40vh" class="email-editor"
|
||||
:toolbar="[['bold','italic','underline','strike'],['unordered','ordered'],['link','removeFormat'],['undo','redo']]"
|
||||
placeholder="Rédiger la réponse… (mise en forme, listes, liens — part dans le fil Gmail)" />
|
||||
<div class="row items-center q-mt-xs">
|
||||
|
|
|
|||
|
|
@ -36,4 +36,11 @@ watch(() => route.params.token, t => openByToken(t))
|
|||
.cfp-page { padding: 0; height: calc(100vh - 50px); display: flex; flex-direction: column; overflow: hidden; }
|
||||
.cfp-bar { padding: 4px 8px; border-bottom: 1px solid var(--ops-border, #e2e8f0); background: #fff; flex: 0 0 auto; }
|
||||
.cfp-page :deep(.conv-fullpage) { flex: 1 1 auto; min-height: 0; }
|
||||
|
||||
/* Mobile : ne pas CLIPPER. La hauteur fixe + overflow:hidden cachait le bouton « Envoyer » quand
|
||||
le composeur était long (grosse signature). On laisse la PAGE défiler verticalement ; l'éditeur
|
||||
est borné (max-height 40vh) et défile en interne → le bouton reste toujours atteignable. */
|
||||
@media (max-width: 700px) {
|
||||
.cfp-page { height: auto; min-height: calc(100dvh - 50px); overflow: visible; }
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user