theme.less

//全局变量
@themeColor: #60D2DD;
//Switch组件
@SwitchWidth: 126;
@SwitchHeight: 72;
@SwitchPadding: 12;
@SwitchCircleSize: 48;
@SwitchCircleTranslateX: @SwitchWidth - @SwitchCircleSize - @SwitchPadding * 2;
@SwitchCircleColor: #FFFFFF;
@SwitchOnColor: @themeColor; //使用全局变量,也可以自己定义.
@SwitchOffColor: #D8D8D8;
@SwitchDisabledOnColor: #CFF1F5;
@SwitchDisabledOffColor: #F3F3F3;
//CheckBox组件
@CheckBoxSize: 60px;
@CheckBoxPadding: 20px;//增加热点面积,利于触发事件
@CheckBoxBold: 3px;
@CheckBoxCheckedColor: @themeColor;
@CheckBoxDischeckedColor: #ccc;
@CheckBoxCheckedIconColor: #fff;
@CheckBoxDisabledCheckedColor: @SwitchDisabledOnColor;
@CheckBoxDisabledDischeckedColor: #F0F0F0;
@CheckBoxDisabledCheckedIconColor: #90E0E7;
//NavBar组件
@NavBarHeight: 160px;
@NavBarPaddingLeft: 60px;
@NavBarPaddingRight: 60px - 27px;
@NavBarBackgroundColor: @themeColor;
@NavBarFontColor: #FFFFFF;
@NavBarTitleFontSize: 48px;
@NavBarMoreDotSize: 12px;
@NavBarMoreSize: 120px;
@NavBarMorePadding: 20px;
@NavBarCloseWidth: 66px;
@NavBarCloseHeight: 6px;
@NavBarCloseSize: 120px;
@NavBarActiveColor: rgba(0, 0, 0, 0.1);
//Buttons组件
@ButtonsBackgroundColor: #f2f4f5;
@ButtonsBorderTopBold: 1px;
@ButtonsBorderTopColor: #b2b2b2;
@ButtonsFontSize: 39px;
@ButtonsPadingLeftRight:60px;
@ButtonsTextPaddingTop:24px;
//Button组件  单个按钮
@ButtonPrimaryColor: @themeColor;
@ButtonHeight: 120px;
@ButtonPadding: 30px;
@ButtonBorderRadius: 15px;
@ButtonPrimaryTextColor: #fff;
@ButtonFontSize: 48px;
@ButtonDashedBorderBold: 3px;
//Loading组件
@LoadingSizeBig: 132px;
@LoadingSizeSmall: 36px;
@LoadingSizeDefault: 72px;
@LoadingColor: #ccc;
//TwoLevelList组件二级列表
@TwoLevelListBackgroundColor: #ccc;
@TwoLevelListTitleHeight: 144px;
@TwoLevelListTitleBackground: #fff;
@TwoLevelListTitlePaddingLeft: 60px;
@TwoLevelListTitlePaddingRight: 60px;
@TwoLevelListTitleBackIconSize: 48px;
@TwoLevelListTitleBackIconBold: 6px;
@TwoLevelListTitleBackIconColor: #666;
@TwoLevelListTitleFontSize: 48px;
@TwoLevelListItemPaddingLeft: 60px;
@TwoLevelListItemPaddingRight: 60px;
@TwoLevelListItemPaddingTop: 42px;
@TwoLevelListItemPaddingBottom: 42px;
@TwoLevelListLineColor: #ccc;
@TwoLevelListLineHeight: 1px;
@TwoLevelListItemArrowSize: 36px;
@TwoLevelListItemArrowBold: 4px;
@TwoLevelListItemArrowColor: #666;
@TwoLevelListItemTitleFontSize: 48px;
@TwoLevelListItemIconSize: 84px;
@TwoLevelListItemIconImageSize: 60px;
@TwoLevelListItemIconBorderRadius: 15px;
@TwoLevelListItemIconPaddingRight: 30px;
@TwoLevelListItemSubTitleColor: #666;
@TwoLevelListItemSubTitleFontSize: 36px;
@TwoLevelListItemSubTitlePaddingTop: 4px;
@TwoLevelListItemRightTextFontSize: 36px;
@TwoLevelListItemRightTextFontColor: #666;
@TwoLevelListItemRightTextPaddingRight: 24px;
@TwoLevelListItemBackground: #fff;
@TwoLevelListItemIconBackground: #ccc;
@TwoLevelListLinkColor: #3388ff;
@TwoLevelListFooterTextColor: #666;
@TwoLevelListItemGroupPadding: 36px;
@TwoLevelListHeaderFooterFontSize:33px;
//Modal组件
@ModalButtonPaddingTop: 30px;
@ModalButtonPaddingBottom: 30px;
@ModalSoltPaddingLeft: 60px;
@ModalSoltPaddingRight: 60px;
@ModalSlotBorderRadius: 30px;
@ModalPaddingLeft: 90px;
@ModalPaddingRight: 90px;
@ModalTitlePaddingTop: 30px;
@ModalTitlePaddingBottom: 30px;
@ModalTitleFontSize: 48px;
@ModalTitleColor: #000;