t-fighting-design/theme/checkbox-group.css

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

.f-checkbox-group{display:inline-flex;justify-content:center;align-items:center;transition:.3s;column-gap:22px}.f-checkbox-group.f-checkbox-group__vertical{flex-direction:column;row-gap:10px}.f-checkbox-group.f-checkbox-group__border{column-gap:0;row-gap:0}.f-checkbox-group.f-checkbox-group__large .f-checkbox{padding:0 30px;font-size:17px;height:40px}.f-checkbox-group.f-checkbox-group__large .f-checkbox .f-checkbox__text{font-size:16px}.f-checkbox-group.f-checkbox-group__middle .f-checkbox{padding:0 25px;font-size:16px;height:35px}.f-checkbox-group.f-checkbox-group__middle .f-checkbox .f-checkbox__text{font-size:15px}.f-checkbox-group.f-checkbox-group__small .f-checkbox{padding:0 20px;font-size:15px;height:30px}.f-checkbox-group.f-checkbox-group__small .f-checkbox .f-checkbox__text{font-size:14px}.f-checkbox-group.f-checkbox-group__mini .f-checkbox{padding:0 15px;font-size:14px;height:25px}.f-checkbox-group.f-checkbox-group__mini .f-checkbox .f-checkbox__text{font-size:13px}