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 @@ -
- 添加逻辑 +
+ 添加逻辑