更新ui样式,并修复已知问题 (#8)
Reviewed-on: #8
This commit was merged in pull request #8.
This commit is contained in:
@@ -198,7 +198,7 @@ onBeforeUnmount(() => {
|
||||
class="fixed inset-0 z-[130] flex items-center justify-center bg-slate-950/55 px-4 py-6 backdrop-blur-sm"
|
||||
@click="close"
|
||||
>
|
||||
<div class="w-full max-w-3xl overflow-hidden border border-slate-200 bg-white shadow-2xl" @click.stop>
|
||||
<div class="oc-modal-shell w-full max-w-3xl overflow-hidden" @click.stop>
|
||||
<div class="flex items-start justify-between border-b border-slate-200 px-5 py-4">
|
||||
<div>
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.22em] text-sky-700">Quick Upload</p>
|
||||
@@ -207,7 +207,7 @@ onBeforeUnmount(() => {
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
class="quick-upload-close oc-icon-button"
|
||||
class="oc-icon-button"
|
||||
aria-label="关闭快捷上传"
|
||||
title="关闭快捷上传"
|
||||
@click="close"
|
||||
@@ -228,7 +228,13 @@ onBeforeUnmount(() => {
|
||||
<span class="font-medium text-slate-700">正在上传 {{ currentItemIndex }} / {{ totalItems }}</span>
|
||||
<span class="font-medium text-sky-700">{{ overallProgress }}%</span>
|
||||
</div>
|
||||
<NProgress type="line" :percentage="overallProgress" :show-indicator="false" color="#0ea5e9" rail-color="#dbeafe" />
|
||||
<NProgress
|
||||
type="line"
|
||||
:percentage="overallProgress"
|
||||
:show-indicator="false"
|
||||
color="var(--oc-color-info)"
|
||||
rail-color="var(--oc-color-border)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div
|
||||
@@ -251,9 +257,9 @@ onBeforeUnmount(() => {
|
||||
<div class="overflow-hidden border border-slate-900 bg-slate-950">
|
||||
<img :src="activeItem.preview" alt="图片预览" class="h-56 w-full object-contain" />
|
||||
</div>
|
||||
<div class="mt-3 flex items-center justify-between gap-2">
|
||||
<button type="button" class="oc-text-button text-sm" @click="fileInput?.click()">重新选择</button>
|
||||
<button type="button" class="oc-text-button oc-text-button--danger text-sm" @click="handleRemove(activeItem.id)">移除</button>
|
||||
<div class="mt-3 flex items-center gap-2">
|
||||
<button type="button" class="oc-panel-button oc-panel-button--neutral flex-1" @click="fileInput?.click()">重新选择</button>
|
||||
<button type="button" class="oc-panel-button oc-panel-button--danger flex-1" @click="handleRemove(activeItem.id)">移除</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -394,9 +400,3 @@ onBeforeUnmount(() => {
|
||||
/>
|
||||
</Teleport>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.quick-upload-close.quick-upload-close {
|
||||
border-radius: 9999px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user