detail布局调整

src/lang/en.ts

@@ -305,7 +305,7 @@ export default {
 	digitalDetail:{
 		Sketch: 'Sketch',
 		Illustration: 'Illustration',
-		Product: 'Product',
+		Product: 'Product Image',
 		EditorialVisual: 'Editorial Visual',
 		Back: 'Back',
 		ReleaseIn: 'Release in',

src/views/digitalDetail/index.vue

@@ -111,7 +111,7 @@ defineExpose({})
 				</div>
 				<div class="right">
 					<div class="top">
-						<div class="box">
+						<div class="box illustration">
 							<div class="title">{{ $t('digitalDetail.Illustration') }}</div>
 							<div class="imgBox">
 								<img :src="item?.imgUrl" v-for="item in illustrationList" :key="item" alt="">
@@ -125,7 +125,7 @@ defineExpose({})
 						</div>
 					</div>
 					<div class="bottom">
-						<div class="box aa">
+						<div class="box editorialVisual">
 							<div class="title">{{ $t('digitalDetail.EditorialVisual') }}</div>
 							<div class="imgBox">
 								<img :src="item?.gif||item?.imgUrl" v-for="item in editorialVisualList" :key="item" alt="">
@@ -234,8 +234,37 @@ defineExpose({})
 						flex-wrap: wrap;
 						img{
 							width: 100%;
+							// height: 51rem;
+							// margin: 0 auto;
 						}
 					}
+					&.sketch{
+						.imgBox{
+							flex-direction: column;
+							gap: 2rem;
+							padding: 5rem 0;
+							img{
+								height: 20.4rem;
+								width: auto;
+								margin: auto;
+							}
+						}
+					}
+					&.illustration{
+						.imgBox{
+							> img{
+								aspect-ratio: 9 / 16;
+								object-fit: contain;
+								padding: 3.6rem;
+							}
+						}	
+					}
+					&.editorialVisual{
+						.imgBox{
+							row-gap: 60px;
+						}						
+					}
+				
 					
 				}
 				> .left{
@@ -260,6 +289,7 @@ defineExpose({})
 						display: flex;
 					}
 					> .bottom{
+						margin-top: 10.5rem;
 						.imgBox{
 							display: flex;
 							img{
@@ -336,6 +366,9 @@ defineExpose({})
 							object-fit: cover;
 						}
 						> .detail{
+							display: flex;
+						    flex-direction: column;
+							align-items: flex-start;
 							.name{
 								text-decoration: underline;
 								font-weight: 500;