// Forms .form-group:not(:last-child) { margin-bottom: 1rem; } form, .form-group { .label { display: block; margin-bottom: .5rem; } } .input { position: relative; display: block; width: 100%; max-width: 100%; height: 3.2rem; background-color: #fff; background-image: none; border: .1rem solid @control-color; border-radius: 3px; color: @body-font-color; font-size: 1.4rem; line-height: 1.6rem; padding: .7rem .8rem; -webkit-appearance: none; outline: 0; &:focus { border-color: @core-color; } &[disabled] { opacity: .75; background-color: #eeeff2; pointer-events: none; } // Input Small &.input-sm { height: 2.4rem; border-radius: 2px; font-size: 1.2rem; line-height: 1.4rem; padding: .4rem .6rem; } // Input Large &.input-lg { height: 4.2rem; border-radius: 4px; font-size: 1.8rem; line-height: 2rem; padding: 1rem 1.2rem; } // Input Inlines &.input-inline { width: auto; display: inline-block; } // Status &.is-success { border-color: @control-color-success; } &.is-danger { border-color: @control-color-danger; } // TODO: Input with icons }