grimhilt/mail
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

compact mode for messages

Browse Source
This commit is contained in:
grimhilt
2023-05-06 14:14:32 +02:00
parent 686e6a4911
commit c3374a612e
6 changed files with 64 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
front/src/components/structure/message/Options.vue
View File

@@ -84,14 +84,14 @@ const deleteRemoteOnly = () => {
<SvgLoader
v-if="isSeenFc(props.msg?.flags)"
svg="mail-check-line"
class="option"
classes="selectable"
v-tooltip="'Mark unread'"
:loading="seenLoading"
/>
<SvgLoader
v-if="!isSeenFc(props.msg?.flags)"
svg="mail-unread-line"
class="option"
classes="selectable"
v-tooltip="'Mark as read'"
:loading="seenLoading"
/>
@@ -99,38 +99,33 @@ const deleteRemoteOnly = () => {
<span @click="setFlaggedFlag()">
<SvgLoader
svg="flag-line"
class="option"
:loading="flaggedLoading"
:classes="hasFlag(props.msg?.flags, '\\Flagged') ? 'warn' : ''"
:classes="(hasFlag(props.msg?.flags, '\\Flagged') ? 'warn' : '') + ',selectable'"
v-tooltip="hasFlag(props.msg?.flags, '\\Flagged') ? 'Unflag' : 'Flag'"
/>
</span>
<SvgLoader svg="reply-line" class="option" />
<SvgLoader svg="reply-line" classes="selectable" />
<span @click="deleteRemoteOnly()">
<SvgLoader
svg="delete-bin-4-line"
class="option"
:loading="deletionLoading"
classes="danger"
classes="danger,selectable"
v-tooltip="'Delete from remote'"
/>
</span>
<span @click="deleteEverywhere()">
<SvgLoader
svg="delete-bin-6-line"
class="option"
:loading="deletionLoading"
classes="danger"
classes="danger,selectable"
v-tooltip="'Delete everywhere'"
/>
</span>
<SvgLoader svg="share-forward-line" class="option" />
<SvgLoader svg="reply-all-line" class="option" />
<SvgLoader svg="share-forward-line" classes="selectable" />
<SvgLoader svg="reply-all-line" classes="selectable" />
<div>{{ props.msg?.flags }}</div>
</div>
<div>reply</div>
<div>transfer</div>
<div>see source</div>
<div>{{ props.msg?.flags }}</div>
<!-- <div>see source</div> -->
</div>
</template>
@@ -143,6 +138,7 @@ const deleteRemoteOnly = () => {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.button {
@@ -156,14 +152,4 @@ const deleteRemoteOnly = () => {
background-color: var(--selected);
}
}
.option {
border-radius: 6px;
cursor: pointer;
&:hover,
&.is-active {
background-color: var(--selected);
}
}
</style>