test-nut-ui
Version:
<p align="center"> <img alt="logo" src="https://img11.360buyimg.com/imagetools/jfs/t1/211965/25/7152/22022/61b16785E433119bb/aa41d7a9f7e823f3.png" width="150" style="margin-bottom: 10px;"> </p>
2 lines (1 loc) • 3.48 kB
CSS
.nut-checkboxgroup{display:flex;flex-wrap:wrap}.nut-checkboxgroup .nut-checkbox{margin:var(--nutui-radiogroup-radio-margin, 0 16px 16px 0)}.nut-checkboxgroup .nut-checkbox__label{margin:var(--nutui-radiogroup-radio-label-margin, 0 0 0 4px)}.nut-checkboxgroup--vertical .nut-checkbox.nut-checkbox--reverse{width:100%;justify-content:space-between}.nut-checkboxgroup--horizontal .nut-checkbox{display:inline-flex}.nut-checkbox{display:flex;align-items:center;box-sizing:border-box}.nut-checkbox--reverse{flex-direction:row-reverse}.nut-checkbox--reverse .nut-checkbox__label{margin-right:var(--nutui-radio-label-margin-left, 4px);margin-left:0}.nut-checkbox__button{display:inline-flex;align-items:center;padding:var(--nutui-radio-button-padding, 4px 16px);font-size:var(--nutui-radio-button-font-size, 14px);line-height:var(--nutui-radio-button-font-line-height, 22px);background:var(--nutui-radio-button-background, var(--nsui-gray-color-2, #F5F5F5));border-radius:var(--nutui-radio-button-border-radius, 16px);color:var(--nutui-radio-label-font-color, var(--nsui-gray-color-8, #595959));box-sizing:border-box;border:1px solid var(--nutui-radio-button-background, var(--nsui-gray-color-2, #F5F5F5))}.nut-checkbox__button--active{background:var(--nutui-radio-label-button-background, #F4F7FF);color:var(--nutui-radio-label-font-active-color, var(--nsui-brand-color-guide, #2C68FF));border:1px solid var(--nutui-radio-label-button-border-color, var(--nsui-brand-color-guide, #2C68FF))}.nut-checkbox__button--disabled{background:var(--nutui-radio-button-background, var(--nsui-gray-color-4, #E5E5E5));color:var(--nutui-radio-label-disable-color, var(--nsui-gray-color-6, #BFBFBF));border:1px solid var(--nutui-radio-button-background, var(--nsui-gray-color-4, #E5E5E5))}.nut-checkbox .nut-checkbox__button--active.nut-checkbox__button--disabled{background:var(--nutui-radio-button-disabled-active-background, #F4F7FF);color:var(--nutui-radio-button-disabled-active-color, #A3C6FF);border:1px solid var(--nutui-radio-button-disabled-active-border-color, #A3C6FF)}.nut-checkbox__label{margin-left:var(--nutui-radio-label-margin-left, 4px);font-size:var(--nutui-radio-label-font-size, 16px);color:var(--nutui-radio-label-font-color, var(--nsui-gray-color-8, #595959))}.nut-checkbox__label--disabled{color:var(--nutui-radio-label-disable-color, var(--nsui-gray-color-6, #BFBFBF))}.nut-checkbox__icon{color:var(--nutui-brand-color, #2C68FF);font-size:var(--nutui-radio-icon-font-size, 18px);transition-duration:.3s;transition-property:color,border-color,background-color}.nut-checkbox__icon--unchecked{color:var(--nutui-radio-icon-unchecked-color, var(--nsui-gray-color-5, #D9D9D9));font-size:var(--nutui-radio-icon-font-size, 18px)}.nut-checkbox__icon--indeterminate{color:var(--nutui-brand-color, #2C68FF);font-size:var(--nutui-radio-icon-font-size, 18px)}.nut-checkbox__icon--disable{color:var(--nutui-radio-icon-disable-color, var(--nsui-gray-color-3, #F0F0F0));font-size:var(--nutui-radio-icon-font-size, 18px)}.nut-checkbox--small .nut-checkbox__label{font-size:var(--nutui-radio-label-font-size-small, 14px);line-height:var(--nutui-radio-label-font-line-height-small, 22px)}.nut-checkbox--small .nut-checkbox__button{padding:var(--nutui-radio-button-padding-small, 2px 12px);font-size:var(--nutui-radio-button-font-size-small, 12px);line-height:var(--nutui-radio-button-font-line-height-small, 18px);border-radius:var(--nutui-radio-button-border-radius, 16px)}