style(ui): align responsive heroes and card controls

This commit is contained in:
2026-07-29 22:15:28 +08:00
parent 21a2db2afd
commit 358fa2c7d3
5 changed files with 97 additions and 59 deletions
+4 -4
View File
@@ -427,14 +427,14 @@ watch(selectedUploadDate, async newValue => {
<div class="oc-container oc-container--content oc-page-hero__inner">
<div
v-if="loading"
class="grid gap-6 lg:grid-cols-[1.25fr_0.95fr]"
class="oc-page-hero__split"
>
<NCard class="oc-panel-card h-full border border-slate-200 shadow-sm" :bordered="false">
<NSkeleton class="h-6 w-1/3" />
<NSkeleton class="mt-4 h-10 w-2/3" />
<NSkeleton class="mt-5 h-4 w-full" :repeat="2" />
</NCard>
<div v-if="isOwnProfile" class="grid grid-cols-2 gap-3 lg:h-full lg:grid-rows-2">
<div v-if="isOwnProfile" class="grid grid-cols-2 gap-3 min-[900px]:h-full min-[900px]:grid-rows-2">
<NCard v-for="n in 4" :key="n" class="oc-panel-card-soft h-full border border-white/80 bg-white/85 shadow-sm backdrop-blur" :bordered="false">
<NSkeleton class="h-3 w-2/3" />
<NSkeleton class="mt-3 h-7 w-1/2" />
@@ -450,7 +450,7 @@ watch(selectedUploadDate, async newValue => {
<div
v-else
class="grid gap-6 lg:grid-cols-[1.25fr_0.95fr] lg:items-stretch"
class="oc-page-hero__split oc-page-hero__split--stretch"
>
<NCard class="oc-panel-card h-full border border-slate-200 bg-white/90 shadow-sm backdrop-blur" :bordered="false">
<div class="flex gap-5">
@@ -497,7 +497,7 @@ watch(selectedUploadDate, async newValue => {
</div>
</NCard>
<div v-if="isOwnProfile" class="grid grid-cols-2 gap-3 lg:h-full lg:grid-rows-2">
<div v-if="isOwnProfile" class="grid grid-cols-2 gap-3 min-[900px]:h-full min-[900px]:grid-rows-2">
<NCard class="oc-panel-card-soft h-full border border-white/80 bg-white/85 shadow-sm backdrop-blur" :bordered="false">
<p class="oc-stat-label">总拍摄数</p>
<p class="oc-stat-value">{{ totalShots }}</p>