d
e516d007c8
## messenger-style email with full backend integration Implements M8SH Mail — a complete messenger UI for email built on top of the Gitea fork's integrated email server. Features: - All 17 endpoints (`/api/v1/mail/*`) — thread list with cursor pagination, message send/forward/delete, pin/unread, block list, group rename/members, attachment serving with Range support - RFC 5322 parsing with multipart support, HTML detection/correction, reply quote stripping (Gmail/Outlook patterns), plain-text preview extraction via `golang.org/x/net/html` - M8SH HTTP fast-path for same-domain, SMTP MX fallback for external recipients, DKIM signing, `From:` display name from Gitea Full Name - Internal-domain users (`@m8sh.su`) auto-activated and get Chats tab; external users get activation email via integrated mail server (MX → SMTP) - Vue 3 SPA with ThreadList (infinite scroll, context menu, delete confirmation), ChatPane (message bubbles, HTML cards, audio player, in-thread search, scroll-up pagination), avatar resolution pipeline (Gitea → Gravatar → favicon.ico → favicon.png → default) - Plain text only — no JSON/ForwardedContent trees, fully RFC 5322 compatible - Music player, video player, image viewer are integrated into chat UI and they make content easily downloadable Reviewed-on: #12
31 lines
1.0 KiB
CSS
31 lines
1.0 KiB
CSS
/* M8SH Messenger — layout: make #messenger-app fill viewport below navbar.
|
|
The actual component styles are scoped in MessengerApp.vue.
|
|
This CSS ensures the height chain works: body > .full.height > .page-content > #messenger-app */
|
|
|
|
/* .full.height is a flex item in body (flex column). Make it also a flex container
|
|
so its children (navbar + page-content) can fill height. */
|
|
.full.height:has(#messenger-app) {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-bottom: 0 !important; /* cancel the 64px bottom padding */
|
|
}
|
|
|
|
/* .page-content contains #messenger-app. Make it fill remaining height. */
|
|
.page-content:has(#messenger-app) {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-top: 0 !important; /* cancel the 16px page-spacing margin-top */
|
|
padding: 0 !important;
|
|
min-height: 0; /* allow inner scroll areas to work */
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* #messenger-app is the Vue mount point — fill its parent */
|
|
#messenger-app {
|
|
flex: 1;
|
|
display: flex;
|
|
min-height: 0;
|
|
overflow: hidden;
|
|
}
|