style: refine notification dialog layout and update button classes

This commit is contained in:
puriphatt 2025-03-06 11:14:09 +07:00
parent 65bf510386
commit d3c3712466
2 changed files with 9 additions and 5 deletions

View file

@ -115,7 +115,7 @@ onMounted(async () => {
flat flat
dense dense
size="xs" size="xs"
class="app-text-muted-2 q-ml-sm q-mt-xs" class="app-text-muted-2 q-ml-sm"
@click="async () => await deleteNoti()" @click="async () => await deleteNoti()"
> >
<q-tooltip>{{ $t('general.delete') }}</q-tooltip> <q-tooltip>{{ $t('general.delete') }}</q-tooltip>
@ -127,7 +127,7 @@ onMounted(async () => {
flat flat
dense dense
size="xs" size="xs"
class="app-text-muted-2 q-mx-sm q-mt-xs" class="app-text-muted-2 q-mx-sm"
@click="async () => await markAsRead()" @click="async () => await markAsRead()"
> >
<q-tooltip>{{ $t('noti.markAsRead') }}</q-tooltip> <q-tooltip>{{ $t('noti.markAsRead') }}</q-tooltip>

View file

@ -35,8 +35,12 @@ async function fetchNoti() {
</template> </template>
<section v-if="noti" class="q-pa-md col full-width"> <section v-if="noti" class="q-pa-md col full-width">
<div class="surface-1 rounded bordered q-pa-md full-height full-width"> <article
{{ noti.title }} class="surface-1 rounded bordered q-pa-md full-height full-width"
>
<div class="text-bold">
{{ noti.title }}
</div>
<div class="text-caption app-text-muted"> <div class="text-caption app-text-muted">
{{ {{
dateFormatJS({ dateFormatJS({
@ -50,7 +54,7 @@ async function fetchNoti() {
<div class="text-caption"> <div class="text-caption">
{{ noti.detail }} {{ noti.detail }}
</div> </div>
</div> </article>
</section> </section>
<template #footer> <template #footer>