From 5300255dd40ac2ed67676da5568f0e4fd25a7078 Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期二, 05 三月 2024 13:33:46 +0800
Subject: [PATCH] fix:修改字体、图标、背景、阴影问题
---
src/components/item-wrap/item-wrap.vue | 92 ++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 85 insertions(+), 7 deletions(-)
diff --git a/src/components/item-wrap/item-wrap.vue b/src/components/item-wrap/item-wrap.vue
index d8c1dd3..e587200 100644
--- a/src/components/item-wrap/item-wrap.vue
+++ b/src/components/item-wrap/item-wrap.vue
@@ -1,15 +1,93 @@
-<script setup lang='ts'>
+<script setup lang="ts">
+import BorderBox13 from "@/components/datav/border-box-13";
+const props = withDefaults(
+ defineProps<{
+ // 鏍囬
+ title: number | string,
+ }>(),
+ {
+ title: "",
+ }
+);
</script>
<template>
- <div class='item-wrap'>
- </div>
+ <div class="item_title" v-if="title !== ''">
+ <span class="title-inner">{{ title }} </span>
+ </div>
+ <div
+ :class="title !== '' ? 'item_title_content' : 'item_title_content_def'"
+ >
+
+ <!-- 鍐呭鎻掓Ы -->
+ <slot></slot></div>
+
</template>
-<style scoped lang='scss'>
-.item-wrap{
- border: red dashed 1px;
+<style scoped lang="scss">
+$item-title-height: 38px;
+//$item_title_content-height: calc(100% - 38px);
+
+.item_title {
+ background-image: url("@/assets/img/candantop.png") ;
+ background-size: 231px 100%;
+ background-repeat: no-repeat;
+ height: $item-title-height;
+ line-height: $item-title-height;
+ width: 100%;
+ color: #31abe3;
+ text-align: center;
+ // background: linear-gradient(to right, transparent, #0f0756, transparent);
+ position: relative;
+ display: flex;
+ align-items: center;
+ //justify-content: center;
+
+ .zuo,
+ .you {
+ width: 58px;
+ height: 14px;
+ background-image: url("@/assets/img/titles/zuo.png");
+ }
+
+ .you {
+ transform: rotate(180deg);
+ }
+ .title-inner {
+ margin-left: 25px;
+ margin-top: 4px;
+ color: #fff;
+ font-weight: 400;
+ letter-spacing: 2px;
+ font-size: 20px;
+ font-style: italic;
+ font-family: '200-SSBoYaTi';
+ //background: linear-gradient(
+ // 92deg,
+ // #0072ff 0%,
+ // #00eaff 48.8525390625%,
+ // #01aaff 100%
+ //);
+ //-webkit-background-clip: text;
+ //-webkit-text-fill-color: transparent;
+ }
}
-</style>
\ No newline at end of file
+
+:deep(.dv-border-box-content) {
+ box-sizing: border-box;
+ padding: 6px 16px 0px;
+ }
+
+.item_title_content {
+ //height: $item_title_content-height;
+ margin: 20px 0;
+
+}
+
+.item_title_content_def {
+ width: 100%;
+ height: 100%;
+}
+</style>
--
Gitblit v1.8.0