diff --git a/pages/index.vue b/pages/index.vue index 3e063fd..cd2ba1f 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -80,19 +80,19 @@ div(class="mt-[60px] grid grid-cols-1 lg:grid-cols-4 xl:grid-cols-5 text-white b ) img(:src="IconStack") // 卡片模式 - div.flex.flex-wrap.gap-6(:class="{'justify-center': !views.cardMode, 'flex-col':views.cardMode}") + div.flex.gap-6.justify-center.items-center(:class="{'flex-col':!views.cardMode, 'flex-wrap':views.cardMode}") template(v-for="task in tasks" :key="task.id") div.relative.bg-green-900.rounded-md.overflow-hidden.w-512px.h-512px.min-w-512px div.object-contain(v-if="task.data") img(loading="lazy" :src="img" alt="task" v-for="img in task.data" :key="img") - div.absolute.left-2.right-2.bottom-2.bg-green-600.rounded-full.overflow-hidden.text-green-900.text-xs.transition-all.duration-750.ease-linear.h-8.opacity-90( - :class="{'h-2': task.progress>0.9, 'opacity-10': task.status=='done'}" + div.absolute.left-2.right-2.bottom-2.bg-green-600.rounded-full.overflow-hidden.text-green-900.text-xs.transition-all.duration-750.ease-linear( + :class="{'h-8': task.progress<=0.9, 'h-2': task.progress>0.9, 'opacity-90': task.status!='done', 'opacity-10': task.status=='done'}" ) - div.flex.items-center.text-center.h-full.px-2.bg-green-400.transition-all.duration-8000.ease-linear( + div.flex.items-center.text-center.h-full.px-2.bg-green-400.rounded-r-full.transition-all.duration-8000.ease-linear( :style="`width:${task.progress*100}%;`" ) {{ task.status }} {{ task.progress*100 }}% - div.absolute.inset-0.flex.flex-col.items-center.justify-center.transition-opacity.bg-gradient-to-t.to-transparent.opacity-0(class="hover:cursor-pointer hover:opacity-100 from-black/90") - pre {{ task }} + div.absolute.inset-0.flex.items-end.justify-center.p-6.transition-opacity.bg-gradient-to-t.to-transparent.opacity-0(class="hover:cursor-pointer hover:opacity-100 from-black/90") + pre {{ task.prompt }} // 右侧参数 aside(class="lg:overflow-y-auto relative z-20 transition-all scrollbar-hide") div(class="px-6 divide-y divide-white/10")