feat:新增小视频卡comp组件样式(UI)

@@ -14,3 +14,5 @@ export { BottomNavigationComponent } from "./components/BottomNavigationComponen
 export { TopNavigationComponent } from "./components/TopNavigationComponent"
 export { TopNavigationComponent } from "./components/TopNavigationComponent"
 
 
 export { LabelComponent } from "./components/LabelComponent"
 export { LabelComponent } from "./components/LabelComponent"
+
+export { SmallVideoCardComponent } from "./components/SmallVideoCardComponent"

+import { CommonConstants } from 'wdConstant/src/main/ets/constants/CommonConstants'
+
+@Entry
+@Component
+export struct SmallVideoCardComponent {
+  build() {
+    Row() {
+      Column() {
+        Text('“畅享亚运”新模式活动打卡，看杭州打开“金角银边活动启动 跟着体育明星云打卡，看杭州打开“金角银边')
+          .fontWeight(400)
+          .fontSize($r('app.float.font_size_17'))
+          .maxLines(4)
+          .textOverflow({ overflow: TextOverflow.Ellipsis })
+          .fontColor($r('app.color.color_222222'))
+          .lineHeight(25)
+        Row() {
+          Text('人民日报')
+            .labelTextStyle()
+          Image($r('app.media.point'))
+            .width(16)
+            .height(16)
+          Text('20分钟前')
+            .labelTextStyle()
+            .margin({
+              right: 6
+            })
+          Text('2000评')
+            .labelTextStyle()
+        }
+      }
+      .height(156)
+      .layoutWeight(1)
+      .justifyContent(FlexAlign.SpaceBetween)
+      .alignItems(HorizontalAlign.Start)
+      .margin({ right: 12 })
+
+      Stack({ alignContent: Alignment.BottomEnd }) {
+        Image('https://www.harmonyos.com/resource/image/partner/harmonyos-connect/pic_shengtai_connect_qudao_xianxia.jpg')
+          .width(117)
+          .aspectRatio(117 / 156)
+          .border({ radius: 4 })
+        Row() {
+          Image($r('app.media.iv_card_play_yellow_flag'))
+            .width(22)
+            .height(18)
+          Text('10:00')
+            .fontSize($r('app.float.font_size_13'))
+            .fontWeight(400)
+            .fontColor($r('app.color.color_fff'))
+        }
+        .height(18)
+        .padding({ right: 4 })
+        .margin({
+          right: 4,
+          bottom: 4
+        })
+        .backgroundColor($r('app.color.color_4d000000'))
+      }
+    }
+    .width(CommonConstants.FULL_WIDTH)
+    .height(184)
+    .padding({
+      top: 14,
+      bottom: 14,
+      left: 16,
+      right: 16
+    })
+  }
+}
+
+@Extend(Text) function labelTextStyle() {
+  .fontSize($r('app.float.font_size_12'))
+  .fontWeight(400)
+  .fontColor($r('app.color.color_B0B0B0'))
+}

@@ -31,6 +31,14 @@
     {
     {
       "name": "color_B0B0B0",
       "name": "color_B0B0B0",
       "value": "#B0B0B0"
       "value": "#B0B0B0"
+    },
+    {
+      "name": "color_fff",
+      "value": "#ffffff"
+    },
+    {
+      "name": "color_4d000000",
+      "value": "#4d000000"
     }
     }
   ]
   ]
 }
 }

@@ -10,7 +10,11 @@
     },
     },
     {
     {
       "name": "font_size_12",
       "name": "font_size_12",
-      "value": "11fp"
+      "value": "12fp"
+    },
+    {
+      "name": "font_size_13",
+      "value": "13fp"
     },
     },
     {
     {
       "name": "font_size_14",
       "name": "font_size_14",
@@ -21,6 +25,10 @@
       "value": "16fp"
       "value": "16fp"
     },
     },
     {
     {
+      "name": "font_size_17",
+      "value": "17fp"
+    },
+    {
       "name": "normal_text_size",
       "name": "normal_text_size",
       "value": "16fp"
       "value": "16fp"
     },
     },