chore(client): tweak ui 🎨
This commit is contained in:
parent
bd3c6f4157
commit
744db4b5ed
@ -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 {
|
||||||
|
Loading…
Reference in New Issue
Block a user