cover

src/modules/editor/components/CompUI/customUI/Covers/Cover2/component.tsx

@@ -14,7 +14,7 @@ export const Component = createUIComp({
     return () => (
       <div class={cx(rootStyles, "overflow-hidden")}>
         <div class="bg flex flex-col"></div>
-        <div class="relative z-1 overflow-hidden ">
+        <div class="relative z-1 overflow-hidden">
           <div class="mt-0.4rem h-1.2rem text-30px text-center text_main">
             <Text.Component compId={children.title.id} />
           </div>
@@ -36,7 +36,14 @@ export const Component = createUIComp({
               />
             </div>
           </div>
-          <div class="absolute"></div>
+        </div>
+        <div class="absolute top-5rem right-1.1rem text-stroke-dark-900 z-2">
+          <Text.Component compId={children.text1?.id} />
+          <Text.Component
+            class="mt-1rem text-right"
+            compId={children.text2?.id}
+          />
+          <div class="line"></div>
         </div>
       </div>
     );
@@ -61,4 +68,8 @@ const rootStyles = css`
       text-transform: uppercase;
     }
   }
+  .line {
+    height: 1px;
+    background: linear-gradient(to left, #000 1.2rem, #fff 1.2rem);
+  }
 `;

src/modules/editor/components/CompUI/customUI/Covers/Cover2/index.ts

@@ -5,26 +5,34 @@ export { Component } from "./component";
 
 export const { options, useCompData } = createOptions({
   name: "标题",
-  thumbnail: require("./thumbnail.jpg"),
+  thumbnail: require("@/assets/comps/Cover2/thumbnail.jpg"),
   value: {},
   children: {
     img1: {
       value: {
-        url: require("./img_1.png"),
+        url: require("@/assets/comps/Cover2/img_1.png"),
       },
     },
     img2: {
       value: {
-        url: require("./img_2.jpg"),
+        url: require("@/assets/comps/Cover2/img_2.jpg"),
       },
     },
     img3: {
       value: {
-        url: require("./img_3.jpg"),
+        url: require("@/assets/comps/Cover2/img_3.jpg"),
       },
     },
     title: {
-      value: `<p style="text-align:center;"><span style="color:hsl(0, 0%, 60%);font-size:28px;">NEW</span><span style="font-size:28px;"> &nbsp; &nbsp;FasHION</span></p><p>&nbsp;</p>`,
+      value: `<p style="text-align:center;"><span style="color:hsl(0,0%,60%);font-size:42px;">NEW &nbsp;</span><span style="font-size:42px;"> FasHION</span></p><p>&nbsp;</p>`,
+    },
+    text1: {
+      compKey: "Text",
+      value: `<p><span style="color:hsl(0,0%,100%);font-size:42px;"><strong>P190</strong></span></p><p><span style="color:hsl(0,0%,100%);font-size:20px;"><strong>全新 &nbsp; &nbsp; 时尚 &nbsp; &nbsp;</strong></span><span style="color:hsl(0,0%,0%);font-size:20px;"><strong>简约</strong></span></p>`,
+    },
+    text2: {
+      compKey: "Text",
+      value: `<p style="text-align:right;"><span style="color:hsl(0, 0%, 0%);">2023新品</span></p>`,
     },
   },
 });

src/modules/editor/components/CompUI/customUI/Titles/Title2/component.tsx

@@ -13,14 +13,14 @@ export const Component = createUIComp({
 
     return () => (
       <div class="flex items-center justify-center px-0.1rem">
-        <div class={cx(border, "left w-1rem text-0.34rem text-right")}>
+        <div class={cx(border, "left w-0.5rem text-0.34rem text-right")}>
           &frasl; &frasl;
         </div>
         <Text.Component
           class="px-0.5rem max-w-4.8rem"
           compId={children.title?.id}
         />
-        <div class={cx(border, "right w-1rem text-0.34rem")}>
+        <div class={cx(border, "right w-0.5rem text-0.34rem")}>
           &frasl; &frasl;
         </div>
       </div>

src/modules/editor/components/CompUI/customUI/Titles/Title2/index.tsx

@@ -7,6 +7,9 @@ export const { options, useCompData } = createOptions({
   name: "标题",
   thumbnail: require("./thumbnail.jpg"),
   value: {},
+  layout: {
+    padding: "0.5rem 0",
+  },
   children: {
     title: {
       value: `<p style="text-align:center;"><span style="color:#333;font-size:20px;font-weight: bold;">产品信息</span></p>`,