chore(client): tweak ui 🎨

This commit is contained in:
syuilo 2022-06-26 16:57:12 +09:00 committed by Johann150
parent 78ddaed2a1
commit 570c08b976
Signed by: Johann150
GPG key ID: 9EE6577A2A06F8F1

View file

@ -5,19 +5,12 @@
<div v-if="tab === 'overview'" class="_formRoot"> <div v-if="tab === 'overview'" class="_formRoot">
<div class="fnfelxur"> <div class="fnfelxur">
<img :src="instance.iconUrl || instance.faviconUrl" alt="" class="icon"/> <img :src="instance.iconUrl || instance.faviconUrl" alt="" class="icon"/>
<span class="name">{{ instance.name || `(${$ts.unknown})` }}</span>
</div> </div>
<MkKeyValue :copy="host" oneline style="margin: 1em 0;"> <MkKeyValue :copy="host" oneline style="margin: 1em 0;">
<template #key>Host</template> <template #key>Host</template>
<template #value><span class="_monospace"><MkLink :url="`https://${host}`">{{ host }}</MkLink></span></template> <template #value><span class="_monospace"><MkLink :url="`https://${host}`">{{ host }}</MkLink></span></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;">
<template #key>Name</template>
<template #value>{{ instance.name || `(${$ts.unknown})` }}</template>
</MkKeyValue>
<MkKeyValue>
<template #key>{{ $ts.description }}</template>
<template #value>{{ instance.description }}</template>
</MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.software }}</template> <template #key>{{ $ts.software }}</template>
<template #value><span class="_monospace">{{ instance.softwareName || `(${$ts.unknown})` }} / {{ instance.softwareVersion || `(${$ts.unknown})` }}</span></template> <template #value><span class="_monospace">{{ instance.softwareName || `(${$ts.unknown})` }} / {{ instance.softwareVersion || `(${$ts.unknown})` }}</span></template>
@ -26,6 +19,10 @@
<template #key>{{ $ts.administrator }}</template> <template #key>{{ $ts.administrator }}</template>
<template #value>{{ instance.maintainerName || `(${$ts.unknown})` }} ({{ instance.maintainerEmail || `(${$ts.unknown})` }})</template> <template #value>{{ instance.maintainerName || `(${$ts.unknown})` }} ({{ instance.maintainerEmail || `(${$ts.unknown})` }})</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue>
<template #key>{{ $ts.description }}</template>
<template #value>{{ instance.description }}</template>
</MkKeyValue>
<FormSection v-if="iAmModerator"> <FormSection v-if="iAmModerator">
<template #label>Moderation</template> <template #label>Moderation</template>
@ -205,12 +202,19 @@ definePageMetadata({
<style lang="scss" scoped> <style lang="scss" scoped>
.fnfelxur { .fnfelxur {
display: flex;
align-items: center;
> .icon { > .icon {
display: block; display: block;
margin: 0; margin: 0 16px 0 0;
height: 64px; height: 64px;
border-radius: 8px; border-radius: 8px;
} }
> .name {
word-break: break-all;
}
} }
.cmhjzshl { .cmhjzshl {