diff --git a/src/assets/css/style.css b/src/assets/css/style.css
index 48ea446..81beb9e 100644
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -122,11 +122,11 @@ button[custom="white"] {
   height: 5rem;
   padding: 0 1rem;
   border-radius: 0;
-  border: none;
   font-family: KaiseiOpti-Bold;
   font-size: var(--button-font-size, 2rem);
   color: var(--button-color, #232323);
   background: var(--button-bgcolor, #fff);
+  border: var(--button-border, none);
   cursor: pointer;
 }
 button[custom]:active,
@@ -141,6 +141,11 @@ button[custom="black"] {
   --button-click-color: #fff;
   --button-font-size: 1.6rem;
 }
-.el-select-dropdown__item {
-  padding: 0 2rem !important;
+button[custom="black-box"] {
+  --button-bgcolor: transparent;
+  --button-color: #232323;
+  --button-border: 0.2rem solid #979797;
+  --button-click-bgcolor: #979797;
+  --button-click-color: #fff;
+  --button-font-size: 1.6rem;
 }
diff --git a/src/assets/css/style.less b/src/assets/css/style.less
index 1557dc7..23f75a9 100644
--- a/src/assets/css/style.less
+++ b/src/assets/css/style.less
@@ -149,11 +149,11 @@ button[custom="white"] {
 	height: 5rem;
 	padding: 0 1rem;
 	border-radius: 0;
-	border: none;
 	font-family: KaiseiOpti-Bold;
 	font-size: var(--button-font-size, 2rem);
 	color: var(--button-color, #232323);
 	background: var(--button-bgcolor, #fff);
+	border: var(--button-border, none);
 	cursor: pointer;
 
 	&:active {
@@ -168,4 +168,13 @@ button[custom="black"] {
 	--button-click-bgcolor: #333;
 	--button-click-color: #fff;
 	--button-font-size: 1.6rem;
+}
+
+button[custom="black-box"] {
+	--button-bgcolor: transparent;
+	--button-color: #232323;
+	--button-border: 0.2rem solid #979797;
+	--button-click-bgcolor: #979797;
+	--button-click-color: #fff;
+	--button-font-size: 1.6rem;
 }
\ No newline at end of file
diff --git a/src/assets/images/home/bg.jpg b/src/assets/images/home/bg.jpg
deleted file mode 100644
index a234fb3..0000000
Binary files a/src/assets/images/home/bg.jpg and /dev/null differ
diff --git a/src/assets/images/home/bg.png b/src/assets/images/home/bg.png
new file mode 100644
index 0000000..d14ca1a
Binary files /dev/null and b/src/assets/images/home/bg.png differ
diff --git a/src/assets/images/home/designer-bg.png b/src/assets/images/home/designer-bg.png
new file mode 100644
index 0000000..3e0baf8
Binary files /dev/null and b/src/assets/images/home/designer-bg.png differ
diff --git a/src/assets/images/home/designers-left.jpg b/src/assets/images/home/designers-left.jpg
deleted file mode 100644
index b737116..0000000
Binary files a/src/assets/images/home/designers-left.jpg and /dev/null differ
diff --git a/src/assets/images/home/designers-right.jpg b/src/assets/images/home/designers-right.jpg
deleted file mode 100644
index 97e3b7e..0000000
Binary files a/src/assets/images/home/designers-right.jpg and /dev/null differ
diff --git a/src/assets/images/logos/aidaAndStylish.png b/src/assets/images/logos/aidaAndStylish.png
new file mode 100644
index 0000000..e9f5eb4
Binary files /dev/null and b/src/assets/images/logos/aidaAndStylish.png differ
diff --git a/src/lang/en.ts b/src/lang/en.ts
index a767417..2303846 100644
--- a/src/lang/en.ts
+++ b/src/lang/en.ts
@@ -2,8 +2,7 @@ export default {
 	Login: {
 		login: 'Log in',
 		register: 'Register',
-		loginTo: 'Log on to <span>FiDA</span>',
-		loginTitle: 'A multi-agent canvas for rapid, trend driven design iteration.',
+		loginTip: 'Platform integrated with AiDA.<br />AiDA account login required.',
 		name: 'Name',
 		email: 'Email',
 		password: 'Password',
diff --git a/src/lang/zh-cn.ts b/src/lang/zh-cn.ts
index 10177c0..5787c9b 100644
--- a/src/lang/zh-cn.ts
+++ b/src/lang/zh-cn.ts
@@ -2,9 +2,7 @@ export default {
 	Login: {
 		login: '登录',
 		register: '注册',
-		signUp: '注册',
-		loginTo: '登录到 <span>FiDA</span',
-		loginTitle: '一个多智能体画布，用于快速、趋势驱动的设计迭代。',
+		loginTip: '与 AiDA 集成的平台。<br />需要登录 AiDA 账户。',
 		name: '姓名',
 		email: '邮箱',
 		password: '密码',
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 872f9be..20241e1 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,7 +1,7 @@
 <template>
 	<div class="home-index">
 		<section-index />
-		<section-designers />
+		<section-designer />
 		<section-design />
 		<section-digital-items1 />
 		<section-digital-items2 />
@@ -12,7 +12,7 @@
 <script setup lang="ts">
 	import { computed } from 'vue'
 	import SectionIndex from './section-index.vue'
-	import SectionDesigners from './section-designers.vue'
+	import SectionDesigner from './section-designer.vue'
 	import SectionDesign from './section-design.vue'
 	import SectionDigitalItems1 from './section-digital-items1.vue'
 	import SectionDigitalItems2 from './section-digital-items2.vue'
diff --git a/src/views/home/section-designer.vue b/src/views/home/section-designer.vue
new file mode 100644
index 0000000..9274207
--- /dev/null
+++ b/src/views/home/section-designer.vue
@@ -0,0 +1,51 @@
+<template>
+	<section class="section-designer">
+		<div class="title">Designer Community</div>
+		<div class="tip">
+			Discover the designers shaping AiDA’s creative landscape. <br />
+			Each month, we will showcase a curated selection of their most distinguished works.
+		</div>
+		<button custom="black" @click="onSearchBrand">Search Brands</button>
+		<img src="@/assets/images/home/designer-bg.png" />
+	</section>
+</template>
+
+<script setup lang="ts">
+	import { computed, ref } from 'vue'
+	import { useRouter } from 'vue-router'
+	const router = useRouter()
+	const onSearchBrand = () => {
+		router.push({ name: 'brand' })
+	}
+</script>
+
+<style lang="less">
+	.section-designer {
+		padding: 9rem 8rem;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		> .title {
+			font-family: KaiseiOpti-Bold;
+			font-size: 5.6rem;
+			line-height: 6.2rem;
+			text-align: center;
+			margin-bottom: 2rem;
+		}
+		> .tip {
+			font-family: KaiseiOpti-Regular;
+			font-size: 2rem;
+			line-height: 2.8rem;
+			text-align: center;
+			color: #979797;
+			margin-bottom: 2rem;
+		}
+		> button {
+			margin-bottom: 4.6rem;
+		}
+		> img {
+			width: 73%;
+			height: auto;
+		}
+	}
+</style>
diff --git a/src/views/home/section-designers.vue b/src/views/home/section-designers.vue
deleted file mode 100644
index fae0680..0000000
--- a/src/views/home/section-designers.vue
+++ /dev/null
@@ -1,130 +0,0 @@
-<template>
-	<section class="section-designers">
-		<div class="title">Popular Designers</div>
-		<div class="tip">
-			Discover the designers shaping AiDA’s creative landscape,<br />as we present their most
-			distinguished works each month.
-		</div>
-		<div class="content">
-			<img src="@/assets/images/home/designers-left.jpg" />
-			<div class="box">
-				<div class="intro">
-					<span>{{ list[index]?.intro || '' }}</span>
-					<img src="@/assets/images/home/designers-right.jpg" />
-				</div>
-				<div
-					class="name-item"
-					v-for="(v, i) in list"
-					:key="i"
-					:class="{ active: i === index }"
-					@click="index = i"
-				>
-					<span class="name">{{ v.name }}</span>
-					<span class="icon">
-						<svg-icon name="arrow_right" size="20" />
-					</span>
-				</div>
-			</div>
-		</div>
-	</section>
-</template>
-
-<script setup lang="ts">
-	import { computed, ref } from 'vue'
-	const index = ref(0)
-	const list = ref([
-		{
-			name: 'Ji-Yeon Park',
-			intro:
-				'Through its fragile tulle layers over a grounded silhouette, the garment reflects the tension between vulnerability and strength within one’s journey.'
-		},
-		{
-			name: 'Lian Su',
-			intro: '阿巴阿巴~'
-		},
-		{
-			name: 'Céline Moreau',
-			intro: '这是Céline Moreau的设计~'
-		}
-	])
-</script>
-
-<style lang="less">
-	.section-designers {
-		padding: 9rem 8rem;
-		> .title {
-			font-family: KaiseiOpti-Bold;
-			font-size: 5.6rem;
-			line-height: 6.2rem;
-			text-align: center;
-			margin-bottom: 1rem;
-		}
-		> .tip {
-			font-family: KaiseiOpti-Regular;
-			font-size: 2rem;
-			line-height: 2.8rem;
-			text-align: center;
-			color: #979797;
-		}
-		> .content {
-			margin-top: 5rem;
-			border: 0.1rem solid #979797;
-			border-left: none;
-			border-left: none;
-			border-right: none;
-			box-sizing: content-box;
-			--height: 45rem;
-			min-height: var(--height);
-			display: flex;
-			> img {
-				width: var(--height);
-				height: var(--height);
-				margin: 2.4rem 2.4rem 2.4rem 0;
-			}
-			> .box {
-				flex: 1;
-				display: flex;
-				flex-direction: column;
-				> .intro {
-					display: flex;
-					margin: 2rem 2rem 2rem 0;
-					> span {
-						flex: 1;
-						font-family: KaiseiOpti-Regular;
-						font-size: 2rem;
-						line-height: 3rem;
-						color: #232323;
-						margin-right: 9rem;
-					}
-					> img {
-						width: 25rem;
-						height: 25rem;
-					}
-				}
-				> .name-item {
-					flex: 1;
-					min-height: 5rem;
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					border-top: 0.1rem solid #7b7b7b;
-					padding: 0 2.1rem;
-					font-family: KaiseiOpti-Regular;
-					font-size: 2.4rem;
-					color: #7b7b7b;
-					> .icon {
-						transform: rotate(-45deg);
-					}
-					&.active {
-						font-family: KaiseiOpti-Bold;
-						color: #232323;
-						background: #f6f6f6;
-						> .icon {
-							transform: rotate(0);
-						}
-					}
-				}
-			}
-		}
-	}
-</style>
diff --git a/src/views/home/section-index.vue b/src/views/home/section-index.vue
index 16ddfc0..fae41bc 100644
--- a/src/views/home/section-index.vue
+++ b/src/views/home/section-index.vue
@@ -1,74 +1,58 @@
 <template>
 	<section class="section-index bgw">
-		<img src="@/assets/images/home/bg.jpg" class="bg" />
-		<div class="shade-1"></div>
-		<div class="shade-2"></div>
+		<img src="@/assets/images/home/bg.png" class="bg" />
 		<div class="content">
-			<div class="title">Windswept Burden</div>
-			<div class="tip">We are spiritual nomads carrying<br />what wind cannot take.</div>
-			<button custom>View More</button>
-			<div class="aida-logo"><img src="@/assets/images/logos/aida.png" /></div>
-			<p class="tip">
-				What you wear is how you present yourself to the world, especially today, when human
-				contacts are so quick. Fashion is instant language
-			</p>
-			<p class="tip">I firmly believe that with the right footwear one can rule the world.</p>
+			<div class="title" v-html="title"></div>
+			<div class="tip">
+				Discover collections through the stories behind their creation. A curated space connecting
+				designers, narratives, and fashion commerce.
+			</div>
+			<button custom="black-box" @click="handleClickArrow">
+				<svg-icon name="arrow_right" size="34" />
+			</button>
 		</div>
 	</section>
 </template>
 
 <script setup lang="ts">
 	import { computed } from 'vue'
+	import { useRouter } from 'vue-router'
+	const router = useRouter()
+	const title =
+		'We’re Seeking<br /><span>Fashion Voice</span><br /><span class="small">Worth Featuring.</span>'
+	const handleClickArrow = () => {
+		router.push({ name: 'collectionStory' })
+	}
 </script>
 
 <style lang="less">
 	.section-index {
-		> .shade-1 {
-			position: absolute;
-			top: 0;
-			left: 0;
-			width: 96rem;
-			height: 100%;
-			background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.25) 100%);
-		}
-		> .shade-2 {
-			position: absolute;
-			bottom: 0;
-			left: 0;
-			width: 100%;
-			height: 30rem;
-			background: linear-gradient(180deg, rgba(0, 0, 0, 0) 38.37%, rgba(0, 0, 0, 0.192) 90.74%);
-		}
 		> .content {
-			top: 16rem;
+			top: 13.7rem;
 			left: 9rem;
-			color: #fff;
+			color: #232323;
 			> .title {
 				font-family: KaiseiOpti-Bold;
-				font-size: 6rem;
+				font-size: 7rem;
 				margin-bottom: 3rem;
-			}
-			> div.tip {
-				font-family: KaiseiOpti-Regular;
-				font-size: 3.2rem;
-				line-height: 4.3rem;
-			}
-			> button {
-				margin-top: 11.6rem;
-				margin-bottom: 13.9rem;
-			}
-			> .aida-logo {
-				margin-bottom: 3rem;
-				> img {
-					width: auto;
-					height: 5rem;
+				span {
+					font-family: KaiseiOpti-Medium;
+					&.small {
+						font-size: 6rem;
+					}
 				}
 			}
-			> p.tip {
-				font-family: KaiseiOpti-Regular;
-				font-size: 1.2rem;
-				line-height: 2rem;
-				color: #ededed;
+			> .tip {
+				width: 50rem;
+				font-size: 1.8rem;
+				line-height: 2.6rem;
+				color: #585858;
+			}
+			> button {
+				margin-top: 12rem;
+				min-width: 0;
+				width: 8rem;
+				height: 8rem;
 			}
 		}
 	}
diff --git a/src/views/login/login.vue b/src/views/login/login.vue
index 87f251e..8b51759 100644
--- a/src/views/login/login.vue
+++ b/src/views/login/login.vue
@@ -1,5 +1,9 @@
 <template>
 	<div class="login">
+		<div class="header">
+			<img src="@/assets/images/logos/aidaAndStylish.png" alt="" />
+			<div v-html="$t('Login.loginTip')"></div>
+		</div>
 		<el-form :model="formData" :rules="ruleForm" label-position="top" ref="formRef">
 			<el-form-item :label="$t('Login.email')" prop="email">
 				<el-input v-model="formData.email" :placeholder="$t('Login.enterEmail')" name="email" />
@@ -72,4 +76,24 @@
 
 <style lang="less" scoped>
 	@import './less/style.less';
+	.login {
+		> .header {
+			width: 100%;
+			margin: 1rem 0 3rem;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			> img {
+				width: auto;
+				height: 2.8rem;
+			}
+			> div {
+				text-align: right;
+				font-family: KaiseiOpti-Regular;
+				font-size: 1.1rem;
+				color: #232323;
+				line-height: 1.75rem;
+			}
+		}
+	}
 </style>
diff --git a/src/views/main-header.vue b/src/views/main-header.vue
index 8c3e0db..f9dddf3 100644
--- a/src/views/main-header.vue
+++ b/src/views/main-header.vue
@@ -62,6 +62,10 @@
 					</div>
 				</template>
 			</el-popover>
+			<div class="language" @click="onLanguageClick">
+				<span :class="{ active: locale === 'CHINESE_SIMPLIFIED' }">中</span> /
+				<span :class="{ active: locale === 'ENGLISH' }">ENG</span>
+			</div>
 		</div>
 	</div>
 </template>
@@ -70,6 +74,8 @@
 	import { computed, ref } from 'vue'
 	import { useRouter, useRoute } from 'vue-router'
 	import myEvent from '@/utils/myEvent'
+	import { useI18n } from 'vue-i18n'
+	const { t, locale } = useI18n()
 	const router = useRouter()
 	const route = useRoute()
 	const activePath = computed(() => route.path)
@@ -131,6 +137,10 @@
 		hideProfilePopover()
 		console.log('logout')
 	}
+	const onLanguageClick = () => {
+		locale.value = locale.value === 'ENGLISH' ? 'CHINESE_SIMPLIFIED' : 'ENGLISH'
+		localStorage.setItem('language', locale.value)
+	}
 </script>
 
 <style lang="less" scoped>
@@ -159,7 +169,6 @@
 				height: 2.4rem;
 			}
 			> .login {
-				font-family: Kaisei Opti;
 				font-size: 1.6rem;
 			}
 			> .profile {
@@ -168,6 +177,15 @@
 				border-radius: 50%;
 				background: #f5f5f5;
 			}
+			> .language {
+				font-family: KaiseiOpti-Regular;
+				font-size: 1.6rem;
+				color: #c2c2c2;
+				> .active {
+					color: #232323;
+					font-family: KaiseiOpti-Medium;
+				}
+			}
 		}
 		> .center,
 		> .right {
@@ -195,7 +213,6 @@
 					font-size: 1.6rem;
 					color: #232323;
 					border-bottom: 0.1rem solid transparent;
-					font-family: Kaisei Opti;
 				}
 				&.active {
 					> span {
diff --git a/src/views/shoppingCart/order-summary.vue b/src/views/shoppingCart/order-summary.vue
index b1e4b32..b61b3ec 100644
--- a/src/views/shoppingCart/order-summary.vue
+++ b/src/views/shoppingCart/order-summary.vue
@@ -18,16 +18,6 @@
 			>
 		</div>
 		<br />
-		<div class="total-file-size">
-			<span class="label">
-				<span class="icon"><svg-icon name="order-file" size="18" /></span>
-				<span class="text">Total File Size</span>
-			</span>
-			<span class="value"
-				>{{ totalSize.size }} <span>{{ totalSize.unit }}</span></span
-			>
-		</div>
-		<div class="hr"></div>
 		<br />
 		<div class="total">
 			<span class="label">Total</span>
@@ -65,14 +55,6 @@
 		})
 		return arr
 	})
-	const totalSize = computed(() => {
-		const total = props.list.reduce((pre, cur) => pre + cur.fileSize, 0)
-		const str = FormatBytes(total)
-		return {
-			size: str.split(' ')[0],
-			unit: str.split(' ')[1]
-		}
-	})
 	const totalAmount = computed(() => props.list.reduce((pre, cur) => pre + cur.amount, 0).toFixed(2))
 	const handleCheckout = () => {
 		console.log('购买：', props.list)
diff --git a/src/views/shoppingCart/sc-item.vue b/src/views/shoppingCart/sc-item.vue
index cc2d3d0..7e9fa37 100644
--- a/src/views/shoppingCart/sc-item.vue
+++ b/src/views/shoppingCart/sc-item.vue
@@ -1,200 +1,200 @@
 <template>
-  <div class="sc-item" :class="{ 'is-order-actions-layout': orderActionsLayout }">
-    <slot name="checkbox" />
-    <img :src="info.url" />
-    <div class="content">
-      <div class="title">{{ info.title }}</div>
-      <div class="brand">
-        <span class="icon"><svg-icon name="order-shop" size="24" /></span>
-        <span class="text">{{ info.brand }}</span>
-      </div>
-      <div class="tags" v-if="showTags">
-        <span v-for="tag in info.tags" :key="tag" class="tag">{{ tag }}</span>
-      </div>
-      <div class="size" v-if="showSize">
-        <div class="icon"><svg-icon name="order-file" size="18" /></div>
-        <div class="text">
-          <span>{{ FormatBytes(info.fileSize) }}</span>
-          <span v-if="showSizeDate"
-            >&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;{{
-              FormatDate(info.date, 'SM D, YYYY, h:mm A')
-            }}</span
-          >
-        </div>
-      </div>
-    </div>
-    <div class="right">
-      <div class="amount">${{ info.amount }}<span> HKD</span></div>
-      <SvgIcon v-if="orderActionsLayout" class="download" name="download" size="32" color="#232323" />
-      <div class="remove" v-if="showRemove" @click="onRemove">
-        <span class="icon"><svg-icon name="order-delete" size="18" /></span>
-        <span class="text">Remove</span>
-      </div>
-    </div>
-  </div>
+	<div class="sc-item" :class="{ 'is-order-actions-layout': orderActionsLayout }">
+		<slot name="checkbox" />
+		<img :src="info.url" />
+		<div class="content">
+			<div class="title">{{ info.title }}</div>
+			<div class="brand">
+				<span class="icon"><svg-icon name="order-shop" size="24" /></span>
+				<span class="text">{{ info.brand }}</span>
+			</div>
+			<div class="tags" v-if="showTags">
+				<span v-for="tag in info.tags" :key="tag" class="tag">{{ tag }}</span>
+			</div>
+			<div class="date" v-if="showDate">
+				<!-- <div class="icon"><svg-icon name="order-file" size="18" /></div> -->
+				<div class="text">
+					{{ FormatDate(info.date, 'SM D, YYYY, h:mm A') }}
+				</div>
+			</div>
+		</div>
+		<div class="right">
+			<div class="amount">${{ info.amount }}<span> HKD</span></div>
+			<SvgIcon
+				v-if="orderActionsLayout"
+				class="download"
+				name="download"
+				size="32"
+				color="#232323"
+			/>
+			<div class="remove" v-if="showRemove" @click="onRemove">
+				<span class="icon"><svg-icon name="order-delete" size="18" /></span>
+				<span class="text">Remove</span>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script setup lang="ts">
-import { computed, ref, onMounted } from 'vue'
-import { FormatBytes, FormatDate } from '@/utils/tools'
-const emit = defineEmits(['remove'])
-const props = defineProps({
-  showTags: { type: Boolean, default: true },
-  showSize: { type: Boolean, default: true },
-  showSizeDate: { type: Boolean, default: true },
-  showRemove: { type: Boolean, default: true },
-  orderActionsLayout: { type: Boolean, default: false },
-  info: { type: Object, default: () => {} }
-})
-const onRemove = () => {
-  emit('remove', props.info.id)
-}
+	import { computed, ref, onMounted } from 'vue'
+	import { FormatBytes, FormatDate } from '@/utils/tools'
+	const emit = defineEmits(['remove'])
+	const props = defineProps({
+		showTags: { type: Boolean, default: true },
+		showDate: { type: Boolean, default: true },
+		showRemove: { type: Boolean, default: true },
+		orderActionsLayout: { type: Boolean, default: false },
+		info: { type: Object, default: () => {} }
+	})
+	const onRemove = () => {
+		emit('remove', props.info.id)
+	}
 </script>
 
 <style lang="less" scoped>
-.sc-item {
-  border-bottom: 0.1rem solid #c4c4c4;
-  padding: var(--sc-item-padding, 2.4rem 0);
-  display: flex;
-  align-items: center;
-  > img {
-    width: var(--sc-item-img-width, 14.8rem);
-    height: var(--sc-item-img-height, 18.8rem);
-    object-fit: contain;
-    background-color: #f6f6f6;
-  }
-  > .content {
-    flex: 1;
-    margin: var(--sc-item-content-margin, 0 4rem);
-    align-self: var(--sc-item-content-align-self);
-    > * {
-      margin-bottom: var(--sc-item-margin-bottom, 1.6rem);
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-    > .title {
-      font-family: KaiseiOpti-Bold;
-      font-size: var(--sc-item-title-font-size, 2.4rem);
-      color: #232323;
-    }
-    > .brand {
-      display: flex;
-      align-items: center;
-      > .icon {
-        width: 2.4rem;
-        height: 2.4rem;
-        margin-right: 1rem;
-      }
-      > .text {
-        font-size: var(--sc-item-brand-font-size, 1.6rem);
-        text-decoration: underline;
-        color: #232323;
-      }
-    }
-    > .tags {
-      display: flex;
-      flex-wrap: wrap;
-      gap: 0.8rem;
-      > .tag {
-        min-width: var(--sc-item-tag-min-width, 8.8rem);
-        height: var(--sc-item-tag-height, 2.4rem);
-        line-height: var(--sc-item-tag-height, 2.4rem);
-        border-radius: var(--sc-item-tag-radius, 2.4rem);
-        font-size: var(--sc-item-tag-font-size, 1.4rem);
-        padding: var(--sc-item-tag-padding, 0 1rem);
-        text-align: center;
-        color: #8f8f8f;
-        background-color: #eee;
-      }
-    }
-    > .size {
-      display: flex;
-      align-items: center;
-      > .icon {
-        width: 2.4rem;
-        height: 2.4rem;
-        margin-right: 1rem;
-        color: #808080;
-      }
+	.sc-item {
+		border-bottom: 0.1rem solid #c4c4c4;
+		padding: var(--sc-item-padding, 2.4rem 0);
+		display: flex;
+		align-items: center;
+		> img {
+			width: var(--sc-item-img-width, 14.8rem);
+			height: var(--sc-item-img-height, 18.8rem);
+			object-fit: contain;
+			background-color: #f6f6f6;
+		}
+		> .content {
+			flex: 1;
+			margin: var(--sc-item-content-margin, 0 4rem);
+			align-self: var(--sc-item-content-align-self);
+			> * {
+				margin-bottom: var(--sc-item-margin-bottom, 1.6rem);
+				&:last-child {
+					margin-bottom: 0;
+				}
+			}
+			> .title {
+				font-family: KaiseiOpti-Bold;
+				font-size: var(--sc-item-title-font-size, 2.4rem);
+				color: #232323;
+			}
+			> .brand {
+				display: flex;
+				align-items: center;
+				> .icon {
+					width: 2.4rem;
+					height: 2.4rem;
+					margin-right: 1rem;
+				}
+				> .text {
+					font-size: var(--sc-item-brand-font-size, 1.6rem);
+					text-decoration: underline;
+					color: #232323;
+				}
+			}
+			> .tags {
+				display: flex;
+				flex-wrap: wrap;
+				gap: 0.8rem;
+				> .tag {
+					min-width: var(--sc-item-tag-min-width, 8.8rem);
+					height: var(--sc-item-tag-height, 2.4rem);
+					line-height: var(--sc-item-tag-height, 2.4rem);
+					border-radius: var(--sc-item-tag-radius, 2.4rem);
+					font-size: var(--sc-item-tag-font-size, 1.4rem);
+					padding: var(--sc-item-tag-padding, 0 1rem);
+					text-align: center;
+					color: #8f8f8f;
+					background-color: #eee;
+				}
+			}
+			> .date {
+				display: flex;
+				align-items: center;
+				> .icon {
+					width: 2.4rem;
+					height: 2.4rem;
+					margin-right: 1rem;
+					color: #808080;
+				}
 
-      > .text {
-        font-family: KaiseiOpti-Regular;
-        font-size: 1.4rem;
-        color: #808080;
-      }
-    }
-  }
-  > .right {
-    align-self: var(--sc-item-right-align-self, end);
-    display: var(--sc-item-right-display);
-    flex-direction: var(--sc-item-right-flex-direction);
-    justify-content: var(--sc-item-right-justify-content);
-    align-items: var(--sc-item-right-align-items);
-    height: var(--sc-item-right-height);
-    margin-top: var(--sc-item-right-margin-top);
-    > .amount {
-      font-family: KaiseiOpti-Bold;
-      font-size: var(--sc-item-amount-font-size, 2.2rem);
-      color: #232323;
-      > span {
-        font-size: var(--sc-item-currency-font-size, 1.4rem);
-        color: #585858;
-        vertical-align: bottom;
-      }
-    }
-    > .remove {
-      margin-top: var(--sc-item-remove-margin-top, 9rem);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      user-select: none;
-      cursor: pointer;
-      > .icon {
-        width: 2rem;
-        height: 2rem;
-        margin-right: 0.4rem;
-      }
-      > .text {
-        font-family: KaiseiOpti-Regular;
-        font-size: 1.4rem;
-        color: #808080;
-      }
-    }
-  }
-  &.is-order-actions-layout {
-    display: grid;
-    grid-template-columns:
-      var(--sc-item-img-width, 14.8rem)
-      minmax(0, 1fr)
-      var(--sc-item-order-amount-width, 12rem)
-      var(--sc-item-order-action-width, 18rem);
-    column-gap: var(--sc-item-order-column-gap, 2rem);
+				> .text {
+					font-family: KaiseiOpti-Regular;
+					font-size: 1.4rem;
+					color: #808080;
+				}
+			}
+		}
+		> .right {
+			align-self: var(--sc-item-right-align-self, end);
+			display: var(--sc-item-right-display);
+			flex-direction: var(--sc-item-right-flex-direction);
+			justify-content: var(--sc-item-right-justify-content);
+			align-items: var(--sc-item-right-align-items);
+			height: var(--sc-item-right-height);
+			margin-top: var(--sc-item-right-margin-top);
+			> .amount {
+				font-family: KaiseiOpti-Bold;
+				font-size: var(--sc-item-amount-font-size, 2.2rem);
+				color: #232323;
+				> span {
+					font-size: var(--sc-item-currency-font-size, 1.4rem);
+					color: #585858;
+					vertical-align: bottom;
+				}
+			}
+			> .remove {
+				margin-top: var(--sc-item-remove-margin-top, 9rem);
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				user-select: none;
+				cursor: pointer;
+				> .icon {
+					width: 2rem;
+					height: 2rem;
+					margin-right: 0.4rem;
+				}
+				> .text {
+					font-family: KaiseiOpti-Regular;
+					font-size: 1.4rem;
+					color: #808080;
+				}
+			}
+		}
+		&.is-order-actions-layout {
+			display: grid;
+			grid-template-columns:
+				var(--sc-item-img-width, 14.8rem)
+				minmax(0, 1fr)
+				var(--sc-item-order-amount-width, 12rem)
+				var(--sc-item-order-action-width, 18rem);
+			column-gap: var(--sc-item-order-column-gap, 2rem);
 
-    > .content {
-      min-width: 0;
-    }
+			> .content {
+				min-width: 0;
+			}
 
-    > .right {
-      display: contents;
+			> .right {
+				display: contents;
 
-      > .amount {
-        grid-column: 3;
-        align-self: center;
-        white-space: nowrap;
-        transform: translateX(var(--sc-item-order-actions-offset, 0));
-      }
+				> .amount {
+					grid-column: 3;
+					align-self: center;
+					white-space: nowrap;
+					transform: translateX(var(--sc-item-order-actions-offset, 0));
+				}
 
-      .c-svg {
-        width: initial;
-        height: initial;
-      }
-      > .download {
-        grid-column: 4;
-        cursor: pointer;
-        transform: translateX(var(--sc-item-order-actions-offset, 0));
-      }
-    }
-  }
-}
+				.c-svg {
+					width: initial;
+					height: initial;
+				}
+				> .download {
+					grid-column: 4;
+					cursor: pointer;
+					transform: translateX(var(--sc-item-order-actions-offset, 0));
+				}
+			}
+		}
+	}
 </style>
diff --git a/src/views/shoppingCart/sc-list.vue b/src/views/shoppingCart/sc-list.vue
index 204dfc8..31d4bde 100644
--- a/src/views/shoppingCart/sc-list.vue
+++ b/src/views/shoppingCart/sc-list.vue
@@ -43,8 +43,7 @@
 				:key="v.id"
 				:info="v"
 				:show-tags="!isMini || isView"
-				:show-size="!isMini"
-				:show-size-date="!isMini"
+				:show-date="!isMini"
 				:show-remove="!isView"
 				@remove="handleRemoveClick"
 			>
@@ -54,12 +53,6 @@
 			</sc-item>
 		</div>
 		<div class="footer" v-if="isMini">
-			<div class="total size" v-show="isView">
-				<span class="label">Total File Size</span>
-				<span class="value"
-					>{{ allTotalSize.size }}<span>&nbsp;{{ allTotalSize.unit }}</span></span
-				>
-			</div>
 			<div class="total" v-show="list.length > 0 || isView">
 				<span class="label">Total</span>
 				<span class="value">${{ allAmount }}<span> HKD</span></span>
@@ -117,7 +110,6 @@
 			url: 'http://118.31.39.42:3000/falls/shopping-cart-1.png',
 			title: 'North Outfit Set',
 			brand: 'Roaming Clouds',
-			fileSize: 1024, // kb
 			date: '2026-5-20 5:20',
 			amount: 49.99,
 			tags: ['female', 'skirt', 'blouse', 'outwear'],
@@ -128,7 +120,6 @@
 			url: 'http://118.31.39.42:3000/falls/shopping-cart-2.png',
 			title: 'Weekend Drift Co-ord',
 			brand: 'Urban Line Edit',
-			fileSize: 1225, // kb
 			date: '2026-5-21 13:14',
 			amount: 9.99,
 			tags: ['female', 'skirt', 'blouse', 'outwear'],
@@ -139,7 +130,6 @@
 			url: 'http://118.31.39.42:3000/falls/shopping-cart-3.png',
 			title: 'Static Street Suit',
 			brand: 'Off Grid Apparel',
-			fileSize: 1024 * 18, // kb
 			date: '2026-5-21 13:14',
 			amount: 12,
 			tags: ['female', 'skirt', 'blouse', 'outwear'],
@@ -150,7 +140,6 @@
 			url: 'http://118.31.39.42:3000/falls/shopping-cart-4.png',
 			title: 'Maison Contour Suit',
 			brand: 'Ivory Muse Studio',
-			fileSize: 100, // kb
 			date: '2026-5-21 13:14',
 			amount: 18,
 			tags: ['female', 'skirt', 'blouse', 'outwear'],
@@ -161,7 +150,6 @@
 			url: 'http://118.31.39.42:3000/falls/shopping-cart-5.png',
 			title: 'Prime Atelier Set',
 			brand: 'Ivory Muse Studio',
-			fileSize: 1024 * 24, // kb
 			date: '2026-5-21 13:14',
 			amount: 20,
 			tags: ['female', 'skirt', 'blouse', 'outwear'],
diff --git a/src/views/wardrobe/Orders.vue b/src/views/wardrobe/Orders.vue
index 41e37c4..6baebb3 100644
--- a/src/views/wardrobe/Orders.vue
+++ b/src/views/wardrobe/Orders.vue
@@ -65,8 +65,7 @@
             class="order-card__item"
             :style="{ '--order-item-placeholder': item.color }"
             :info="item"
-            :show-size="false"
-            :show-size-date="false"
+            :show-date="false"
             :show-remove="false"
             order-actions-layout
           />