iov-ui

官方文档

``s
npm install iov-ui -S
`

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

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

`html
确认
`

发布记录

`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 文件

`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);
}
``