1
0
mirror of https://github.com/axllent/mailpit.git synced 2025-04-13 11:50:32 +02:00

UI: Better support for mobile screen sizes

This commit is contained in:
Ralph Slooten 2023-09-23 09:31:02 +12:00
parent b282e6663b
commit 063eab2c6a
3 changed files with 14 additions and 8 deletions

View File

@ -228,6 +228,12 @@
}
}
.messageHeaders {
th {
vertical-align: top;
}
}
.list-group-item.message:first-child {
border-top: 0;
}

View File

@ -245,7 +245,7 @@ export default {
<td class="privacy">
<span v-if="message.To && message.To.length" v-for="(t, i) in message.To">
<template v-if="i > 0">, </template>
<span class="text-nowrap">{{ t.Name + " &lt;" + t.Address + "&gt;" }}</span>
<span>{{ t.Name + " &lt;" + t.Address + "&gt;" }}</span>
</span>
<span v-else class="text-body-secondary">[Undisclosed recipients]</span>
</td>
@ -269,7 +269,7 @@ export default {
</tr>
<tr v-if="message.ReplyTo && message.ReplyTo.length" class="small">
<th class="text-nowrap">Reply-To</th>
<td class="privacy text-body-secondary">
<td class="privacy text-body-secondary text-break">
<span v-for="(t, i) in message.ReplyTo">
<template v-if="i > 0">,</template>
{{ t.Name + " &lt;" + t.Address + "&gt;" }} </span>
@ -277,7 +277,7 @@ export default {
</tr>
<tr v-if="message.ReturnPath && message.ReturnPath != message.From.Address" class="small">
<th class="text-nowrap">Return-Path</th>
<td class="privacy text-body-secondary">&lt;{{ message.ReturnPath }}&gt;</td>
<td class="privacy text-body-secondary text-break">&lt;{{ message.ReturnPath }}&gt;</td>
</tr>
<tr>
<th class="small">Subject</th>

View File

@ -195,17 +195,17 @@ export default {
</RouterLink>
</div>
<div class="col col-md-4k col-lg-5 col-xl-6">
<button @click="goBack()" class="btn btn-outline-light me-4 d-md-none" title="Return to messages">
<button @click="goBack()" class="btn btn-outline-light me-3 me-sm-4 d-md-none" title="Return to messages">
<i class="bi bi-arrow-return-left"></i>
</button>
<button class="btn btn-outline-light me-2" title="Mark unread" v-on:click="markUnread">
<button class="btn btn-outline-light me-1 me-sm-2" title="Mark unread" v-on:click="markUnread">
<i class="bi bi-eye-slash"></i> <span class="d-none d-md-inline">Mark unread</span>
</button>
<button class="btn btn-outline-light me-2" title="Release message"
<button class="btn btn-outline-light me-1 me-sm-2" title="Release message"
v-if="mailbox.uiConfig.MessageRelay && mailbox.uiConfig.MessageRelay.Enabled" v-on:click="initReleaseModal">
<i class="bi bi-send"></i> <span class="d-none d-md-inline">Release</span>
</button>
<button class="btn btn-outline-light me-2" title="Delete message" v-on:click="deleteMessage">
<button class="btn btn-outline-light me-1 me-sm-2" title="Delete message" v-on:click="deleteMessage">
<i class="bi bi-trash-fill"></i> <span class="d-none d-md-inline">Delete</span>
</button>
</div>
@ -267,7 +267,7 @@ export default {
</ul>
</div>
<RouterLink :to="'/view/' + prevLink" class="btn btn-outline-light ms-2 me-1"
<RouterLink :to="'/view/' + prevLink" class="btn btn-outline-light ms-1 ms-sm-2 me-1"
:class="prevLink ? '' : 'disabled'" title="View previous message">
<i class="bi bi-caret-left-fill"></i>
</RouterLink>