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 | 66 +++++++++++++++++++-------------
1 files changed, 39 insertions(+), 27 deletions(-)
diff --git a/src/components/item-wrap/item-wrap.vue b/src/components/item-wrap/item-wrap.vue
index b1e37f7..e587200 100644
--- a/src/components/item-wrap/item-wrap.vue
+++ b/src/components/item-wrap/item-wrap.vue
@@ -1,40 +1,39 @@
<script setup lang="ts">
+import BorderBox13 from "@/components/datav/border-box-13";
+
const props = withDefaults(
defineProps<{
// 鏍囬
- title: number | string;
+ title: number | string,
}>(),
{
title: "",
}
);
-
</script>
<template>
- <div class="item-wrap">
- <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>
- </div>
+
+ <!-- 鍐呭鎻掓Ы -->
+ <slot></slot></div>
+
</template>
<style scoped lang="scss">
-.item-wrap {
- // border: red dashed 1px;
- box-sizing: border-box;
-}
$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%;
@@ -44,7 +43,7 @@
position: relative;
display: flex;
align-items: center;
- justify-content: center;
+ //justify-content: center;
.zuo,
.you {
@@ -57,21 +56,34 @@
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;
}
}
+:deep(.dv-border-box-content) {
+ box-sizing: border-box;
+ padding: 6px 16px 0px;
+ }
+
.item_title_content {
- height: $item_title_content-height;
+ //height: $item_title_content-height;
+ margin: 20px 0;
+
}
.item_title_content_def {
--
Gitblit v1.8.0