iov-ui v1.2.68

iov-ui

官方文档

npm install iov-ui -S

使用时遵循百度小程序规范，先在 json 中引入，然后直接在 swan 中使用。

{
    "navigationBarTitleText": "智能小程序官方组件",
    "usingComponents": {
        "iov-button": "iov-ui/lib/button"
    }
}

<iov-button>确认</iov-button>

发布记录

• 1.2.67
  • 去掉日期弹窗阴影
• 1.2.65
  • textfield修复输入框focus事件失效问题 导致phone填充后依然高亮
• 1.2.64
  • 日历组件语音注册bug修复
• 1.2.63
  • tabs 快速点击切换跳动问题优化
• 1.2.62
  • tabs 快速点击切换跳动问题
• 1.2.61
  • preview-image 图片预览问题
• 1.2.60
  • slider 数字覆盖，位置偏移问题
• 1.2.59
  • preview-image 图片预览点击默认第一张问题
• 1.2.58
  • 修复日历组件样式问题
• 1.2.57
  • 修复日历组件分页页数问题
• 1.2.56
  • 新增日历组件分页加载
  • 新增日历组件加载loading
• 1.2.55
  • 去掉button行高
• 1.2.54
  • titlebar 空标题问题
• 1.2.53
  • preview-image 滑动屏幕未暂停问题
• 1.2.52
  • fix 处理 layout-con 组件同时注册多个 voice-type 问题 (layout-con组件包含两个scroll-view组件，如果两个组件同时注册voice-type 会导致语音不执行，当前改动使这个组件只能存在一个voice-type)
• 1.2.51
  • solution-card-layout height兼容
• 1.2.48 - 1.2.50
  • preview-image 新增图片预览手势放大缩小优化
• 1.2.47
  • preview-image 新增图片预览双指放大
• 1.2.46
  • slider max<20 会拖出min外的问题
  • slider 增加滑块上方价格隐藏tag
  • preview-image 新增可显示title和左右切换按钮
• 1.2.45
  • modal 语音指令扩展
• 1.2.44
  • card 新增no-voice-zone区域
• 1.2.43
  • card ui调整
• 1.2.38 - 1.2.42
  • card ui调整
• 1.2.34 - 1.2.38
  • card 增加vtsTag
  • tts 优化
• 1.2.25 - 1.2.33
  • iov-titlebar 优化
  • error-page 优化
• 1.2.24
  • slider滑块展示优化
• 1.2.23
  • 新增error-page 页面
• 1.2.20 - 1.2.22
  • 新增solution-card-layout组件
  • 修改solution-titlebar组件
  • 增加icon
• 1.2.19
  • layout-con扩展
• 1.2.16 - 1.2.18
  • 轻卡片下单支持点击
• 1.2.15
  • democar 新增icon
• 1.2.13 - 1.2.14
  • 轻卡片大版本升级
• 1.2.00 - 1.2.13
  • 轻卡片大版本升级
• 1.1.43
  • 不能输入是置灰
• 1.1.42
  • sidebar 确保位置计算出来才显示
• 1.1.41
  • 图片预览支持语音指令
• 1.1.40
  • sidebar 新增内容为空不显示下拉框
• 1.1.39
  • textfield 增加确定按钮，点击确定触发回车
• 1.1.37
• 1.1.38
  • titlebar 气泡展示优化
• 1.1.37
  • titlebar 气泡重复展示问题
• 1.1.36
  • 改变 slider 滑块最右值与最大值重叠问题
• 1.1.35
  • 添加滚动收起键盘
• 1.1.34
  • 添加双容器滚动事件文档描述
• 1.1.33
  • searchBar 键盘输入问题 bug 修复
• 1.1.32
  • titleBarTag 的 bug 修复
• 1.1.31
  • 部分组件将语音的 vsl 传出
• 1.1.30
  • titleBarTag 的 bug 修复
• 1.1.28 ~ 1.1.29
  • 已知 bug 修复、样式优化
• 1.1.27
  • searchbar 增加 maxlength
• 1.1.26
  • 区分点击 Confirm 按钮是否关闭 modal
• 1.1.24
  • 修复定位气泡显示
• 1.1.23
  • 修复 titlebar 登录状态切换头像显示的 bug
• 1.1.22
  • textfield 输入框语音输入时，点击叉按钮获取不到失去焦点 bug
• 1.1.21
  • slider 俩个滑块在最右重叠不能滑动问题 bug
• 1.1.20
  • carlife 上监听点击回车关闭键盘
• 1.1.17-1.1.19
  • modal 引导语优化
• 1.1.16
  • titlebar css 优化
• 1.1.13-1.1.15
  • 配置引导语回调参数
• 1.1.12
  • modal 传递 url 参数给宿主
• 1.1.11
  • sidebar 位置跳动问题 bug
• 1.1.10
  • madal voice-type 改为 cancel
• 1.1.09
  • tabs 传递 url 参数给宿主
• 1.1.06-1.1.08
  • sidebar 位置跳动问题 bug
• 1.1.05
  • titlebar bug 修复
• 1.1.01 - 1.1.04
  • 文档修改
• 1.1.00
  • slider bug 修复
• 1.0.99
  • input 新增 isForceGetPhone 当 input 有值时，是否显示自动填写手机号码
• 1.0.98
  • icon 新增优惠券图标

小程序目前分两个版本，支持换肤和自适应+换肤。支持自适应+换肤的版本号在 1.0.3 以上版本,仅支持换肤的是 0.0.100 以上版本。两个版本的主题文件也不一样。

• 支持自适应 2.0 和换肤 theme.css 文件

