feat: account页面

src/views/wardrobe/index.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="wardrobe-page">
-    <section class="wardrobe-hero flex flex-col flex-center">
+    <div class="wardrobe-hero flex flex-col flex-center">
       <div class="wardrobe-hero__title">My Wardrobe</div>
       <div class="wardrobe-hero__subtitle">Your digital pieces, all in one place</div>
-    </section>
+    </div>
 
-    <section class="wardrobe-shell">
+    <div class="wardrobe-shell">
       <div class="wardrobe-tabs">
         <div class="wardrobe-tabs__nav" role="tablist" aria-label="Wardrobe tabs">
           <button
@@ -36,7 +36,7 @@
       </div>
 
       <component :is="activePanel" class="wardrobe-shell__panel" />
-    </section>
+    </div>
     <Footer />
   </div>
 </template>
@@ -105,7 +105,18 @@ const activePanel = computed(() => {
 
   .wardrobe-hero {
     height: 14.8rem;
-    background-color: #f5f5f5;
+    // background-color: #f5f5f5;
+    background: url('@/assets/images/background.png') no-repeat;
+    background-size: cover;
+    position: relative;
+    // &::before {
+    //   position: absolute;
+    //   top: 0;
+    //   right: 0;
+    //   bottom: 0;
+    //   left: 0;
+    //   background-color: rgba(0, 0, 0, 0.2);
+    // }
     .wardrobe-hero__title {
       margin: 0;
       font-family: 'KaiseiOpti-Bold';