diff --git a/src/client/components/error.vue b/src/client/components/error.vue index b6e4b1951..805fbdd2b 100644 --- a/src/client/components/error.vue +++ b/src/client/components/error.vue @@ -1,5 +1,6 @@ <template> <div class="mjndxjcg _panel"> + <img src="https://xn--931a.moe/assets/error.jpg" alt=""/> <p><fa :icon="faExclamationTriangle"/> {{ $t('error') }}</p> <mk-button @click="() => $emit('retry')" class="button">{{ $t('retry') }}</mk-button> </div> @@ -38,5 +39,12 @@ export default Vue.extend({ > .button { margin: 0 auto; } + + > img { + vertical-align: bottom; + height: 150px; + margin-bottom: 16px; + border-radius: 16px; + } } </style> diff --git a/src/client/components/notes.vue b/src/client/components/notes.vue index 20076eff0..476b479fc 100644 --- a/src/client/components/notes.vue +++ b/src/client/components/notes.vue @@ -1,6 +1,9 @@ <template> <div class="mk-notes" v-size="[{ max: 500 }]"> - <div class="empty" v-if="empty">{{ $t('noNotes') }}</div> + <div class="empty _panel" v-if="empty"> + <img src="https://xn--931a.moe/assets/info.jpg" alt=""/> + <div>{{ $t('noNotes') }}</div> + </div> <mk-error v-if="error" @retry="init()"/> @@ -24,8 +27,6 @@ import i18n from '../i18n'; import paging from '../scripts/paging'; import XNote from './note.vue'; import XList from './date-separated-list.vue'; -import getUserName from '../../misc/get-user-name'; -import getNoteSummary from '../../misc/get-note-summary'; export default Vue.extend({ i18n, @@ -85,14 +86,15 @@ export default Vue.extend({ <style lang="scss" scoped> .mk-notes { > .empty { - margin: 0 auto; padding: 32px; text-align: center; - background: rgba(0, 0, 0, 0.3); - color: #fff; - -webkit-backdrop-filter: blur(16px); - backdrop-filter: blur(16px); - border-radius: 6px; + + > img { + vertical-align: bottom; + height: 128px; + margin-bottom: 16px; + border-radius: 16px; + } } > .notes { diff --git a/src/client/pages/not-found.vue b/src/client/pages/not-found.vue index 05bd34772..b477b70a1 100644 --- a/src/client/pages/not-found.vue +++ b/src/client/pages/not-found.vue @@ -1,11 +1,13 @@ <template> -<div class=""> +<div class="ipledcug"> <portal to="icon"><fa :icon="faExclamationTriangle"/></portal> <portal to="title">{{ $t('notFound') }}</portal> <section class="_card"> - <div class="_title"><fa :icon="faExclamationTriangle"/> {{ $t('notFound') }}</div> - <div class="_content">{{ $t('notFoundDescription') }}</div> + <div class="_content"> + <img src="https://xn--931a.moe/assets/not-found.jpg" alt=""/> + <div>{{ $t('notFoundDescription') }}</div> + </div> </section> </div> </template> @@ -33,4 +35,18 @@ export default Vue.extend({ </script> <style lang="scss" scoped> +.ipledcug { + > ._card { + > ._content { + text-align: center; + + > img { + vertical-align: bottom; + height: 150px; + margin-bottom: 16px; + border-radius: 16px; + } + } + } +} </style>