@bee-design/ui
Version:
Bee Design React UI Library.
1 lines • 4.56 kB
CSS
.bee-input-number{position:relative;display:inline-block;width:100%;box-sizing:border-box;border-radius:var(--bee-border-radius-small)}.bee-input-number-step-button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-color:var(--bee-color-neutral-3);background-color:var(--bee-color-fill-2);color:var(--bee-color-text-2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:all .1s cubic-bezier(0,0,1,1)}.bee-input-number-step-button:hover{border-color:var(--bee-color-fill-3);background-color:var(--bee-color-fill-3)}.bee-input-number-step-button:active{border-color:var(--bee-color-fill-4);background-color:var(--bee-color-fill-4)}.bee-input-number-step-button-disabled{cursor:not-allowed;background-color:var(--bee-color-fill-2);color:var(--bee-color-text-4)}.bee-input-number-step-button-disabled:active,.bee-input-number-step-button-disabled:hover{border-color:var(--bee-color-neutral-3);background-color:var(--bee-color-fill-2)}.bee-input-number-prefix,.bee-input-number-suffix{transition:all .1s cubic-bezier(0,0,1,1)}.bee-input-number-mode-embed .bee-input-number-step-layer{opacity:0;position:absolute;right:4px;top:4px;bottom:4px;width:18px;border-radius:1px;overflow:hidden;transition:all .1s cubic-bezier(0,0,1,1)}.bee-input-number-mode-embed .bee-input-number-step-layer .bee-input-number-step-button{width:100%;height:50%;font-size:10px}.bee-input-number-mode-embed:not(.bee-input-group-wrapper-disabled):hover .bee-input-number-step-layer{opacity:1}.bee-input-number-mode-embed:not(.bee-input-group-wrapper-disabled):hover .bee-input-number-step-layer~.bee-input-number-suffix{opacity:0;pointer-events:none}.bee-input-number-mode-embed .bee-input-inner-wrapper:not(.bee-input-inner-wrapper-focus) .bee-input-number-step-button:not(.bee-input-number-step-button-disabled):hover{background-color:var(--bee-color-fill-4)}.bee-input-number-mode-button .bee-input{text-align:center}.bee-input-number-mode-button .bee-input-group{position:relative}.bee-input-number-mode-button .bee-input-group-addafter,.bee-input-number-mode-button .bee-input-group-addbefore{padding:0}.bee-input-number-mode-button .bee-input-group .bee-input-number-step-button{position:absolute;top:0;height:100%;border:inherit}.bee-input-number-mode-button .bee-input-group .bee-input-number-step-button:active{border-color:var(--bee-color-fill-4)}.bee-input-number-mode-button .bee-input-group-addbefore .bee-input-number-step-button{left:0;border-right-color:var(--bee-color-neutral-3)}.bee-input-number-mode-button .bee-input-group-addafter .bee-input-number-step-button{right:0;border-left-color:var(--bee-color-neutral-3)}.bee-input-number-mode-button.bee-input-number-size-mini .bee-input-group-addafter,.bee-input-number-mode-button.bee-input-number-size-mini .bee-input-group-addbefore{width:24px}.bee-input-number-mode-button.bee-input-number-size-mini .bee-input-group-addafter .bee-input-number-step-button,.bee-input-number-mode-button.bee-input-number-size-mini .bee-input-group-addbefore .bee-input-number-step-button{width:24px}.bee-input-number-mode-button.bee-input-number-size-small .bee-input-group-addafter,.bee-input-number-mode-button.bee-input-number-size-small .bee-input-group-addbefore{width:28px}.bee-input-number-mode-button.bee-input-number-size-small .bee-input-group-addafter .bee-input-number-step-button,.bee-input-number-mode-button.bee-input-number-size-small .bee-input-group-addbefore .bee-input-number-step-button{width:28px}.bee-input-number-mode-button.bee-input-number-size-default .bee-input-group-addafter,.bee-input-number-mode-button.bee-input-number-size-default .bee-input-group-addbefore{width:32px}.bee-input-number-mode-button.bee-input-number-size-default .bee-input-group-addafter .bee-input-number-step-button,.bee-input-number-mode-button.bee-input-number-size-default .bee-input-group-addbefore .bee-input-number-step-button{width:32px}.bee-input-number-mode-button.bee-input-number-size-large .bee-input-group-addafter,.bee-input-number-mode-button.bee-input-number-size-large .bee-input-group-addbefore{width:36px}.bee-input-number-mode-button.bee-input-number-size-large .bee-input-group-addafter .bee-input-number-step-button,.bee-input-number-mode-button.bee-input-number-size-large .bee-input-group-addbefore .bee-input-number-step-button{width:36px}.bee-input-number-readonly .bee-input-number-step-button{pointer-events:none;color:var(--bee-color-text-4)}.bee-input-number-illegal-value input{color:rgb(var(--bee-danger-6))}