GTsoft/ruoyi-plus-soybean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(projects): perf card style

Browse Source
This commit is contained in:
Soybean 2024-01-25 19:10:00 +08:00
parent d886e50fd3
commit c1afb9dc50
5 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/typings/components.d.ts vendored
View File

@ -10,6 +10,7 @@ declare module 'vue' {
AppProvider: typeof import('./../components/common/app-provider.vue')['default']
BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
CardWrapper: typeof import('./../components/common/card-wrapper.vue')['default']
CountTo: typeof import('./../components/custom/count-to.vue')['default']
DarkModeContainer: typeof import('./../components/common/dark-mode-container.vue')['default']
ExceptionBase: typeof import('./../components/common/exception-base.vue')['default']

2
src/views/_builtin/login/index.vue
View File

@ -59,7 +59,7 @@ const bgColor = computed(() => {
<template>
<div class="relative flex-center wh-full overflow-hidden" :style="{ backgroundColor: bgColor }">
<WaveBg :theme-color="bgThemeColor" />
<NCard class="relative w-auto rd-12px z-4">
<NCard :bordered="false" class="relative w-auto rd-12px z-4">
<div class="w-400px <sm:w-300px">
<header class="flex-y-center justify-between">
<SystemLogo class="text-64px text-primary <sm:text-48px" />

8
src/views/about/index.vue
View File

@ -42,10 +42,10 @@ const latestBuildTime = BUILD_TIME;
<template>
<NSpace vertical :size="16">
<NCard :title="$t('page.about.title')" :bordered="false" size="large" class="card-wrapper">
<NCard :title="$t('page.about.title')" :bordered="false" size="small" segmented class="card-wrapper">
<p>{{ $t('page.about.introduction') }}</p>
</NCard>
<NCard :title="$t('page.about.projectInfo.title')" :bordered="false" size="large" class="card-wrapper">
<NCard :title="$t('page.about.projectInfo.title')" :bordered="false" size="small" segmented class="card-wrapper">
<NDescriptions label-placement="left" bordered size="small" :column="column">
<NDescriptionsItem :label="$t('page.about.projectInfo.version')">
<NTag type="primary">{{ pkgJson.version }}</NTag>
@ -65,14 +65,14 @@ const latestBuildTime = BUILD_TIME;
</NDescriptionsItem>
</NDescriptions>
</NCard>
<NCard :title="$t('page.about.prdDep')" :bordered="false" size="large" class="card-wrapper">
<NCard :title="$t('page.about.prdDep')" :bordered="false" size="small" segmented class="card-wrapper">
<NDescriptions label-placement="left" bordered size="small" :column="column">
<NDescriptionsItem v-for="item in pkgJson.dependencies" :key="item.name" :label="item.name">
{{ item.version }}
</NDescriptionsItem>
</NDescriptions>
</NCard>
<NCard :title="$t('page.about.devDep')" :bordered="false" size="large" class="card-wrapper">
<NCard :title="$t('page.about.devDep')" :bordered="false" size="small" segmented class="card-wrapper">
<NDescriptions label-placement="left" bordered size="small" :column="column">
<NDescriptionsItem v-for="item in pkgJson.devDependencies" :key="item.name" :label="item.name">
{{ item.version }}

2
src/views/home/components/card-data.vue
View File

@ -78,7 +78,7 @@ function getGradientColor(color: CardData['color']) {
</script>
<template>
<NCard :bordered="false" class="card-wrapper">
<NCard :bordered="false" size="small" class="card-wrapper">
<!-- define component start: GradientBg -->
<DefineGradientBg v-slot="{ $slots, gradientColor }">
<div class="px-16px pt-8px pb-4px rd-8px text-white" :style="{ backgroundImage: gradientColor }">

4
src/views/home/components/header-banner.vue
View File

@ -41,7 +41,7 @@ const statisticData = computed<StatisticData[]>(() => [
<template>
<NCard :bordered="false" class="card-wrapper">
<NGrid :x-gap="gap" :y-gap="16" responsive="screen" item-responsive>
<NGi span="24 s:24 m:20">
<NGi span="24 s:24 m:18">
<div class="flex-y-center">
<div class="shrink-0 size-72px rd-1/2 overflow-hidden">
<img src="@/assets/imgs/soybean.jpg" class="size-full" />
@ -54,7 +54,7 @@ const statisticData = computed<StatisticData[]>(() => [
</div>
</div>
</NGi>
<NGi span="24 s:24 m:4">
<NGi span="24 s:24 m:6">
<NSpace :size="24" justify="end">
<NStatistic v-for="item in statisticData" :key="item.id" class="whitespace-nowrap" v-bind="item" />
</NSpace>