From 0a7be4b14b82f87985fb9359f1452e5c05eb99aa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E6=98=B1=E8=BE=BE?= Date: Mon, 17 Mar 2025 20:35:27 +0800 Subject: [PATCH] =?UTF-8?q?feat(icon):=20=E6=96=B0=E5=A2=9E=E4=B8=8B?= =?UTF-8?q?=E6=8B=89=E7=AE=AD=E5=A4=B4=E5=9B=BE=E6=A0=87=E5=B9=B6=E4=BC=98?= =?UTF-8?q?=E5=8C=96=E7=9B=B8=E5=85=B3=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增下拉箭头图标(xiala) - 优化YLSelect组件样式 - 更新公共样式文件，增加图标相关样式 - 修改字体文件，添加新图标 --- components.d.ts | 1 - src/assets/css/public.scss | 93 ++++++++++++++++++ src/components/YLSelect.vue | 15 +-- src/fonts/moblie/iconfont.css | 10 +- src/fonts/moblie/iconfont.js | 18 ++-- src/fonts/moblie/iconfont.json | 7 ++ src/fonts/moblie/iconfont.ttf | Bin 11288 -> 9576 bytes src/fonts/moblie/iconfont.woff | Bin 6092 -> 6164 bytes src/fonts/moblie/iconfont.woff2 | Bin 9160 -> 5196 bytes .../ActionCompoents/QuestionAction.vue | 21 ++-- .../QuestionItemAction/QuestionBefore.vue | 69 ++++++------- .../components/Questions/FileUpload.vue | 1 + src/views/Survey/views/Create/Index.vue | 20 ++-- 13 files changed, 179 insertions(+), 76 deletions(-) diff --git a/components.d.ts b/components.d.ts index a50d18f..bb994ba 100644 --- a/components.d.ts +++ b/components.d.ts @@ -32,7 +32,6 @@ declare module 'vue' { VanGrid: typeof import('vant/es')['Grid'] VanGridItem: typeof import('vant/es')['GridItem'] VanIcon: typeof import('vant/es')['Icon'] - VanList: typeof import('vant/es')['List'] VanNavBar: typeof import('vant/es')['NavBar'] VanPicker: typeof import('vant/es')['Picker'] VanPopup: typeof import('vant/es')['Popup'] diff --git a/src/assets/css/public.scss b/src/assets/css/public.scss index 4049809..c1cc89a 100644 --- a/src/assets/css/public.scss +++ b/src/assets/css/public.scss @@ -14,6 +14,7 @@ .van-popup--bottom.van-popup--round { border-radius: 10px 10px 0 0 !important; + background: #f2f2f2; } .van-radio-group { @@ -131,3 +132,95 @@ border-color: $theme-color; background-color: $theme-color; } + +.van-grid-item__content { + padding: 8px 10px; + border-radius: 10px; +} + +.yl-select { + position: relative; + overflow: hidden; + max-width: 95vw; +} + +.el-select__wrapper::after { + content: '\e65b'; + position: absolute; + top: 5px; + right: 10px; + font-size: 10px; +} + +.el-select__suffix { + display: none; +} + +// 自定义下拉箭头样式 +.el-select__caret { + color: $theme-color; // 修改箭头颜色 + font-size: 18px; // 修改箭头大小 + transform: rotate(0deg); // 修改箭头旋转角度（默认是0度，展开时会旋转180度） +} + +.el-cascader__tags .el-tag { + background: $theme-color; + color: #fff; +} + +.el-tag .el-tag__close { + color: #fff; +} + +.el-cascader-node.in-active-path, +.el-cascader-node.is-active, +.el-cascader-node.is-selectable.in-checked-path { + color: $theme-color; +} + +.el-checkbox__inner:hover { + border-color: $theme-color; +} + +.el-checkbox__input.is-checked .el-checkbox__inner, +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + border-color: $theme-color; + background: $theme-color; +} + +.el-input, +.el-input__wrapper { + background: #fafbfc; +} + +.el-select__caret.is-reverse { + transform: rotate(180deg); // 展开时旋转180度 +} + +.el-select { + border: none; +} + +.el-select__wrapper { + background: #fafbfc; +} + +.el-select-dropdown__item.is-selected { + color: $theme-color; +} + +.el-input__wrapper, +.el-select__wrapper { + box-shadow: none; +} + +.el-cascader .el-input.is-focus .el-input__wrapper, +.el-input__wrapper.is-focus, +.el-select__wrapper.is-focused, +.el-cascader:not(.is-disabled):hover .el-input__wrapper { + box-shadow: 0 0 0 0.0267rem $theme-color inset; + + &::after { + color: $theme-color; + } +} diff --git a/src/components/YLSelect.vue b/src/components/YLSelect.vue index d15c9a9..8d4d700 100644 --- a/src/components/YLSelect.vue +++ b/src/components/YLSelect.vue @@ -1,7 +1,7 @@ -
- 添加逻辑 +
+ 添加逻辑