textarea { resize: vertical; } input { border-radius: $border-radius-base; } input[type='text'].danger { background: $input-danger-bg !important; border-color: $red-400; text-shadow: 0 1px 1px $white-light; } .datetime-controls { select { width: 100px; } } .form-actions { margin-top: 0; margin-bottom: -$gl-padding; padding: $gl-padding; background-color: $gray-light; border-top: 1px solid $border-color; } label { &.inline-label { margin: 0; } &.label-bold { font-weight: $gl-font-weight-bold; } } .form-control-label { @extend .col-md-2; } .inline-input-group { width: 250px; } .custom-form-control { width: 150px; } @include media-breakpoint-up(sm) { .custom-form-control { width: 150px; } } /* Medium devices (desktops, 992px and up) */ @include media-breakpoint-up(md) { .custom-form-control { width: 170px; } } /* Large devices (large desktops, 1200px and up) */ @include media-breakpoint-up(lg) { .custom-form-control { width: 200px; } } .help-form .form-group { margin-left: 0; margin-right: 0; .form-control-label { font-weight: $gl-font-weight-bold; padding-top: 4px; } .form-control { height: 29px; background: $white-light; font-family: $monospace-font; } .input-group-prepend .btn, .input-group-append .btn { padding: 3px $gl-btn-padding; background-color: $gray-light; border: 1px solid $border-color; } .text-block { line-height: 0.8; padding-top: 9px; code { line-height: 1.8; } img { margin-right: $gl-padding; } } @include media-breakpoint-down(xs) { padding: 0 $gl-padding; .form-control-label, .text-block { padding-left: 0; } } } .fieldset-form fieldset { margin-bottom: 20px; } .form-control { @include box-shadow(none); border-radius: 2px; padding: $gl-vert-padding $gl-input-padding; &.input-short { width: $input-short-width; @include media-breakpoint-up(md) { width: $input-short-md-width; } } } .select-wrapper { position: relative; .fa-chevron-down { position: absolute; font-size: 10px; right: 10px; top: 12px; color: $gray-darkest; pointer-events: none; } } .select-control { padding-left: 10px; padding-right: 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none; &::-ms-expand { display: none; } } .form-control-inline { display: inline; } .wiki-content { margin-top: 35px; } .form-group .form-control-label, .form-group .form-control-label-full-width { font-weight: $gl-font-weight-normal; } .form-control::-webkit-input-placeholder { color: $gl-text-color-tertiary; } .input-group { .select2-container { display: table-cell; max-width: 180px; } .input-group-prepend, .input-group-append { background-color: $input-group-addon-bg; } .input-group-prepend:not(:first-child):not(:last-child), .input-group-append:not(:first-child):not(:last-child) { border-left: 0; border-right: 0; } } .form-text.text-muted { margin-bottom: 0; margin-top: #{$grid-size / 2}; } .gl-field-error { color: $red-500; } .gl-show-field-errors { .form-control:not(textarea) { height: 34px; } .gl-field-success-outline { border: 1px solid $green-600; &:focus { box-shadow: 0 0 0 1px $green-600 inset, 0 1px 1px $gl-field-focus-shadow inset, 0 0 4px 0 $green-600; border: 0 none; } } .gl-field-error-outline { border: 1px solid $red-500; &:focus { box-shadow: 0 0 0 1px $red-500 inset, 0 1px 1px $gl-field-focus-shadow inset, 0 0 4px 0 $gl-field-focus-shadow-error; border: 0 none; } } .gl-field-success-message { color: $green-600; } .gl-field-error-message { color: $red-500; } .gl-field-hint { color: $gl-text-color; } } @include media-breakpoint-down(xs) { .remember-me { .remember-me-checkbox { margin-top: 0; } } } .input-icon-wrapper { position: relative; .input-icon-right { position: absolute; right: 0.8em; top: 50%; transform: translateY(-50%); color: $theme-gray-600; } } .input-md { max-width: $input-md-width; width: 100%; } .input-lg { max-width: $input-lg-width; width: 100%; }