meri-design/dist/theme/Input.css

基于vue框架的ui库

/*!
 * @meri-design v2.2.19-beta10
 * (c) 2019-2022 YuShu-Web
 * Released under the MIT License.
 * 2025-01-14 15:25:40
 */.p-icon{cursor:pointer;font-size:0;text-align:center}.p-icon+.p-icon{margin-left:8px}.p-icon svg{vertical-align:middle}.p-icon svg path{transition:fill .3s}.p-textarea.p-textarea-max .p-textarea-max-error-info{bottom:-20px;color:#f55047;font-size:14px;height:18px;left:12px;line-height:18px;position:absolute}.p-textarea.p-textarea-max .p-word-num{color:#f55047}.p-textarea.p-textarea-max .p-textarea-box,.p-textarea.p-textarea-max .p-textarea-box:hover{border:1px solid #f55047}.p-textarea{background-color:#fff;display:inline-flex;position:relative}.p-textarea+.p-textarea{margin-left:28px}.p-textarea .p-word-num{bottom:2px;color:#8b949e;font-size:12px;height:20px;line-height:20px;position:absolute;right:8px}.p-textarea .p-textarea-placeholder{color:#c4c9cf;font-size:14px;left:8px;pointer-events:none;position:absolute;top:8px;z-index:1}.p-textarea .p-textarea-box{background:none;border:1px solid #c4c9cf;border-radius:4px;caret-color:#246fe5;color:#1b2129;margin:0;max-width:600px;outline:none;overflow-y:auto;padding:8px;transition:all .3s;width:600px}.p-textarea .p-textarea-box.p-textarea-resize{resize:none}.p-textarea .p-textarea-box:hover{border-color:#246fe5}.p-textarea .p-textarea-box:active{border-color:#215dd9}.p-textarea.p-input-focus{box-shadow:none!important}.p-textarea.p-input-focus .p-textarea-box{border-color:#246fe5}.p-input{align-items:center;border:1px solid #c4c9cf;border-radius:4px;display:inline-flex;font-size:0;height:32px;max-width:600px;padding-left:8px;padding-right:8px;transition:border .3s,box-shadow .3s;width:240px}.p-input+.p-input{margin-left:28px}.p-input .left-button{border-bottom-left-radius:4px;border-right:1px solid #c4c9cf;border-top-left-radius:4px;margin-left:-8px;margin-right:8px}.p-input .right-button{border-bottom-right-radius:4px;border-left:1px solid #c4c9cf;border-top-right-radius:4px;margin-left:8px;margin-right:-8px}.p-input .left-button,.p-input .right-button{cursor:pointer;height:30px;line-height:30px;width:76px}.p-input .left-button .left-button-text,.p-input .left-button .right-button-text,.p-input .right-button .left-button-text,.p-input .right-button .right-button-text{color:#1b2129;font-size:14px;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap}.p-input:hover{border-color:#246fe5}.p-input:active{border-color:#215dd9}.p-input:after,.p-input:before{color:transparent;content:" "}.p-input .p-input-box{flex:1;font-size:14px;height:30px;position:relative}.p-input .p-input-box .p-placeholder,.p-input .p-input-box input{height:30px;line-height:30px}.p-input .p-input-box input{background:none;border:0;caret-color:#246fe5;color:#1b2129;margin:0;outline:none;padding:0;position:relative;width:100%;z-index:2}.p-input .p-input-box .p-placeholder{color:#c4c9cf;left:0;overflow:hidden;position:absolute;top:0;width:100%;z-index:1}.p-input .p-input-icon-clear{cursor:pointer;height:30px;line-height:30px;padding-left:8px}.p-input .p-input-icon-clear svg{height:14px;transition:all .3s;vertical-align:middle;width:14px}.p-input .p-input-icon-clear svg path{transition:all .3s}.p-input .p-input-icon-clear:hover path{fill:#246fe5}.p-input .p-input-icon-clear:active path{fill:#215dd9}.p-input .p-input-icon-search{padding-right:8px;text-align:center}.p-input .p-input-icon-search .p-icon{height:30px;line-height:30px;width:16px}.p-input .p-input-icon-search .p-icon svg{vertical-align:middle}.p-input-focus{border-color:#246fe5}.p-input.p-input-disabled,.p-textarea.p-input-disabled{background-color:#e8ecf0;border-color:#c4c9cf;cursor:not-allowed}.p-input.p-input-disabled textarea.p-textarea-box,.p-textarea.p-input-disabled textarea.p-textarea-box{color:#c4c9cf;cursor:not-allowed}.p-input.p-input-disabled textarea.p-textarea-box:hover,.p-input.p-input-disabled:hover,.p-textarea.p-input-disabled textarea.p-textarea-box:hover,.p-textarea.p-input-disabled:hover{border-color:#c4c9cf}.p-input.p-input-error,.p-textarea.p-input-error{border-color:#f55047;position:relative}.p-input.p-input-error .p-input-box input,.p-textarea.p-input-error .p-input-box input{caret-color:#f55047}.p-input.p-input-error textarea.p-textarea-box,.p-textarea.p-input-error textarea.p-textarea-box{border-color:#f8766f;caret-color:#f55047}.p-input.p-input-error textarea.p-textarea-box:hover,.p-textarea.p-input-error textarea.p-textarea-box:hover{border-color:#f8766f}.p-input.p-input-error .p-input-error-info,.p-textarea.p-input-error .p-input-error-info{bottom:-20px;color:#f55047;font-size:14px;height:18px;left:0;line-height:18px;position:absolute}.p-input.p-input-error:hover,.p-textarea.p-input-error:hover{border-color:#f55047}.p-input-finish input,.p-input-finish textarea{cursor:pointer}