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 | 54 +++++++++++++++++++++++++++++++++--------------------- 1 files changed, 33 insertions(+), 21 deletions(-) diff --git a/src/components/item-wrap/item-wrap.vue b/src/components/item-wrap/item-wrap.vue index 3f63d7f..e587200 100644 --- a/src/components/item-wrap/item-wrap.vue +++ b/src/components/item-wrap/item-wrap.vue @@ -1,9 +1,10 @@ <script setup lang="ts"> import BorderBox13 from "@/components/datav/border-box-13"; + const props = withDefaults( defineProps<{ // 鏍囬 - title: number | string; + title: number | string, }>(), { title: "", @@ -12,24 +13,27 @@ </script> <template> - <BorderBox13> - <div class="item_title" v-if="title !== ''"> - <div class="zuo"></div> - <span class="title-inner"> {{ title }} </span> - <div class="you"></div> - </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 - ></BorderBox13> + + <!-- 鍐呭鎻掓Ы --> + <slot></slot></div> + </template> <style scoped lang="scss"> $item-title-height: 38px; -$item_title_content-height: calc(100% - 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%; @@ -39,7 +43,7 @@ position: relative; display: flex; align-items: center; - justify-content: center; + //justify-content: center; .zuo, .you { @@ -52,16 +56,22 @@ transform: rotate(180deg); } .title-inner { - font-weight: 900; + margin-left: 25px; + margin-top: 4px; + color: #fff; + font-weight: 400; letter-spacing: 2px; - background: linear-gradient( - 92deg, - #0072ff 0%, - #00eaff 48.8525390625%, - #01aaff 100% - ); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; + 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; } } @@ -71,7 +81,9 @@ } .item_title_content { - height: $item_title_content-height; + //height: $item_title_content-height; + margin: 20px 0; + } .item_title_content_def { -- Gitblit v1.8.0