go/mailpit
1
0
Fork 0
mirror of https://github.com/axllent/mailpit.git synced 2025-04-25 12:25:04 +02:00
Code Issues Releases Activity

UI: Better support for mobile screen sizes

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
server/ui-src/assets/styles.scss
View File

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

6
server/ui-src/components/message/Message.vue
View File

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

10
server/ui-src/views/MessageView.vue
View File

@ -195,17 +195,17 @@ export default {
</RouterLink> </RouterLink>
</div> </div>
<div class="col col-md-4k col-lg-5 col-xl-6"> <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> <i class="bi bi-arrow-return-left"></i>
</button> </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> <i class="bi bi-eye-slash"></i> <span class="d-none d-md-inline">Mark unread</span>
</button> </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"> 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> <i class="bi bi-send"></i> <span class="d-none d-md-inline">Release</span>
</button> </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> <i class="bi bi-trash-fill"></i> <span class="d-none d-md-inline">Delete</span>
</button> </button>
</div> </div>
@ -267,7 +267,7 @@ export default {
</ul> </ul>
</div> </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"> :class="prevLink ? '' : 'disabled'" title="View previous message">
<i class="bi bi-caret-left-fill"></i> <i class="bi bi-caret-left-fill"></i>
</RouterLink> </RouterLink>