N3-components/N3-components

View on GitHub
src/style/define.less

Summary

Maintainability
Test Coverage
/*prefix string*/
@prefix-cls: n3;

/*alert color*/
@alertDefaultColor: @whiteColor;
@alertHrColor: @lightGrayColor;
@alertFontColor:@fontColor;
@alertDefaultBorder:4px solid @lightGrayColor;
@alertSuccessBorder:4px solid @successColor;
@alertInfoBorder:4px solid @infoColor;
@alertDangerBorder:4px solid @dangerColor;
@alertWarningBorder: 4px solid @warningColor;
@alertDangerIcon:@dangerColor;
@alertSuccessIcon:@successColor;
@alertInfoIcon:@infoColor;
@alertWarningIcon:@warningColor;


/*cascader color*/
@cascaderColor:@lightColor;

/*popover */
@popoverShadow:0 1px 6px rgba(0,0,0,.2);
@popoverBorder:0px;

/*cascader*/
@cascaderShadow:0 1px 6px rgba(0,0,0,.2);

/*datepicker shadow*/
@dateShadow:0 1px 6px rgba(0,0,0,.2);
@dateBorder:0px;

/*panel*/
@panelHeadingColor:transparent;

/*modal*/
@modalHeaderColor: @whiteColor;
@modalHeaderFontColor: @fontColor;


/*----------size-----------*/
/*btn size*/
.btn-size(@p,@f,@l,@b){
  padding: @p;
  font-size: @f;
  line-height: @l;
  border-radius: @b;
}

.defaultBtnSize(){
    .btn-size(6px 12px,14px,1.42857143,4px)
}
.lgBtnSize(){
    .btn-size(10px 16px,18px,1.3333333,6px)
}
.smBtnSize(){
    .btn-size(5px 10px,12px,1.5,3px)
}
.xsBtnSize(){
    .btn-size(1px 5px,12px,1.5,3px)
}

/*select*/
@selectMultiple: 3px 22px 0px 12px !important;
@selectTag:3px 5px;
@selectPadding: 6px 28px 6px 12px;
@selectArrowLeft: 10px;
@selectMinHeight:34px;

/*alert pos*/
@alertTop:30px;
@alertBottom:30px;
@alertLeft:50px;
@alertRight:50px;
@alertShadow:0 1px 6px rgba(0,0,0,.2);

/*toast pos*/
@toastTop:30px;
@toastBottom:30px;
@toastLeft:50px;
@toastRight:50px;

/*popover */
@popoverArrow:6px;


/*tooltip*/
@tooltipArrow:5px;

/*input*/
@inputPadding:6px 12px;
@inputHeight:34px;
@inputLineHeight:1.42857143;
@inputRadius:4px;
@cleanTop:9px;
@cleanRight:9px;
@cleanSize:16px;
@inputCleanRight:24px;
@inputPopover:40px;

/*cascader*/
@cascaderPadding:7px 16px;
@cascaderItemLineHeight:18px;
@cascaderHeight:180px;
@cascaderMinWidth:110px;

/*radio*/
@radioSize:14px;
@radioPointerSize:6px;

/*checkbox*/
@checkboxSize:14px;
@checkboxRadius:3px;
@checkboxCheckSize:12px;
@checkboxCheckOffset:0px;

/*dropdown*/
@dropdownMinWidth:100px;
@dropdownLiPadding:7px 25px 7px 20px;
@dropdownLineHeight:1.42857143;
@dropBorder:0px;
@dropShadow:0 1px 6px rgba(0,0,0,.2);

/*slider*/
@sliderHeight:4px;
@sliderWidth:4px;
@sliderHandler:15px;
@sliderHandlerBorder:2px;
@sliderHandlerTop:-5px;
@sliderHandlerLeft:0px;
@sliderVerticalHandlerTop:-5px;
@sliderVerticalHandlerLeft:-5px;
@sliderHorizontalHeight:34px;
@sliderVerticalWidth:20px;
@sliderVerticalTipTop:-15px;
@sliderVerticalTipLeft:17px;
@sliderHorizontalTipTop:-40px;
@sliderHorizontalTipLeft:-8px;

/*datepicker*/
@datepickerWidth:250px;
@datepickerSpanSize:35px;
@datepickerSpanRadius:35px;
@datepicerCtrlHeight:35px;
@datepickerRangeSize:40px;

/*timepicker*/    
@timepickerPadding:10px 0px 0px;
@timepickerSliderMargin:4px 14px;
@timepickerSliderHeight:275px;
@timepickerSlierPadding:0px 0px 0px 2px;

/*datetimepicker*/
@datetimepickerWidth:250px;

/*switch*/
@switchWidth:65px;
@switchHeight:28px;
@switchRadius:30px;
@switchRoundSize:20px;

/*uploader*/
@uploaderHeight:25px;
@uploaderIconSize:60px;

/*multipleinput*/
@multipleinputPadding: 6px 12px 0px;
@multipleinputMinHeight:34px;

/*form*/
@formGroupMargin:0 0 15px 0;
@formGroupMinHeight: 34px;

/*panel*/
@panelHeaderPadding:10px 15px;
@panelBodyPadding:15px;

/*table*/
@tableTdPadding: 10px 10px;
@tableTdLineHeight: 1.5;
@tableTdBorderLeft: 0px;
@tableBorder:0px;

/*modal*/
@modalMargin:30px auto;
@modalPadding:15px;
@modalFooterBorderTop:0px;

/*label*/
@labelPadding: 0.5em 0.8em;
@labelMargin: 0px 5px 5px 0px;

/*timeline*/
@timelineItemPadding:0 0 12px;
@timelineItemSize: 12px;
@timelineIconSize: 16px;
@timelineContentPadding:0 0 10px 24px;
@timelineTailLeft:5px; 

/*tree*/
@treeNodeMargin:10px;
@treeFontSize:13px;

/*step round*/
@stepRoundSize: 30px;
@stepRoundLineHeight: 6px;
@stepRoundLineMargin:12px 0px;

/*step*/
@stepHeight: 32px;
@stepLabelMargin: 0 0 0 26px;

/*nav */
@navLineHeight: 40px;
@navShadow:0 1px 6px rgba(0,0,0,.2);
@navDarkColor:#2d3035;
@navDarkHoverColor:rgba(65,202,192,0.1);
/*nav vertical*/
@navVerticalPadding: 10px 20px;

/*breadcrumb*/
@breadcrumbPadding:8px 0px;

/*tab*/
@tabPadding: 10px 15px;

/*inputnumber*/
@numberHeight:31px;
@numberHandler:15px;

/*page*/
@pageBtnSize:34px;