/* 标准小程序主题配置 */
:root {
    /* 系统颜色 */
    /* 页面背景色 */
    --colorBackground: rgb(11, 15, 22);
    /* 表层色1 */
    --colorSurface1: rgb(27, 32, 44);
    /* 表层色2 */
    --colorSurface2: rgb(43, 50, 67);
    /* 表层色3 */
    --colorSurface3: unset;

    /* 功能色 */
    /* 1级功能色 */
    --colorPrimary1: linear-gradient(0deg, rgb(190, 71, 48), rgb(186, 100, 20));
    /* 1级功能色2, 主题色非渐变 */
    --colorPrimary2: rgb(190, 71, 48);
    /* 1级功能色3 */
    --colorPrimary3: rgba(0, 128, 145, 0.3);
    /* 2级功能色1 */
    --colorSecondary1: rgb(60, 67, 90);
    /* 2级功能色2 */
    --colorSecondary2: rgba(7, 13, 30, 0.15);
    /* 2级功能色3 */
    --colorSecondary3: rgb(54, 60, 78);
    /* 3级功能色 */
    --colorTertiary1: rgba(255, 255, 255, 0.7);
    /* 常用在边框，分割线颜色 */
    --colorTertiary2: rgba(227, 239, 255, 0.1);

    /* 状态色 */

    /* 成功色 */
    --colorSucceed: rgb(0, 249, 208);
    /* 警戒色 */
    --colorWarning: rgb(145, 50, 50);
    /* 强调色 */
    --colorImportant: rgb(253, 142, 36);

    /* 通用字体颜色 */
    --colorTextNormal: rgb(255, 255, 255);
    /* 辅助字体颜色 */
    --colorTextCaptioon: rgba(255, 255, 255, 0.5);
    /* 高亮文字颜色---- true */
    --icolorTextHighlight: rgb(35, 180, 209);
    /* 链接文字颜色---- 外卖、酒店、洗车、订座、加油 */
    --icolorTextLink: rgb(35, 95, 209);
    /* 成功状态颜色---- 景点、酒店、电影、停车、订座、加油 */
    --icolorTextSucceed: rgb(47, 235, 164);
    /* 警告状态颜色----  订座、停车、电影、酒店、外卖、景点、加油*/
    --icolorTextWarning: rgb(255, 81, 84);
    /*滚动条滑块颜色*/
    --colorScrollRailNor: rgba(82, 88, 104, 1);
    /*滚动条轨道颜色*/
    --colorScrollGapNor: unset;
    /*滚动条滑块颜色*/
    --borderScrollWidth: 0.04rem;
    /*滚动条轨道颜色*/
    --borderScrollRadius: 0.04rem;

    /* 用于运营类等一级大标题 */
    --ifontsizeH1: 0.56rem;
    /* 运营类二级大标题 */
    --ifontsizeH2: 0.48rem;
    /* 用于常规标题如导航、标题栏 */
    --ifontsizeTitle1: 0.4rem;
    /* 常规标题2 */
    --ifontsizeTitle2: 0.36rem;
    /* 操作类标题 */
    --ifontsizeOperation: 0.32rem;
    /* 一级内容、操控类（Tab、弹窗标题、列表标题等 */
    --ifontsizeC1: 0.36rem;
    /* 二级内容（二级导航、按钮） */
    --ifontsizeC2: 0.32rem;
    /* 三级级内容 */
    --ifontsizeC3: 0.28rem;
    /* 辅助类文案,内容（列表）,比如输入出错提示 */
    --ifontsizeCaption1: 0.24rem;
    /* 仅用于标签（谨慎使用） */
    --ifontsizeCaption2: 0.2rem;

    /* 异形屏参数 */
    /* 异形屏，屏幕上方弧线垂直方向大小 */
    --screenArcTop: 0px;
    /* 异形屏，屏幕右方弧线水平方向大小 */
    --screenArcRight: 595px;
    /* 异形屏，屏幕下方弧线垂直方向大小 */
    --screenArcBottom: 0px;
    /* 异形屏，屏幕左方弧线水平方向大小 */
    --screenArcLeft: 0px;

    /*textfield 颜色*/
    /*textfield 普通*/
    --colorTextfieldBgNor: rgba(255, 255, 255, 0.1);
    --colorTextfieldTextNor: rgb(99, 106, 123);
    /* --colorTextfieldBgNor: ; 光标颜色 */
    --colorTextfieldBorderNor: rgba(255, 255, 255, 0.5);
    --textfieldBorder: 0.02rem solid var(--colorTextfieldBorderNor);
    --textfieldBorderBottom: 0.02rem solid var(--colorTextfieldBorderNor);

    /*textfield 输入状态*/
    --colorTextfieldBgInput: rgba(7, 13, 30, 0.15);
    --colorTextfieldTextInput: rgb(255, 255, 255);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldInput: rgb(53, 225, 255);
    /*textfield Pressed状态*/
    --colorTextfieldBgPre: unset;
    --colorTextfieldTextPre: rgba(255, 255, 255, 0.5);
    --colorTextfieldBorderPre: rgba(255, 255, 255, 0.5);

    /*textfield Error状态*/
    --colorTextfieldTexErr: rgb(255, 255, 255);
    --colorTextfieldBgError: rgba(7, 13, 30, 0.15);
    --colorTextfieldTextError: rgb(255, 255, 255);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldBorderError: rgb(145, 50, 50);

    /*textfield Disable状态*/
    --colorTextfieldTexDis: rgba(255, 255, 255, 0.3);
    --colorTextfieldBgDis: rgba(29, 34, 50, 0.5);
    --colorTextfieldTextDis: rgb(99, 106, 123);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldBorderDis: rgba(255, 255, 255, 0.5);

    /* tag 组件颜色 */
    /* tag Succed */
    --colorTagSucceedBg: unset;
    --colorTagSucceedBorder: rgb(121, 237, 220);
    --colorTagSucceedText: rgb(121, 237, 220);
    /* tag Warning */
    --colorTagWarningBg: unset;
    --colorTagWarningBorder: rgb(238, 65, 65);
    --colorTagWarningText: rgb(238, 65, 65);
    /* tag Hint */
    --colorTagHintBg: unset;
    --colorTagHintBorder: rgb(205, 220, 255);
    --colorTagHintText: rgb(205, 220, 255);
    /* tag Highlight */
    --colorTagHighlightBg: unset;
    --colorTagHighlightBorder: rgb(230, 182, 131);
    --colorTagHighlightText: rgb(230, 182, 131);

    /* button 按钮颜色*/

    /* Real 普通状态 */
    --colorRealbtnBgNor: linear-gradient(180deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorRealbtnBorderNor: unset;
    --colorRealbtnTextNor: rgb(255, 255, 255);
    /* Real 点击状态*/
    --colorRealbtnBgPre: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorRealbtnBorderPre: unset;
    --colorRealbtnTextPre: rgb(255, 255, 255);
    /* Real 禁用状态*/
    --colorRealbtnBgDis: linear-gradient(0deg, rgba(35, 180, 209, 0.5), rgba(0, 91, 102, 0.5));
    --colorRealbtnBorderDis: unset;
    --colorRealbtnTextDis: rgba(255, 255, 255, 0.5);

    /* Ghost btn 普通状态 */
    --colorGhostbtnBgNor: linear-gradient(0deg, rgba(7, 13, 30, 0.15), rgba(7, 13, 30, 0.15));
    --colorGhostbtnBorderNor: rgb(83, 90, 113);
    --colorGhostbtnTextNor: rgb(255, 255, 255);
    /* Ghost 点击状态*/
    --colorGhostbtnBgPre: linear-gradient(0deg, rgba(7, 13, 30, 0.15), rgba(7, 13, 30, 0.15));
    --colorGhostbtnBorderPre: rgb(83, 90, 113);
    --colorGhostbtnTextPre: rgb(35, 180, 209);
    /* Ghost 禁用状态*/
    --colorGhostbtnBgDis: rgba(7, 13, 30, 0.05);
    --colorGhostbtnBorderDis: rgba(83, 90, 113, 0.5);
    --colorGhostbtnTextDis: rgba(255, 255, 255, 0.5);

    /* Flat btn 普通状态 */
    --colorFlatTextbtnBgNor: transparent;
    --colorFlatTextbtnBorderNor: transparent;
    --colorFlatTextbtnNor: rgb(35, 180, 209);
    /* Flat 点击状态*/
    --colorFlatTextbtnBgPre: rgba(255, 255, 255, 0.15);
    --colorFlatTextbtnBorderPre: transparent;
    --colorFlatTextbtnPre: rgb(35, 180, 209);
    /* Flat 禁用状态*/
    --colorFlatTextbtnBgDis: transparent;
    --colorFlatTextbtnBorderDis: transparent;
    --colorFlatTextbtnDis: rgba(35, 180, 209, 0.5);

    /* ui 未提供样式*/

    --ibtnSmallLinehight: 0.6rem;
    --ibtnRealBgc: unset;
    --ibtnRealBorderRadius: 0.04rem;
    --ibtnRealBorderWidth: 0.02rem;
    --ibtnGhostBgi: unset;
    /* --ibtnGhostBorderRadius: 4px; */
    --ibtnGhostBorderWidth: 0.02rem;
    /* --ibtnFlatBorderRadius: 4px; */
    --ibtnFlatBorderWidth: 0.02rem;

    /* slider变量 */
    /* normal*/
    --colorSliderThumbNor: linear-gradient(0deg, rgb(214, 249, 255), rgb(174, 244, 255));
    --colorSliderThumbBorderNor: unset;
    --colorSliderRailNor: linear-gradient(90deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorSliderGapNor: rgba(255, 255, 255, 0.3);
    /* Pressed */
    --colorSliderThumbPre: linear-gradient(0deg, rgb(214, 249, 255), rgb(174, 244, 255));
    --colorSliderThumbBorderPre: unset;
    --colorSliderRailPre: linear-gradient(0deg, rgb(214, 249, 255), rgb(174, 244, 255));
    /* Disable*/
    --colorSliderThumbDis: linear-gradient(0deg, rgba(78, 91, 93, 1), rgba(51, 66, 69, 1));
    --colorSliderRailDis: linear-gradient(0deg, rgba(214, 249, 255, 0.24), rgba(174, 244, 255, 0.24));
    --colorSliderGapDis: rgba(100, 103, 113, 0.3);

    --iSliderBlockSize: 0.324rem;
    --isliderBlockMarginHalfSize: -0.162rem;
    --isliderBlockHalfSize: 0.162rem;
    --isliderBlockShadow: 0.05rem 0 0.1rem 0 rgba(0, 0, 0, 0.5);
    --isliderLineHeight: 0.06rem;
    --isliderTapAreaHeight: 0.72rem;
    --isliderBlockActiveShadowOpatity: 0.3;
    --isliderBlockActiveShadowSize: 0.72rem;
    --isliderBlockMarginSize: -0.2rem;

    /* searchbar 颜色*/
    /* Normal */
    --colorSearchbarBgNor: rgba(255, 255, 255, 0.1);
    --colorSearchbarBorderNor: rgba(255, 255, 255, 0.5);
    --colorSearchbarTextNor: rgb(99, 106, 123);
    /* Pressed */
    --colorSearchbarBgPre: unset;
    --colorSearchbarBorderPre: unset;
    --colorSearchbarTextPre: unset;
    /* Inputting */
    --colorSearchbarBgInputting: rgba(255, 255, 255, 0.1);
    --colorSearchbarCsr: rgb(35, 180, 209);
    --colorSearchbarBorderInputting: rgba(191, 206, 239, 1);
    --colorSearchbarInputting: rgba(255, 255, 255, 1);
    /* radio */
    /* 选中状态 */
    --colorRadioSelThumbBgNor: linear-gradient(0deg, rgb(214, 249, 255), rgb(174, 244, 255));
    --colorRadioSelThumbBorderNor: unset;
    --colorRadioSelBaseBgNor: rgb(23, 102, 114);
    --colorRadioSelBaseBorderNor: rgb(35, 180, 209);
    /* 选中Pressed状态 */
    --colorRadioSelThumbBgPre: unset;
    --colorRadioSelThumbBorderPre: unset;
    --colorRadioSelBaseBgPre: unset;
    --colorRadioUnselBaseBorderPre: unset;
    /* 未选中状态 */
    --colorRadioUnselThumbBgNor: unset;
    --colorRadioUnselThumbBorderNor: unset;
    --colorRadioUnselBaseBgNor: rgb(48, 54, 69);
    --colorRadioUnselBaseBorderNor: rgb(96, 109, 138);

    /* 选中禁用状态 */
    --colorRadioSelThumbBgDis: linear-gradient(0deg, rgba(214, 249, 255, 0.5), rgba(174, 5244, 255, 0.5));
    --colorRadioSelThumbBorderDis: unset;
    --colorRadioSelBaseBgDis: rgbargb(23, 102, 114, 0.5);
    --colorRadioUnselBaseBorderDis: linear-gradient(0deg, rgba(120, 137, 173, 0.5), rgba(96, 109, 138, 0.5));
    /* 未选中禁用状态 */
    --colorRadioUnselThumbBgDis: unset;
    --colorRadioUnselThumbBorderDis: unset;
    --colorRadioUnselBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorRadioUnselBaseBorderDis: unset;

    /* Checkbox */
    /* 选中状态 */
    --colorCheckboxSelThumbNor: rgba(255, 255, 255, 1);
    --colorCheckboxSelBaseBgNor: rgba(48, 54, 69, 1);
    --colorCheckboxSelBaseBorderNor: unset;
    /* 选中Pressed状态 */
    --colorCheckboxSelThumbPre: unset;
    --colorCheckboxSelBaseBgPre: unset;
    --colorCheckboxSelBaseBorderPre: unset;
    /* 未选中状态 */
    --colorCheckboxUnselThumbNor: linear-gradient(0deg, rgba(214, 249, 255, 1), rgba(174, 244, 255, 1));
    --colorCheckboxUnselBaseBgNor: rgba(23, 102, 114, 1);
    --colorCheckboxUnselBaseBorderNor: linear-gradient(0deg, rgba(35, 180, 209, 1), rgba(0, 91, 102, 1));
    /* 未选中Pressed状态 */
    --colorCheckboxUnselThumbPre: unset;
    --colorCheckboxUnselBaseBgPre: unset;
    --colorCheckboxUnselBaseBorderPre: unset;
    /* 选中禁用状态 */
    --colorCheckboxSelThumbDis: rgba(255, 255, 255, 0.5);
    --colorCheckboxSelBaseBgDis: rgba(23, 102, 114, 0.5);
    --colorCheckboxSelBaseBorderDis: linear-gradient(0deg, rgba(214, 249, 255, 0.5), rgba(174, 244, 255, 0.5));
    /* 未选中禁用状态 */
    --colorCheckboxUnselThumbDis: linear-gradient(0deg, rgba(214, 249, 255, 0.5), rgba(174, 244, 255, 0.5));
    --colorCheckboxUnselBaseBgDis: rgba(48, 54, 69, 0.5);
    --colorCheckboxUnselBaseBorderDis: linear-gradient(0deg, rgba(35, 180, 209, 0.5), rgba(0, 91, 102, 0.5));
    /* loadingbar变量 */
    --colorProgIndeterminateRail: rgba(255, 255, 255, 0.3);
    --colorProgDeterminateRail: rgba(255, 255, 255, 0.3);
    --colorProgIndeterminateGap: linear-gradient(-90deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorProgDeterminateGap: linear-gradient(-90deg, rgb(35, 180, 209), rgb(0, 91, 102));
    /* loading circle */
    --colorProgCircularRail: rgb(255, 255, 255);
    --colorProgCircularGap: rgba(255, 255, 255, 0.3);

    /* 纵向tabs变量 */
    --colorTabsVerticalSelNor: rgb(35, 180, 209);
    --colorTabsVerticalSelBaseBgNor: linear-gradient(90deg, rgba(53, 229, 255, 0.15), rgba(53, 229, 255, 0));
    --colorTabsVerticalSelBaseBorderNor: unset;
    --colorTabsVerticalSelTextNor: rgb(255, 255, 255);
    --colorTabsVerticalUnselTextNor: rgba(255, 255, 255, 0.5);
    /* Vertical Pressed 状态下 */
    --colorTabsVerticalSelTextPre: rgb(35, 180, 209);
    --colorTabsVerticalUnselPre: rgb(35, 180, 209);
    --colorTabsVerticalUnselBaseBgPre: linear-gradient(90deg, rgba(53, 229, 255, 0.15), rgba(53, 229, 255, 0));
    --colorTabsVerticalUnselBaseBorderPre: unset;
    --colorTabsVerticalUnselBasePre: unset;
    --colorTabsVerticalUnselTextPre: rgba(255, 255, 255, 1);
    /* Horizontal Pressed 状态下 */
    --colorTabsHorizontalSelTextPre: rgb(30, 180, 209);
    /* Horizontal 未选中Pressed 状态下 */
    --colorTabsHorizontalUnselBasePre: unset;
    --colorTabsHorizontalUnselTextPre: rgba(255, 255, 255);
    --colorTabsHorizontalUnselBaseBgPre: unset;
    --colorTabsHorizontalUnselBaseBorderPre: rgb(30, 180, 209);
    /* Horizontal normal */
    --colorTabsHorizontalSelNor: unset;
    --colorTabsHorizontalSelBaseBgNor: linear-gradient(90deg, rgba(53, 229, 255, 0.15), rgba(53, 229, 255, 0));
    --colorTabsHorizontalSelBaseBgDis: linear-gradient(90deg, rgba(53, 229, 255, 0.1), rgba(53, 229, 255, 0));
    --colorTabsHorizontalSelBaseBorderNor: unset;
    /* 横向tabs变量 */
    --colorTabsHorizontalSelTextNor: rgb(30, 180, 209);
    --colorTabsHorizontalUnselTextNor: rgba(255, 255, 255, 0.5);
    /* tabs禁用状态变量 */
    --colorTabsVerticalSelDis: rgba(35, 180, 209, 0.3);
    --colorTabsVerticalSelBaseBgDis: linear-gradient(90deg, rgba(53, 229, 255, 0.1), rgba(53, 229, 255, 0));
    --colorTabsVerticalSelBaseBorderDis: unset;
    --colorTabsVerticalSelBaseDis: unset;
    --colorTabsVerticalUnselDis: rgba(35, 180, 209, 24);
    --colorTabsVerticalUnselBaseDis: unset;
    --colorTabsVerticalUnselBaseBgDis: unset;
    --colorTabsVerticalUnselBaseBorderDis: unset;
    --colorTabsVerticalSelTextDis: rgba(35, 180, 209, 0.24);
    --colorTabsVerticalUnselTextDis: rgba(255, 255, 255, 0.24);
    --colorTabsHorizontalSelTextDis: rgba(30, 180, 209, 0.24);
    --colorTabsHorizontalUnselTextDis: rgba(255, 255, 255, 0.24);
    --colorTabsHorizontalelBaseBgDis: linear-gradient(90deg, rgba(53, 229, 255, 0.1), rgba(53, 229, 255, 0));
    --colorTabsHorizontalelBaseBorderDis: unset;
    --colorTabsHorizontalUnselDis: rgba(35, 180, 209, 0.24);
    --colorTabsHorizontalUnselBaseBgDis: unset;
    --colorTabsHorizontalUnselBaseBorderDis: unset;
    /* ui未提供变量 */
    --itabsVerticalWidth: 0.02rem;
    --itabsVerticalHeight: 100%;
    --itabsVerticalTop: 0;

    /* switch选中状态变量 */
    --colorSwitchOnBaseBgNor: rgba(48, 54, 69, 1);
    --colorSwitchOnThumbBgNor: linear-gradient(0deg, rgb(214, 249, 255), rgb(174, 244, 255));
    --colorSwitchOnBaseBorderNor: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorSwitchOnThumbBorderNor: unset;
    /* switch选中Pressed状态变量 */
    --colorSwitchOnThumbBgPre: unset;
    --colorSwitchOnThumbBorderPre: unset;
    --colorSwitchOnBaseBgPre: unset;
    --colorSwitchOnBaseBorderPre: unset;
    /* switch未选中状态变量 */
    --colorSwitchOffThumbBorderNor: unset;
    --colorSwitchOffBaseBorderNor: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    /* switch未选中Pressed状态变量 */
    --colorSwitchOffThumbBgPre: unset;
    --colorSwitchOffThumbBorderPre: unset;
    --colorSwitchOffBaseBgPre: unset;
    --colorSwitchOffBaseBorderPre: unset;
    --colorSwitchOffBaseBgNor: rgba(23, 102, 114, 1);
    --colorSwitchOffThumbBgNor: linear-gradient(0deg, rgb(228, 231, 238), rgb(201, 207, 222));
    /* switch禁用状态变量 */
    --colorSwitchOnThumbBgDis: linear-gradient(0deg, rgba(214, 249, 255, 0.5), rgba(174, 244, 255, 0.5));
    --colorSwitchOnBaseBgDis: rgba(23, 102, 114, 0.3);
    --colorSwitchOnBaseBorderDis: linear-gradient(0deg, rgba(35, 180, 209, 0.5), rgba(0, 91, 102, 0.5));
    --colorSwitchOffThumbBgDis: linear-gradient(0deg, rgba(228, 231, 238, 0.5), rgba(201, 207, 222, 0.5));
    --colorSwitchOffBaseBgDis: rgba(48, 54, 69, 0.5);
    --colorSwitchOffThumbBorderDis: unset;
    --colorSwitchOffBaseBorderDis: linear-gradient(0deg, rgba(120, 137, 173, 0.5), rgba(96, 109, 138, 0.5));
    /* ui未提供变量 */
    --iswitchTrackShadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
    --iswitchOnTrackBorderColor: #fff7ee80;
    --iswitchOffTrackBorderColor: #9cb3db80;

    /* 弹窗 Normal */
    --colorDialogBg: rgb(43, 50, 67);
    --colorDialogBorder: rgba(177, 206, 49, 1);
    --colorDialogTiltle: rgba(255, 255, 255, 1);
    --colorDialogText: rgba(255, 255, 255, 1);
    --colorDiaologBtnBgNor: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorDiaologBtnTextNor: rgba(255, 255, 255, 1);
    --colorDialogBtnBorderNor: unset;
    --positionDialogTiltle: center;
    --highlightDialogBtn: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorDiaologBtnBorderNor: unset;

    /* 弹窗 Pressed */
    --colorDiaologBtnBgPre: linear-gradient(0deg, rgb(35, 180, 209), rgb(0, 91, 102));
    --colorDialogBtnBorderPre: unset;
    --colorDiaologBtnTextPre: rgba(255, 255, 255, 1);

    /* 弹窗 Disable */
    --colorDiaologBtnBgDis: linear-gradient(0deg, rgba(35, 180, 209, 0.5), rgba(0, 91, 102, 0.5));
    --colorDiaologBtnBorderDis: unset;
    --colorDiaologBtnTextDis: rgba(255, 255, 255, 0.3);

    /* 弹窗 对齐方式 */
    /* 垂直对齐方式 */
    --diaologAlignItems: center;
    /* 水平对齐方式 */
    --diaologJustifyContent: center;

    /* 筛选菜单 Normal */
    /*筛选菜单圆角*/
    --colorMenuRadius: 0.08rem;
    --colorMenuUnselBg: rgb(57, 64, 75);
    --colorMenuSubUnselBg: rgb(45, 54, 69);
    --colorMenuTextUnselNor: rgba(255, 255, 255, 1);
    --colorMenuTextSubUnselNor: rgba(255, 255, 255, 0.5);
    --colorMenuSelBg: linear-gradient(90deg, rgb(57, 64, 75), rgb(45, 54, 69));
    --colorMenuTextSelNor: rgb(35, 180, 209);
    --colorMenuSubSelBg: rgb(45, 54, 69);
    --colorMenuTextSubSelNor: rgb(35, 180, 209);
    /* 筛选菜单 pressed */
    --colorMenuTextUnselPre: unset;
    --colorMenuTextSubUnselPre: rgba(255, 255, 255, 0.5);
    --colorMenuTextSelPre: rgb(35, 180, 209);
    --colorMenuTextSubSelPre: rgb(35, 180, 209);
    /* 筛选菜单 Disable */
    --colorMenuTextUnselDis: unset;
    --colorMenuTextSubUnselDis: unset;
    --colorMenuTextSelDis: unset;
    --colorMenuTextSubSelDis: unset;

    /* tag-select 样式 */
    /* 边框大小 */

    --borderOptiontagSel: 0.02rem;
    --cornerOptiontagSel: 0.04rem;

    /* 选中状态背景 */
    --colorOptiontagSelBgNor: rgba(23, 102, 114, 0.3);
    /* 选中状态边框 */
    --colorOptiontagSelBorderNor: linearfcolorOptiontagSelBorderNor-gradient(0deg, rgb(35, 180, 209), rgba(0, 91, 102));
    /* 选中状态文字 */
    --colorOptiontagSelTextNor: rgba(35, 180, 209, 1);
    /* 选中Pressed状态背景 */
    --colorOptiontagSelBgPre: rgba(23, 102, 114, 0.3);
    --colorOptiontagSelBorderPre: linear-gradient(0deg, rgb(35, 180, 209), rgba(0, 91, 102));
    --colorOptiontagSelTextPre: rgba(35, 180, 209, 1);
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagSelBgDis: rgba(23, 102, 114, 0.2);
    /* 边框 */
    --colorOptiontagSelBorderDis: linear-gradient(0deg, rgba(35, 180, 209, 0.5), rgba(0, 91, 102, 0.5));
    /* 文字 */
    --colorOptiontagSelTextDis: rgb(35, 180, 209);

    /* 类型1 */
    /* 没有选中状态背景 */
    --colorOptiontagUnselBgNor: rgba(255, 255, 255, 0.1);
    /* 没有选中状态边框 */
    --colorOptiontagUnselBorderNor: transparent;
    /* 没有选中状态文字 */
    --colorOptiontagUnselTextNor: rgba(255, 255, 255, 1);
    /* 没有选中Pressed状态 */
    --colorOptiontagUnselBgPre: rgba(255, 255, 255, 0.1);
    --colorOptiontagUnselBorderPre: unset;
    --colorOptiontagUnselTextPre: unset;
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagUnsel1BgDis: rgba(14, 18, 33, 0.1);
    /* 边框 */
    --colorOptiontagUnsel1BorderDis: rgba(132, 156, 219, 0.1);
    /* 文字 */
    --colorOptiontagUnsel1TextDis: rgba(255, 255, 255, 0.3);

    /* 类型2 */
    /* 没有选中状态背景 */
    --colorOptiontagUnsel2BgNor: rgba(255, 255, 255, 0.1);
    /* 没有选中状态边框 */
    --colorOptiontagUnsel2BorderNor: transparent;
    /* 没有选中状态文字 */
    --colorOptiontagUnsel2TextNor: rgba(255, 255, 255, 1);
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagUnsel2BgDis: rgba(14, 18, 33, 0.1);
    /* 边框 */
    --colorOptiontagUnsel2BorderDis: transparent;
    /* 文字 */
    --colorOptiontagUnsel2TextDis: rgba(255, 255, 255, 0.3);

    /* 日历颜色 */
    /* 标题对齐方式 */
    --colorCalendarTitAlign: center;
    /* 选中日期颜色 */
    --colorCalendarSelectBg: linear-gradient(180deg, #596580, #4c5670);
    /* 选中日期边框颜色 */
    --colorCalendarSelectBor: transparent;
    /* 选中日期中间态颜色 */
    --colorCalendarSelectMidBg: rgba(73, 83, 109, 0.6);
    /* 日期弹窗的宽度 */
    --cornerCalendarWidth: 10.1rem;
    /* 选择日期的圆角 */
    --cornerCalendarBorRad: 0.12rem;
    /* 图片 */
    --imgNoSrcBgColor: linear-gradient(180deg, #535969 0%, #434a5d 100%);
    --imgNoSrcTextColor: rgba(255, 255, 255, 0.3);
    --imgNoSrcBorRail: 0.08rem;

    /* btn 圆角 */
    --cornerBtn: 0.04rem;
    /* btn 描边 */
    --borderRealbtn: 0;
    --borderGhostbtn: 0.02rem;
    /* Slider 圆角 */
    --borderSliderThumb: unset;
    --borderSliderRail: unset;
    --borderSliderRail: unset;
    --cornerSliderThumb: 1rem;
    --cornerSliderRail: 1rem;
    --cornerSliderGap: 1rem;
    /* Progress 圆角 */
    --borderProgRail: unset;
    --borderProgGap: unset;
    --cornerProgRail: 1rem;
    --cornerProgGap: 1rem;
    /* Tag 圆角 */
    --cornerTag: 0.04rem;
    /* Switch 圆角 */
    --cornerSwitchThumb: 0.2rem;
    --cornerSwitchBase: 0.2rem;
    --borderSwitchThumb: 0;
    --borderSwitchBase: 0;
    /* Radio 圆角 */
    --borderRadioThumb: unset;
    --borderRadiolBase: unset;
    --cornerRadioThumb: 0.1rem;
    --cornerRadioBase: 0.24rem;
    /* Checkbox 圆角 */
    --cornerCheckboxThumb: 0;
    --cornerCheckboxBase: 0.04rem;
    /* Textfield 圆角 */
    --borderTextfieldBg: 0.02rem;
    --borderTextfield: 1px;
    --cornerTextfield: 0.1rem;
    --cornerTextfield: 0.1rem;
    --cornerTextfieldBg: 0.08rem;
    /* SearchBars  */
    --cornerSearchbar: 0.08rem;
    --borderSearchbar: 0.02rem;
    /* Optiontag 圆角 */
    --cornerOptiontag: unset;

    /* 所有弹窗的圆角 圆角 */
    --cornerDialog: 0.08rem;
    --borderDialog: 0;

    /* Menu 圆角 */
    --cornerMenu: unset;
    --borderMenu: unset;

    /* 导航 圆角 */
    --borderTabsVerticalSel: unset;
    --borderTabsVerticalSelBase: unset;
    --borderTabsHorizontalSel: unset;
    --borderTabsHorizontalSelBase: unset;
    --cornerTabsVerticalSel: unset;
    --cornerTabsVerticalSelBase: unset;
    --cornerTabsHorizontalSel: unset;
    --cornerTabsHorizontalSelBase: unset;
}

.iov-text-h1 {
    font-size: var(--ifontsizeH1);
    font-weight: 800;
}
.iov-text-h2 {
    font-size: var(--ifontsizeH2);
    font-weight: 800;
}
.iov-text-title {
    font-size: var(--ifontsizeTitle);
    font-weight: 400;
}
.iov-text-operation {
    font-size: var(--ifontsizeC1);
    font-weight: 400;
}
.iov-text-c1 {
    font-size: var(--ifontsizeC1);
    font-weight: 400;
}
.iov-text-c2 {
    font-size: var(--ifontsizeC2);
    font-weight: 200;
}
.iov-text-caption {
    font-size: var(--ifontsizeCaption);
    font-weight: 200;
}
.modal-content-footer {
    height: 0.8rem;
    display: flex;
    justify-content: flex-start;
    margin-bottom: 0.4rem;
    margin-top: 0.18rem;
}
.modal-content-footer-item {
    flex: 1;
    max-width: 3rem;
    margin-right: 0.4rem;
    text-align: center;
    line-height: 0.8rem;
    display: inline-block;
    font-size: var(--ifontsizeC2);
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: content-box;
    color: var(--colorRealbtnTextNor);
    background: var(--colorRealbtnBgNor);
    box-shadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
    border-radius: var(--cornerBtn);
    border: var(--borderRealbtn) solid var(--colorRealbtnBorderNor);
}
.modal-content-footer-item:active {
    color: var(--colorRealbtnTextPre);
    background: var(--colorRealbtnBgPre);
    border-color: var(--colorRealbtnBorderPre);
}
.modal-content-footer-item:nth-child(2),
.modal-content-footer-item:last-child {
    color: var(--colorGhostbtnTextNor);
    background: var(--colorGhostbtnBgNor);
    border-color: var(--colorGhostbtnBorderNor);
}
.modal-content-footer-item:nth-child(2):active,
.modal-content-footer-item:last-child:active {
    color: var(--colorGhostbtnTextPre);
    background: var(--colorGhostbtnBgPre);
    border-color: var(--colorGhostbtnBorderPre);
}

::-webkit-scrollbar {
    width: var(--borderScrollWidth);
    background: var(--colorScrollGapNor);
    border-radius: var(--borderScrollRadius);
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
    width: var(--borderScrollWidth);
    border-radius: var(--borderScrollRadius);
    background: var(--colorScrollRailNor);
}

html {
    font-size: 100px;
    background: var(--colorBg);
}
body {
    font-size: var(--ifontsizeCaption1);
}

仅支持换肤的版本 theme.css 文件

/* 主题配置 */
:root {
    /* 系统颜色 */
    /* 页面背景色 */
    --colorBg: unset;
    /* 表层色1 */
    --colorSurface1: linear-gradient(0deg, rgba(19, 26, 40, 0.8), rgba(118, 88, 70, 0.8));
    /* 表层色2 */
    --colorSurface2: linear-gradient(0deg, rgba(70, 75, 96, 1), rgba(42, 47, 66, 1));
    /* 表层色3 */
    --colorSurface3: rgb(174, 201, 255, 0.1);

    /* 功能色 */
    /* 1级功能色 */
    --colorPrimary: linear-gradient(0deg, rgb(255, 225, 164), rgb(212, 161, 120));
    /* 1级功能色2, 主题色非渐变 */
    --colorPrimary2: rgb(229, 181, 134);
    /* 2级功能色1 */
    --colorSecondary1: linear-gradient(0deg, rgb(54, 60, 78), rgb(39, 45, 59));
    /* 2级功能色2 */
    --colorSecondary2: rgba(7, 13, 30, 0.15);
    /* 3级功能色 */
    --colorTertiary1: rgb(205, 220, 255);
    /* 常用在边框，分割线颜色 */
    --colorTertiary2: rgba(70, 78, 101, 0.15);

    /* 状态色 */

    /* 成功色 */
    --colorSucceed: rgb(227, 173, 121);
    /* 警戒色 */
    --colorWarning: rgb(52, 52, 52);
    /* 强调色 */
    --colorImportant: unset;

    /* 通用字体颜色 */
    --colorTextNormal: rgb(255, 255, 255);
    /* 辅助字体颜色 */
    --colorTextCaptioon: rgba(255, 255, 255, 0.5);
    /* 高亮文字颜色---- true */
    --icolorTextHighlight: rgb(229, 181, 134);
    /* 链接文字颜色---- 外卖、酒店、洗车、订座、加油 */
    --icolorTextLink: rgb(229, 181, 134);
    /* 成功状态颜色---- 景点、酒店、电影、停车、订座、加油 */
    --icolorTextSucceed: rgb(121, 237, 220);
    /* 警告状态颜色----  订座、停车、电影、酒店、外卖、景点、加油*/
    --icolorTextWarning: rgb(238, 65, 65);
    /*滚动条滑块颜色*/
    --colorScrollRailNor: rgba(82, 88, 104, 1);
    /*滚动条轨道颜色*/
    --colorScrollGapNor: unset;
    /*滚动条滑块颜色*/
    --borderScrollWidth: 0.04rem;
    /*滚动条轨道颜色*/
    --borderScrollRadius: 0.04rem;

    /* 用于运营类等一级大标题 */
    --ifontsizeH1: 0.56rem;
    /* 运营类二级大标题 */
    --ifontsizeH2: 0.48rem;
    /* 用于常规标题如导航、标题栏 */
    --ifontsizeTitle1: 0.4rem;
    /* 常规标题2 */
    --ifontsizeTitle2: 0.36rem;
    /* 操作类标题 */
    --ifontsizeOperation: 0.32rem;
    /* 一级内容、操控类（Tab、弹窗标题、列表标题等 */
    --ifontsizeC1: 0.32rem;
    /* 二级内容（二级导航、按钮） */
    --ifontsizeC2: 0.28rem;
    /* 辅助类文案,内容（列表）,比如输入出错提示 */
    --ifontsizeCaption1: 0.24rem;
    /* 仅用于标签（谨慎使用） */
    --ifontsizeCaption2: 0.2rem;

    /* 异形屏参数 */
    /* 异形屏，屏幕上方弧线垂直方向大小 */
    --screenArcTop: 0px;
    /* 异形屏，屏幕右方弧线水平方向大小 */
    --screenArcRight: 595px;
    /* 异形屏，屏幕下方弧线垂直方向大小 */
    --screenArcBottom: 0px;
    /* 异形屏，屏幕左方弧线水平方向大小 */
    --screenArcLeft: 0px;

    /*textfield 颜色*/
    /*textfield 普通*/
    --colorTextfieldBgNor: rgba(7, 13, 30, 0.15);
    --colorTextfieldTextNor: rgb(99, 106, 123);
    /* --colorTextfieldBgNor: ; 光标颜色 */
    --colorTextfieldBorderNor: rgba(99, 111, 138, 0.5);
    --textfieldBorder: 0.02rem solid var(--colorTextfieldBorderNor);
    --textfieldBorderBottom: 0.02rem solid var(--colorTextfieldBorderNor);
    --textfieldBorderError: 0.02rem solid var(--colorTextfieldBorderError);

    /*textfield 输入状态*/
    --colorTextfieldBgInput: rgba(7, 13, 30, 0.15);
    --colorTextfieldTextInput: rgb(255, 255, 255);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldInput: rgb(191, 206, 239);
    /*textfield Pressed状态*/
    --colorTextfieldBgPre: unset;
    --colorTextfieldTextPre: unset;
    --colorTextfieldBorderPre: unset;

    /*textfield Error状态*/
    --colorTextfieldBgError: rgba(7, 13, 30, 0.15);
    --colorTextfieldTextError: rgb(255, 255, 255);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldBorderError: rgb(145, 50, 50);

    /*textfield Disable状态*/
    --colorTextfieldBgDis: rgba(29, 34, 50, 0.5);
    --colorTextfieldTextDis: rgb(99, 106, 123);
    --colorTextfieldCsr: rgb(229, 181, 134);
    --colorTextfieldBorderDis: rgba(99, 111, 138, 0.5);

    /* tag 组件颜色 */
    /* tag Succed */
    --colorTagSucceedBg: unset;
    --colorTagSucceedBorder: rgb(121, 237, 220);
    --colorTagSucceedText: rgb(121, 237, 220);
    /* tag Warning */
    --colorTagWarningBg: unset;
    --colorTagWarningBorder: rgb(238, 65, 65);
    --colorTagWarningText: rgb(238, 65, 65);
    /* tag Hint */
    --colorTagHintBg: unset;
    --colorTagHintBorder: rgb(205, 220, 255);
    --colorTagHintText: rgb(205, 220, 255);
    /* tag Highlight */
    --colorTagHighlightBg: unset;
    --colorTagHighlightBorder: rgb(230, 182, 131);
    --colorTagHighlightText: rgb(230, 182, 131);

    /* button 按钮颜色*/

    /* Real 普通状态 */
    --colorRealbtnBgNor: linear-gradient(180deg, rgb(54, 60, 78), rgb(39, 45, 59));
    --colorRealbtnBorderNor: rgba(219, 235, 255, 0.15);
    --colorRealbtnTextNor: rgb(255, 255, 255);
    /* Real 点击状态*/
    --colorRealbtnBgPre: linear-gradient(0deg, rgb(86, 91, 106), rgb(73, 78, 90));
    --colorRealbtnBorderPre: rgba(98, 104, 118, 1);
    --colorRealbtnTextPre: rgb(255, 255, 255);
    /* Real 禁用状态*/
    --colorRealbtnBgDis: linear-gradient(0deg, rgba(54, 60, 78, 0.5), rgba(39, 45, 59, 0.5));
    --colorRealbtnBorderDis: rgba(70, 77, 94, 0.5);
    --colorRealbtnTextDis: rgba(255, 255, 255, 0.5);

    /* Ghost btn 普通状态 */
    --colorGhostbtnBgNor: linear-gradient(0deg, rgba(7, 13, 30, 0.15), rgba(7, 13, 30, 0.15));
    --colorGhostbtnBorderNor: rgba(186, 210, 243, 0.5);
    --colorGhostbtnTextNor: rgb(255, 255, 255);
    /* Ghost 点击状态*/
    --colorGhostbtnBgPre: linear-gradient(0deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.15));
    --colorGhostbtnBorderPre: transparent;
    --colorGhostbtnTextPre: rgb(255, 255, 255);
    /* Ghost 禁用状态*/
    --colorGhostbtnBgDis: linear-gradient(0deg, rgba(29, 34, 50, 0.5), rgba(29, 34, 50, 0.5));
    --colorGhostbtnBorderDis: rgba(107, 121, 146, 0.5);
    --colorGhostbtnTextDis: rgba(255, 255, 255, 0.5);

    /* Flat btn 普通状态 */
    --colorTextbtnBgNor: transparent;
    --colorTextbtnBorderNor: transparent;
    --colorTextbtnNor: rgb(229, 181, 134);
    /* Flat 点击状态*/
    --colorTextbtnBgPre: rgba(255, 255, 255, 0.15);
    --colorTextbtnBorderPre: transparent;
    --colorTextbtnPre: rgb(229, 181, 134);
    /* Flat 禁用状态*/
    --colorTextbtnBgDis: transparent;
    --colorTextbtnBorderDis: transparent;
    --colorTextbtnDis: rgba(229, 181, 134, 0.5);

    /* ui 未提供样式*/

    --ibtnSmallLinehight: 0.6rem;
    --ibtnRealBgc: unset;
    --ibtnRealBorderRadius: 0.04rem;
    --ibtnRealBorderWidth: 0.02rem;
    --ibtnGhostBgi: unset;
    /* --ibtnGhostBorderRadius: 4px; */
    --ibtnGhostBorderWidth: 0.02rem;
    /* --ibtnFlatBorderRadius: 4px; */
    --ibtnFlatBorderWidth: 0.02rem;

    /* slider变量 */
    /* normal*/
    --colorSliderThumbNor: linear-gradient(90deg, rgb(212, 161, 120), rgb(255, 225, 164));
    --colorSliderRailNor: linear-gradient(90deg, rgb(212, 161, 120), rgb(255, 225, 164));
    --colorSliderGapNor: rgba(255, 255, 255, 0.3);
    /* Pressed */
    --colorSliderThumbPre: unset;
    --colorSliderRailPre: unset;
    /* Disable*/
    --colorSliderThumbDis: linear-gradient(90deg, rgba(212, 161, 120, 0.3), rgba(255, 225, 164, 0.3));
    --colorSliderRailDis: linear-gradient(90deg, rgb(212, 161, 120, 0.3), rgb(255, 225, 164, 0.3));
    --colorSliderGapDis: rgba(100, 103, 113, 0.3);

    --iSliderBlockSize: 0.324rem;
    --isliderBlockMarginHalfSize: -0.162rem;
    --isliderBlockHalfSize: 0.162rem;
    --isliderBlockShadow: 0.05rem 0 0.1rem 0 rgba(0, 0, 0, 0.5);
    --isliderLineHeight: 0.06rem;
    --isliderTapAreaHeight: 0.72rem;
    --isliderBlockActiveShadowOpatity: 0.3;
    --isliderBlockActiveShadowSize: 0.72rem;
    --isliderBlockMarginSize: -0.2rem;

    /* searchbar 颜色*/
    /* Normal */
    --colorSearchbarBgNor: rgba(7, 13, 30, 0.15);
    --colorSearchbarBorderNor: rgba(99, 111, 138, 1);
    --colorSearchbarTextNor: rgba(99, 106, 123, 1);
    /* Pressed */
    --colorSearchbarBgPre: unset;
    --colorSearchbarBorderPre: unset;
    --colorSearchbarTextPre: unset;
    /* Inputting */
    --colorSearchbarBgInput: rgba(7, 13, 30, 0.15);
    --colorSearchbarCsr: rgba(229, 181, 134, 1);
    --colorSearchbarBorderInput: rgba(191, 206, 239, 1);
    --colorSearchbarTextInput: rgba(255, 255, 255, 1);
    /* radio */
    /* 选中状态 */
    --colorRadioSelThumbBgNor: linear-gradient(0deg, rgb(212, 161, 120), rgb(255, 225, 164));
    --colorRadioSelThumbBorderNor: unset;
    --colorRadioSelBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorRadioSelBaseBorderNor: unset;
    /* 选中Pressed状态 */
    --colorRadioSelThumbBgPre: unset;
    --colorRadioSelThumbBorderPre: unset;
    --colorRadioSelBaseBgPre: unset;
    --colorRadioUnselBaseBorderPre: unset;
    /* 未选中状态 */
    --colorRadioUnselThumbBgNor: unset;
    --colorRadioUnselThumbBorderNor: unset;
    --colorRadioUnselBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorRadioUnselBaseBorderNor: unset;

    /* 选中禁用状态 */
    --colorRadioSelThumbBgDis: linear-gradient(0deg, rgba(212, 161, 120, 0.5), rgba(255, 225, 164, 0.5));
    --colorRadioSelThumbBorderDis: unset;
    --colorRadioSelBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorRadioUnselBaseBorderDis: unset;
    /* 未选中禁用状态 */
    --colorRadioUnselThumbBgDis: unset;
    --colorRadioUnselThumbBorderDis: unset;
    --colorRadioUnselBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorRadioUnselBaseBorderDis: unset;

    /* Checkbox */
    /* 选中状态 */
    --colorCheckboxSelThumbNor: rgb(212, 161, 120);
    --colorCheckboxSelBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorCheckboxSelBaseBorderNor: unset;
    /* 选中Pressed状态 */
    --colorCheckboxSelThumbPre: unset;
    --colorCheckboxSelBaseBgPre: unset;
    --colorCheckboxSelBaseBorderPre: unset;
    /* 未选中状态 */
    --colorCheckboxUnselThumbNor: unset;
    --colorCheckboxUnselBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorCheckboxUnselBaseBorderNor: unset;
    /* 未选中Pressed状态 */
    --colorCheckboxUnselThumbPre: unset;
    --colorCheckboxUnselBaseBgPre: unset;
    --colorCheckboxUnselBaseBorderPre: unset;
    /* 选中禁用状态 */
    --colorCheckboxSelThumbDis: rgba(212, 161, 120, 0.5);
    --colorCheckboxSelBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorCheckboxSelBaseBorderDis: unset;
    /* 未选中禁用状态 */
    --colorCheckboxUnselThumbDis: unset;
    --colorCheckboxUnselBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorCheckboxUnselBaseBorderDis: unset;
    /* loadingbar变量 */
    --colorProgIndeterminateRail: rgba(255, 255, 255, 0.3);
    --colorProgDeterminateRail: rgba(255, 255, 255, 0.3);
    --colorProgIndeterminateGap: linear-gradient(90deg, rgb(212, 161, 120), rgb(255, 225, 164));
    --colorProgDeterminateGap: linear-gradient(90deg, rgb(212, 161, 120), rgb(255, 225, 164));
    /* loading circle */
    --colorProgCircularRail: rgb(229, 181, 134);
    --colorProgCircularGap: transparent;

    /* 纵向tabs变量 */
    --colorTabsVerticalSelNor: rgb(244, 210, 168);
    --colorTabsVerticalSelBaseBgNor: linear-gradient(90deg, rgba(229, 181, 134, 0.15), transparent);
    --colorTabsVerticalSelBaseBorderNor: unset;
    --colorTabsVerticalSelTextNor: rgb(255, 255, 255);
    --colorTabsVerticalSelTextNor: rgb(255, 255, 255);
    --colorTabsVerticalUnselTextNor: rgba(255, 255, 255, 0.5);
    /* Vertical Pressed 状态下 */
    --colorTabsVerticalSelTextPre: unset;
    --colorTabsVerticalUnselPre: unset;
    --colorTabsVerticalUnselBaseBgPre: unset;
    --colorTabsVerticalUnselBaseBorderPre: unset;
    --colorTabsVerticalUnselBasePre: unset;
    --colorTabsVerticalUnselTextPre: unset;
    /* Horizontal Pressed 状态下 */
    --colorTabsHorizontalSelTextPre: unset;
    /* Horizontal 未选中Pressed 状态下 */
    --colorTabsHorizontalUnselBasePre: unset;
    --colorTabsHorizontalUnselTextPre: unset;
    --colorTabsHorizontalUnselBaseBgPre: unset;
    --colorTabsHorizontalUnselBaseBorderPre: unset;
    /* Horizontal normal */
    --colorTabsHorizontalSelNor: unset;
    --colorTabsHorizontalSelBaseBgNor: unset;
    --colorTabsHorizontalSelBaseBorderNor: unset;
    /* 横向tabs变量 */
    --colorTabsHorizontalSelTextNor: rgb(255, 255, 255);
    --colorTabsHorizontalUnselTextNor: rgba(255, 255, 255, 0.5);
    /* tabs禁用状态变量 */
    --colorTabsVerticalSelDis: unset;
    --colorTabsVerticalSelBaseBgDis: unset;
    --colorTabsVerticalSelBaseBorderDis: unset;
    --colorTabsVerticalSelBaseDis: unset;
    --colorTabsVerticalSelTextDis: unset;
    --colorTabsVerticalSelTextDis: unset;
    --colorTabsVerticalUnselDis: unset;
    --colorTabsVerticalUnselBaseDis: unset;
    --colorTabsVerticalUnselBaseBgDis: unset;
    --colorTabsVerticalUnselBaseBorderDis: unset;
    --colorTabsVerticalSelTextDis: rgba(255, 255, 255, 0.3);
    --colorTabsVerticalUnselTextDis: rgba(255, 255, 255, 0.3);
    --colorTabsHorizontalSelTextDis: rgba(255, 255, 255, 0.3);
    --colorTabsHorizontalUnselTextDis: rgba(255, 255, 255, 0.3);
    --colorTabsHorizontalelBaseBgDis: unset;
    --colorTabsHorizontalelBaseBorderDis: unset;
    --colorTabsHorizontalUnselDis: unset;
    --colorTabsHorizontalUnselBaseBgDis: unset;
    --colorTabsHorizontalUnselBaseBorderDis: unset;
    /* ui未提供变量 */
    --itabsVerticalWidth: 0.02rem;
    --itabsVerticalHeight: 100%;
    --itabsVerticalTop: 0;

    /* switch选中状态变量 */
    --colorSwitchOnBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorSwitchOnThumbBgNor: linear-gradient(0deg, rgb(212, 161, 120), rgb(255, 225, 164));
    --colorSwitchOnBaseBorderNor: unset;
    --colorSwitchOnThumbBorderNor: unset;
    /* switch选中Pressed状态变量 */
    --colorSwitchOnThumbBgPre: unset;
    --colorSwitchOnThumbBorderPre: unset;
    --colorSwitchOnBaseBgPre: unset;
    --colorSwitchOnBaseBorderPre: unset;
    /* switch未选中状态变量 */
    --colorSwitchOffThumbBorderNor: unset;
    --colorSwitchOffBaseBorderNor: unset;
    /* switch未选中Pressed状态变量 */
    --colorSwitchOffThumbBgPre: unset;
    --colorSwitchOffThumbBorderPre: unset;
    --colorSwitchOffBaseBgPre: unset;
    --colorSwitchOffBaseBorderPre: unset;
    --colorSwitchOffBaseBgNor: rgba(0, 0, 0, 0.3);
    --colorSwitchOffThumbBgNor: linear-gradient(180deg, rgb(217, 227, 244), rgb(82, 94, 122));
    /* switch禁用状态变量 */
    --colorSwitchOnThumbBgDis: linear-gradient(0deg, rgba(212, 161, 120, 0.5), rgba(255, 225, 164, 0.5));
    --colorSwitchOnBaseBgDis: rgba(16, 18, 25, 0.5);
    --colorSwitchOffThumbBgDis: linear-gradient(180deg, rgba(217, 227, 244, 0.5), rgba(82, 94, 122, 0.5));
    --colorSwitchOffBaseBgDis: rgba(16, 18, 25, 0.5);
    /* ui未提供变量 */
    --iswitchTrackShadow: 0 0.02rem 0.12rem 0 rgba(0, 0, 0, 0.1);
    --iswitchOnTrackBorderColor: #fff7ee80;
    --iswitchOffTrackBorderColor: #9cb3db80;

    /* 弹窗 Normal */
    --colorDialogBg: linear-gradient(180deg, rgb(70, 75, 96), rgb(42, 47, 66));
    --colorDialogBorder: rgba(177, 206, 49, 1);
    --colorDialogTiltle: rgba(255, 255, 255, 1);
    --colorDialogText: rgba(255, 255, 255, 1);
    --colorDiaologBtnBgNor: unset;
    --colorDiaologBtnTextNor: rgba(255, 255, 255, 1);
    --colorDialogBtnBorderNor: unset;
    --positionDialogTiltle: center;
    --highlightDialogBtn: unset;

    /* 弹窗 Pressed */
    --colorDiaologBtnBgPre: unset;
    --colorDialogBtnBorderPre: unset;
    --colorDiaologBtnTextPre: rgba(255, 255, 255, 1);

    /* 弹窗 Disable */
    --colorDiaologBtnBgDis: unset;
    --colorDiaologBtnBorderDis: unset;
    --colorDiaologBtnTextDis: rgba(255, 255, 255, 0.3);

    /* 弹窗 对齐方式 */
    /* 垂直对齐方式 */
    --diaologAlignItems: center;
    /* 水平对齐方式 */
    --diaologJustifyContent: center;

    /* 筛选菜单 Normal */
    /*筛选菜单圆角*/
    --colorMenuRadius: 0.08rem;
    --colorMenuUnselBg: rgb(57, 63, 80);
    --colorMenuSubUnselBg: rgb(41, 47, 64);
    --colorMenuTextUnselNor: rgba(255, 255, 255, 01);
    --colorMenuTextSubUnselNor: rgba(255, 255, 255, 0.5);
    --colorMenuSelBg: linear-gradient(90deg, rgb(57, 63, 80), rgb(41, 47, 64));
    --colorMenuTextSelNor: rgb(229, 181, 134);
    --colorMenuSubSelBg: unset;
    --colorMenuTextSubSelNor: unset;
    /* 筛选菜单 pressed */
    --colorMenuTextUnselPre: unset;
    --colorMenuTextSubUnselPre: unset;
    --colorMenuTextSelPre: unset;
    --colorMenuTextSubSelPre: unset;
    /* 筛选菜单 Disable */
    --colorMenuTextUnselDis: unset;
    --colorMenuTextSubUnselDis: unset;
    --colorMenuTextSelDis: unset;
    --colorMenuTextSubSelDis: unset;

    /* tag-select 样式 */

    /* 边框大小 */

    --borderOptiontagSel: 0.02rem;
    --cornerOptiontagSel: 0.1rem;

    /* 选中状态背景 */
    --colorOptiontagSelBgNor: rgba(229, 181, 134, 0.2);
    /* 选中状态边框 */
    --colorOptiontagSelBorderNor: rgba(229, 181, 134, 1);
    /* 选中状态文字 */
    --colorOptiontagSelTextNor: rgba(229, 181, 134, 1);
    /* 选中Pressed状态背景 */
    --colorOptiontagSelBgPre: unset;
    --colorOptiontagSelBorderPre: unset;
    --colorOptiontagSelTextPre: unset;
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagSelBgDis: rgba(229, 181, 134, 0.1);
    /* 边框 */
    --colorOptiontagSelBorderDis: rgba(229, 181, 134, 0.3);
    /* 文字 */
    --colorOptiontagSelTextDis: rgba(229, 181, 134, 0.3);

    /* 类型1 */
    /* 没有选中状态背景 */
    --colorOptiontagUnselBgNor: rgba(14, 18, 33, 0.15);
    /* 没有选中状态边框 */
    --colorOptiontagUnselBorderNor: rgba(132, 156, 219, 0.15);
    /* 没有选中状态文字 */
    --colorOptiontagUnselTextNor: rgba(255, 255, 255, 1);
    /* 没有选中Pressed状态 */
    --colorOptiontagUnselBgPre: unset;
    --colorOptiontagUnselBorderPre: unset;
    --colorOptiontagUnselTextPre: unset;
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagUnsel1BgDis: rgba(14, 18, 33, 0.1);
    /* 边框 */
    --colorOptiontagUnsel1BorderDis: rgba(132, 156, 219, 0.1);
    /* 文字 */
    --colorOptiontagUnsel1TextDis: rgba(255, 255, 255, 0.3);

    /* 类型2 */
    /* 没有选中状态背景 */
    --colorOptiontagUnsel2BgNor: rgba(14, 18, 33, 0.15);
    /* 没有选中状态边框 */
    --colorOptiontagUnsel2BorderNor: transparent;
    /* 没有选中状态文字 */
    --colorOptiontagUnsel2TextNor: rgba(255, 255, 255, 1);
    /* 禁用状态 */
    /* 背景 */
    --colorOptiontagUnsel2BgDis: rgba(14, 18, 33, 0.1);
    /* 边框 */
    --colorOptiontagUnsel2BorderDis: transparent;
    /* 文字 */
    --colorOptiontagUnsel2TextDis: rgba(255, 255, 255, 0.3);

    /* 日历颜色 */
    /* 标题对齐方式 */
    --colorCalendarTitAlign: center;
    /* 选中日期颜色 */
    --colorCalendarSelectBg: linear-gradient(180deg, #596580, #4c5670);
    /* 选中日期边框颜色 */
    --colorCalendarSelectBor: transparent;
    /* 选中日期中间态颜色 */
    --colorCalendarSelectMidBg: rgba(73, 83, 109, 0.6);
    /* 日期弹窗的宽度 */
    --cornerCalendarWidth: 10.1rem;
    /* 选择日期的圆角 */
    --cornerCalendarBorRad: 0.12rem;
    /* 图片 */
    --imgNoSrcBgColor: linear-gradient(180deg, #535969 0%, #434a5d 100%);
    --imgNoSrcTextColor: rgba(255, 255, 255, 0.3);
    --imgNoSrcBorRail: 0.08rem;

    /* btn 圆角 */
    --cornerBtn: 0.1rem;
    /* btn 描边 */
    --borderRealbtn: 0.01rem;
    --borderGhostbtn: unset;
    /* Slider 圆角 */
    --borderSliderThumb: unset;
    --borderSliderRail: unset;
    --borderSliderRail: unset;
    --cornerSliderThumb: 1rem;
    --cornerSliderRail: 1rem;
    --cornerSliderGap: 1rem;
    /* Progress 圆角 */
    --borderProgRail: unset;
    --borderProgGap: unset;
    --cornerProgRail: 1rem;
    --cornerProgGap: 1rem;
    /* Tag 圆角 */
    --cornerTag: 0.04rem;
    /* Switch 圆角 */
    --cornerSwitchThumb: 0.2rem;
    --cornerSwitchBase: 0.2rem;
    --borderSwitchThumb: 0;
    --borderSwitchBase: 1px;
    /* Radio 圆角 */
    --borderRadioThumb: unset;
    --borderRadiolBase: unset;
    --cornerRadioThumb: 0.1rem;
    --cornerRadioBase: 0.24rem;
    /* Checkbox 圆角 */
    --cornerCheckboxThumb: 0;
    --cornerCheckboxBase: 0.15rem;
    /* Textfield 圆角 */
    --borderTextfieldBg: unset;
    --borderTextfield: 1px;
    --cornerTextfield: 0.1rem;
    --cornerTextfield: 0.1rem;
    --cornerTextfieldBg: unset;
    /* SearchBars  */
    --cornerSearchbar: 1rem;
    --borderSearchbar: unset;
    /* Optiontag 圆角 */
    --cornerOptiontag: unset;

    /* 所有弹窗的圆角 圆角 */
    --cornerDialog: 0.1134rem;
    --borderDialog: 1px;

    /* Menu 圆角 */
    --cornerMenu: unset;
    --borderMenu: unset;

    /* 导航 圆角 */
    --borderTabsVerticalSel: unset;
    --borderTabsVerticalSelBase: unset;
    --borderTabsHorizontalSel: unset;
    --borderTabsHorizontalSelBase: unset;
    --cornerTabsVerticalSel: unset;
    --cornerTabsVerticalSelBase: unset;
    --cornerTabsHorizontalSel: unset;
    --cornerTabsHorizontalSelBase: unset;
}

.iov-text-h1 {
    font-size: var(--ifontsizeH1);
    font-weight: 800;
}
.iov-text-h2 {
    font-size: var(--ifontsizeH2);
    font-weight: 800;
}
.iov-text-title {
    font-size: var(--ifontsizeTitle);
    font-weight: 400;
}
.iov-text-operation {
    font-size: var(--ifontsizeC1);
    font-weight: 400;
}
.iov-text-c1 {
    font-size: var(--ifontsizeC1);
    font-weight: 400;
}
.iov-text-c2 {
    font-size: var(--ifontsizeC2);
    font-weight: 200;
}
.iov-text-caption {
    font-size: var(--ifontsizeCaption);
    font-weight: 200;
}
.modal-content-footer {
    height: 1.037rem;
    display: flex;
    justify-content: flex-start;
    margin-top: 0.18rem;
}
.modal-content-footer-item {
    flex: 1;
    border-top: 0.02rem solid #4a516c;
    border-right: 0.02rem solid #4a516c;
    text-align: center;
    line-height: 1.037rem;
}
.modal-content-footer-item:last-child {
    border-right: none;
}

::-webkit-scrollbar {
    width: var(--borderScrollWidth);
    background: var(--colorScrollGapNor);
    border-radius: var(--borderScrollRadius);
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
    width: var(--borderScrollWidth);
    border-radius: var(--borderScrollRadius);
    background: var(--colorScrollRailNor);
}

html {
    font-size: 100px;
    background: var(--colorBg);
}
body {
    font-size: var(--ifontsizeCaption1);
}