client: restyle app token view

This commit is contained in:
Johann150 2022-12-18 16:22:25 +01:00
parent 3bf7deb233
commit 639fa74d43
Signed by untrusted user: Johann150
GPG key ID: 9EE6577A2A06F8F1
2 changed files with 30 additions and 24 deletions

View file

@ -11,19 +11,25 @@
<div v-for="token in items" :key="token.id" class="_panel bfomjevm"> <div v-for="token in items" :key="token.id" class="_panel bfomjevm">
<img v-if="token.iconUrl" class="icon" :src="token.iconUrl" alt=""/> <img v-if="token.iconUrl" class="icon" :src="token.iconUrl" alt=""/>
<div class="body"> <div class="body">
<div class="name">{{ token.name }}</div>
<div class="description">{{ token.description }}</div>
<div class="_keyValue">
<div>{{ i18n.ts.installedDate }}:</div>
<div><MkTime :time="token.createdAt"/></div>
</div>
<div class="_keyValue">
<div>{{ i18n.ts.lastUsedDate }}:</div>
<div><MkTime :time="token.lastUsedAt"/></div>
</div>
<div class="actions">
<button class="_button" @click="revoke(token)"><i class="fas fa-trash-alt"></i></button> <button class="_button" @click="revoke(token)"><i class="fas fa-trash-alt"></i></button>
</div> <table>
<tr>
<th>{{ i18n.ts.name }}:</th>
<td>{{ token.name }}</td>
</tr>
<tr>
<th>{{ i18n.ts.description }}:</th>
<td>{{ token.description }}</td>
</tr>
<tr>
<th>{{ i18n.ts.installedDate }}:</th>
<td><MkTime :time="token.createdAt"/></td>
</tr>
<tr>
<th>{{ i18n.ts.lastUsedDate }}:</th>
<td><MkTime :time="token.lastUsedAt"/></td>
</tr>
</table>
<details> <details>
<summary>{{ i18n.ts.details }}</summary> <summary>{{ i18n.ts.details }}</summary>
<ul> <ul>
@ -82,11 +88,19 @@ definePageMetadata({
} }
> .body { > .body {
width: calc(100% - 62px); width: 100%;
position: relative; position: relative;
> .name { button {
font-weight: bold; position: absolute;
top: 0;
right: 0;
}
th {
text-align: right;
}
td {
text-align: left;
} }
} }
} }

View file

@ -390,14 +390,6 @@ hr {
} }
} }
._keyValue {
display: flex;
> * {
flex: 1;
}
}
._link { ._link {
color: var(--link); color: var(--link);
} }