@brizy/ui
Version:
React elements in Brizy style
1 lines • 8.04 kB
CSS
.brz-ui-input__number.brz-ui-input-number{width:100%;font-weight:600;font-size:12px;height:38px;transition:none;border-color:var(--brz-ui-global-input-border-color,var(--brz-ui-input-border-color,var(--color-gray-light,#d5d9db)))}.brz-ui-input__number.brz-ui-input-number:hover{border-color:var(--brz-ui-global-input-border-color,var(--brz-ui-input-border-color,var(--color-gray-light,#d5d9db)))}.brz-ui-input__number.brz-ui-input-number input{height:38px}.brz-ui-input__number.brz-ui-input-number-sm{height:30px}.brz-ui-input__number.brz-ui-input-number-sm .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler .anticon{margin-inline-end:1px}.brz-ui-input__number.brz-ui-input-number-lg{height:48px}.brz-ui-input__number.brz-ui-input-number-lg .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler .anticon{margin-inline-end:5px}.brz-ui-input__number.brz-ui-input-number-sm input.brz-ui-input-number-input{height:30px;padding:5.5px 10px}.brz-ui-input__number.brz-ui-input-number-lg input.brz-ui-input-number-input{padding:14px 25px;height:48px;font-size:15px}.brz-ui-input__number.brz-ui-input-number.brz-ui-input-number-focused{box-shadow:none;border-color:var(--brz-ui-global-input-border-color,var(--brz-ui-input-border-color,var(--color-gray-light,#d5d9db)))}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-input{font-weight:inherit;padding:11px 14px}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-input::-webkit-input-placeholder{font-weight:400;color:var(--color-gray-mid,#a1a8ad)}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-input:-moz-placeholder{font-weight:400;color:var(--color-gray-mid,#a1a8ad)}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-input::placeholder{font-weight:400;color:var(--color-gray-mid,#a1a8ad)}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap{width:25px;opacity:1;border:none;background:0 0}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler{border:none}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler,.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler:hover{height:50%}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler .anticon{width:0;height:0;margin-inline-end:3px;border-style:solid;border-width:5px 4px 0;border-color:var(--color-gray-mid,#a1a8ad) transparent transparent transparent;transition:.3s ease-in}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler .anticon svg{display:none}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler-up .anticon{margin-top:-2px;border-width:0 4px 5px;border-color:transparent transparent var(--color-gray-mid,#a1a8ad)}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler-down .anticon{margin-top:-2px;border-width:5px 4px 0;border-color:var(--color-gray-mid,#a1a8ad) transparent transparent transparent}.brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-handler-wrap .brz-ui-input-number-handler:not(.brz-ui-input-number-handler-down .brz-ui-input-number-handler-down-disabled,.brz-ui-input-number-handler-up .brz-ui-input-number-handler-up-disabled):hover .anticon{border-color:var(--color-blue,#3dbfe8) transparent var(--color-blue,#3dbfe8) transparent}.brz-ui-input__number.brz-ui-input-number.brz-ui-input__number__buttons-disabled .brz-ui-input-number-handler-wrap{display:none}.brz-ui-input__number.brz-ui-input-number.brz-ui-input-number.brz-ui-input-number-disabled{opacity:.5}.brz-ui-input__number.brz-ui-input-number.brz-ui-input-number.brz-ui-input-number-disabled .brz-ui-input-number-handler-wrap{display:block;pointer-events:none}.brz-ui-input__number--custom{display:flex;position:relative}.brz-ui-input__number--custom .brz-ui-input__number--suffix{position:absolute;inset-inline-end:37px;top:0;height:100%}.brz-ui-input__number--custom .brz-ui-input__number--prefix{background-color:var(--brz-ui-global-input-background,var(--brz-ui-input-background,var(--color-white,#fff)));border-radius:0;border-start-start-radius:3px;border-end-start-radius:3px;padding:0;padding-inline-start:16px;padding-inline-end:4px;border:1px solid var(--brz-ui-global-input-border-color,var(--brz-ui-input-border-color,var(--color-gray-light,#d5d9db)));border-inline-end:none}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore,.brz-ui-input__number--custom .brz-ui-input__number--prefix,.brz-ui-input__number--custom .brz-ui-input__number--suffix{font-weight:600;color:var(--brz-ui-global-input-color,var(--brz-ui-input-color,var(--color-gray,#777f86)));display:flex;align-items:center}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore{padding:0 10px;justify-content:center;background:var(--brz-ui-global-input-background,var(--brz-ui-input-background,var(--color-white,#fff)));border:1px solid var(--brz-ui-global-input-border-color,var(--brz-ui-input-border-color,var(--color-gray-light,#d5d9db)))}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter .brz-ui-select.brz-ui-select,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore .brz-ui-select.brz-ui-select{margin:0 -10px;width:70px}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter .brz-ui-select.brz-ui-select-lg>.brz-ui-select-selector,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore .brz-ui-select.brz-ui-select-lg>.brz-ui-select-selector{height:45px}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter .brz-ui-select.brz-ui-select>.brz-ui-select-selector,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore .brz-ui-select.brz-ui-select>.brz-ui-select-selector{height:36px;padding:0 10px;color:var(--color-gray-mid,#a1a8ad);border:none;background-color:#fafafa}.brz-ui-input__number--custom .brz-ui-input__number--addonAfter .brz-ui-select.brz-ui-select.brz-ui-select-focused>.brz-ui-select-selector,.brz-ui-input__number--custom .brz-ui-input__number--addonBefore .brz-ui-select.brz-ui-select.brz-ui-select-focused>.brz-ui-select-selector{border:none;box-shadow:none}.brz-ui-input__number--custom>.brz-ui-input__number--addonBefore{border-radius:0;border-start-start-radius:3px;border-end-start-radius:3px;border-inline-end:none}.brz-ui-input__number--custom>.brz-ui-input__number--addonAfter{border-radius:0;border-start-end-radius:3px;border-end-end-radius:3px;border-inline-start:none}.brz-ui-input__number--custom--prefix .brz-ui-input__number.brz-ui-input-number{border-inline-start:none;border-radius:0;border-start-end-radius:3px;border-end-end-radius:3px}.brz-ui-input__number--custom--prefix .brz-ui-input__number.brz-ui-input-number .brz-ui-input-number-input{padding-inline-start:0}.brz-ui-input__number--custom--addonAfter .brz-ui-input__number.brz-ui-input-number{border-radius:0;border-start-start-radius:3px;border-end-start-radius:3px}.brz-ui-input__number--custom--addonBefore .brz-ui-input__number.brz-ui-input-number{border-radius:0;border-start-end-radius:3px;border-end-end-radius:3px}.brz-ui-input__number--custom--prefix.brz-ui-input__number--custom--addonBefore .brz-ui-input__number--prefix{border-radius:0}.brz-ui-input__number--custom--suffix.brz-ui-input__number--custom--addonAfter .brz-ui-input__number--suffix{position:absolute;inset-inline-end:100px}.brz-ui-input__number--custom--suffix.brz-ui-input__number--custom--addonAfter .brz-ui-input__number.brz-ui-input-number{border-radius:0}.brz-ui-input__number--custom--disabled{cursor:not-allowed;background-color:var(--color-white,#fff);border-radius:3px}.brz-ui-input__number--custom--disabled>*{opacity:.5;pointer-events:none}