lee/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools synced 2025-12-12 14:15:40 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

refactor(ui): replaced naive ui cards with custom ones

Browse Source
This commit is contained in:
Corentin Thomasset
2023-04-20 20:49:28 +02:00
committed by Corentin THOMASSET
parent bb32513bd3
commit f080933d2a
40 changed files with 351 additions and 303 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/tools/device-information/device-information.vue
View File

@@ -1,22 +1,20 @@
<template>
<n-card v-for="{ name, information } in sections" :key="name" :title="name">
<c-card v-for="{ name, information } in sections" :key="name" :title="name">
<n-grid cols="1 400:2" x-gap="12" y-gap="12">
<n-gi v-for="{ label, value: { value } } in information" :key="label" class="information">
<n-card :bordered="false" embedded>
<div class="label">
{{ label }}
</div>
<div class="label">
{{ label }}
</div>
<div class="value">
<n-ellipsis v-if="value">
{{ value }}
</n-ellipsis>
<div v-else class="undefined-value">unknown</div>
</div>
</n-card>
<div class="value">
<n-ellipsis v-if="value">
{{ value }}
</n-ellipsis>
<div v-else class="undefined-value">unknown</div>
</div>
</n-gi>
</n-grid>
</n-card>
</c-card>
</template>
<script setup lang="ts">
@@ -81,6 +79,10 @@ const sections = [
<style lang="less" scoped>
.information {
padding: 14px 16px;
border-radius: 4px;
background-color: #aaaaaa11;
.label {
font-size: 14px;
opacity: 0.8;