style: 让资产详情预览宽度跟随图片

This commit is contained in:
GouJ
2026-09-22 11:56:45 +08:00
parent 5f78efaad1
commit 6e542a5de7
@@ -472,7 +472,30 @@ async function removeAsset() {
@apply grid grid-cols-[minmax(280px,_0.9fr)_minmax(0,_1.1fr)] items-start gap-5;
}
.asset-management-preview {
@apply h-[min(56dvh,_560px)] min-h-[280px] aspect-auto bg-(--app-subtle);
--asset-detail-image-max-height: min(56dvh, 560px);
display: block;
width: fit-content;
max-width: 100%;
height: auto;
min-height: 0;
aspect-ratio: auto;
justify-self: center;
}
.asset-management-preview :deep(.reveal-image),
.asset-management-preview :deep(.n-image) {
display: block;
width: fit-content;
max-width: 100%;
height: auto;
min-height: 0;
}
.asset-management-preview :deep(.n-image img) {
display: block;
width: auto;
max-width: 100%;
height: auto;
max-height: var(--asset-detail-image-max-height);
object-fit: contain;
}
.asset-management-fields {
@apply min-w-0;
@@ -503,7 +526,7 @@ async function removeAsset() {
@apply grid-cols-1;
}
.asset-management-preview {
@apply h-[min(42dvh,_420px)] min-h-[220px];
--asset-detail-image-max-height: min(42dvh, 420px);
}
}
@container asset-library (max-width: 560px) {