2014-09-19 07:02:17 +00:00
|
|
|
textarea {
|
|
|
|
resize: vertical;
|
|
|
|
}
|
|
|
|
|
2016-01-22 02:18:03 +00:00
|
|
|
input {
|
2016-01-23 04:48:15 +00:00
|
|
|
border-radius: $border-radius-base;
|
2020-07-03 15:09:13 +00:00
|
|
|
color: $gl-text-color;
|
|
|
|
background-color: $input-bg;
|
2016-01-22 02:18:03 +00:00
|
|
|
}
|
|
|
|
|
2013-08-29 18:45:19 +00:00
|
|
|
input[type='text'].danger {
|
2016-11-30 13:25:25 +00:00
|
|
|
background: $input-danger-bg !important;
|
2018-08-22 16:40:38 +00:00
|
|
|
border-color: $red-400;
|
2020-03-31 00:08:09 +00:00
|
|
|
text-shadow: 0 1px 1px $white;
|
2013-08-29 18:45:19 +00:00
|
|
|
}
|
|
|
|
|
2013-11-12 12:28:12 +00:00
|
|
|
.datetime-controls {
|
|
|
|
select {
|
|
|
|
width: 100px;
|
|
|
|
}
|
|
|
|
}
|
2013-12-30 22:36:31 +00:00
|
|
|
|
|
|
|
.form-actions {
|
2015-12-02 13:48:06 +00:00
|
|
|
margin-top: 0;
|
|
|
|
margin-bottom: -$gl-padding;
|
|
|
|
padding: $gl-padding;
|
2016-12-12 22:26:21 +00:00
|
|
|
background-color: $gray-light;
|
2015-03-18 05:25:25 +00:00
|
|
|
border-top: 1px solid $border-color;
|
2015-01-06 05:48:04 +00:00
|
|
|
}
|
|
|
|
|
2014-01-04 17:27:09 +00:00
|
|
|
label {
|
2019-05-29 19:46:53 +00:00
|
|
|
font-weight: $gl-font-weight-bold;
|
|
|
|
|
2014-01-04 17:27:09 +00:00
|
|
|
&.inline-label {
|
|
|
|
margin: 0;
|
|
|
|
}
|
2016-02-29 11:37:27 +00:00
|
|
|
|
2021-03-02 18:11:20 +00:00
|
|
|
&.form-check-label,
|
|
|
|
&.custom-control-label {
|
2019-05-29 19:46:53 +00:00
|
|
|
font-weight: $gl-font-weight-normal;
|
|
|
|
}
|
|
|
|
|
2018-07-19 22:11:31 +00:00
|
|
|
&.label-bold {
|
2017-08-24 14:13:24 +00:00
|
|
|
font-weight: $gl-font-weight-bold;
|
2016-02-29 11:37:27 +00:00
|
|
|
}
|
2013-12-30 22:36:31 +00:00
|
|
|
}
|
2013-12-31 15:08:31 +00:00
|
|
|
|
2019-01-02 19:27:15 +00:00
|
|
|
.label-wrapper {
|
|
|
|
display: block;
|
|
|
|
margin: 0;
|
|
|
|
}
|
|
|
|
|
2013-12-31 15:08:31 +00:00
|
|
|
.inline-input-group {
|
|
|
|
width: 250px;
|
|
|
|
}
|
2014-01-04 17:27:09 +00:00
|
|
|
|
2014-02-14 10:30:12 +00:00
|
|
|
.custom-form-control {
|
|
|
|
width: 150px;
|
|
|
|
}
|
|
|
|
|
2018-04-09 15:26:28 +00:00
|
|
|
@include media-breakpoint-up(sm) {
|
2014-02-14 10:30:12 +00:00
|
|
|
.custom-form-control {
|
|
|
|
width: 150px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Medium devices (desktops, 992px and up) */
|
2018-04-09 15:26:28 +00:00
|
|
|
@include media-breakpoint-up(md) {
|
2014-02-14 10:30:12 +00:00
|
|
|
.custom-form-control {
|
|
|
|
width: 170px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Large devices (large desktops, 1200px and up) */
|
2018-04-09 15:26:28 +00:00
|
|
|
@include media-breakpoint-up(lg) {
|
2014-02-14 10:30:12 +00:00
|
|
|
.custom-form-control {
|
|
|
|
width: 200px;
|
|
|
|
}
|
|
|
|
}
|
2014-02-22 19:27:23 +00:00
|
|
|
|
2016-11-21 22:11:21 +00:00
|
|
|
.help-form .form-group {
|
|
|
|
margin-left: 0;
|
|
|
|
margin-right: 0;
|
2016-11-18 22:46:57 +00:00
|
|
|
|
2016-11-21 22:11:21 +00:00
|
|
|
.form-control {
|
2020-03-31 00:08:09 +00:00
|
|
|
background: $white;
|
2018-07-24 21:17:49 +00:00
|
|
|
font-family: $monospace-font;
|
2016-11-21 22:11:21 +00:00
|
|
|
}
|
2016-11-18 22:46:57 +00:00
|
|
|
|
2018-04-09 15:26:28 +00:00
|
|
|
@include media-breakpoint-down(xs) {
|
2016-11-21 22:11:21 +00:00
|
|
|
padding: 0 $gl-padding;
|
2016-11-18 22:46:57 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2014-06-03 10:05:06 +00:00
|
|
|
.fieldset-form fieldset {
|
|
|
|
margin-bottom: 20px;
|
|
|
|
}
|
2014-06-18 20:53:19 +00:00
|
|
|
|
|
|
|
.form-control {
|
2016-09-09 12:21:00 +00:00
|
|
|
@include box-shadow(none);
|
2019-02-14 17:26:17 +00:00
|
|
|
border-radius: $border-radius-default;
|
2016-06-06 18:11:49 +00:00
|
|
|
padding: $gl-vert-padding $gl-input-padding;
|
2018-05-23 07:17:24 +00:00
|
|
|
|
|
|
|
&.input-short {
|
|
|
|
width: $input-short-width;
|
|
|
|
|
2018-05-23 20:05:33 +00:00
|
|
|
@include media-breakpoint-up(md) {
|
2018-05-23 07:17:24 +00:00
|
|
|
width: $input-short-md-width;
|
|
|
|
}
|
|
|
|
}
|
2022-05-20 15:09:10 +00:00
|
|
|
|
|
|
|
&:focus {
|
2022-05-24 18:09:18 +00:00
|
|
|
border-color: $gray-400;
|
2022-05-20 15:09:10 +00:00
|
|
|
@include gl-focus;
|
|
|
|
}
|
2014-06-18 20:53:19 +00:00
|
|
|
}
|
2014-09-11 10:05:38 +00:00
|
|
|
|
2016-04-25 13:55:03 +00:00
|
|
|
.select-control {
|
|
|
|
padding-left: 10px;
|
|
|
|
padding-right: 10px;
|
2017-06-19 13:50:30 +00:00
|
|
|
appearance: none;
|
2019-03-14 20:52:01 +00:00
|
|
|
/* stylelint-disable property-no-vendor-prefix */
|
|
|
|
-webkit-appearance: none;
|
|
|
|
-moz-appearance: none;
|
|
|
|
/* stylelint-enable property-no-vendor-prefix */
|
2017-06-19 13:50:30 +00:00
|
|
|
|
|
|
|
&::-ms-expand {
|
|
|
|
display: none;
|
|
|
|
}
|
2016-04-25 13:55:03 +00:00
|
|
|
}
|
|
|
|
|
2015-12-31 20:08:42 +00:00
|
|
|
.form-control-inline {
|
|
|
|
display: inline;
|
|
|
|
}
|
|
|
|
|
2019-02-25 19:03:21 +00:00
|
|
|
.form-control::placeholder {
|
2018-08-14 16:44:08 +00:00
|
|
|
color: $gl-text-color-tertiary;
|
2015-10-05 19:18:21 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.input-group {
|
2018-04-12 20:32:55 +00:00
|
|
|
.input-group-prepend,
|
|
|
|
.input-group-append {
|
2016-11-30 13:25:25 +00:00
|
|
|
background-color: $input-group-addon-bg;
|
2015-10-05 19:18:21 +00:00
|
|
|
}
|
2016-10-14 20:39:08 +00:00
|
|
|
|
2018-04-12 20:32:55 +00:00
|
|
|
.input-group-prepend:not(:first-child):not(:last-child),
|
|
|
|
.input-group-append:not(:first-child):not(:last-child) {
|
2015-12-02 13:09:50 +00:00
|
|
|
border-left: 0;
|
|
|
|
border-right: 0;
|
|
|
|
}
|
2015-10-05 19:18:21 +00:00
|
|
|
}
|
2016-09-09 12:21:00 +00:00
|
|
|
|
2018-04-11 18:26:37 +00:00
|
|
|
.form-text.text-muted {
|
2016-09-09 12:21:00 +00:00
|
|
|
margin-bottom: 0;
|
2018-02-01 14:19:27 +00:00
|
|
|
margin-top: #{$grid-size / 2};
|
2019-04-17 07:55:06 +00:00
|
|
|
font-size: $gl-font-size;
|
2022-02-14 15:13:32 +00:00
|
|
|
|
|
|
|
.invisible {
|
|
|
|
visibility: hidden;
|
|
|
|
}
|
2016-09-09 12:21:00 +00:00
|
|
|
}
|
|
|
|
|
2019-03-22 19:04:41 +00:00
|
|
|
.gl-field-error,
|
|
|
|
.invalid-feedback {
|
2017-03-23 16:04:25 +00:00
|
|
|
color: $red-500;
|
2019-03-22 19:04:41 +00:00
|
|
|
font-size: $gl-font-size;
|
2016-09-09 12:21:00 +00:00
|
|
|
}
|
|
|
|
|
2016-11-02 10:35:21 +00:00
|
|
|
.gl-show-field-errors {
|
2018-08-01 23:08:22 +00:00
|
|
|
.form-control:not(textarea) {
|
2018-06-19 21:22:31 +00:00
|
|
|
height: 34px;
|
|
|
|
}
|
|
|
|
|
2016-10-21 11:49:09 +00:00
|
|
|
.gl-field-success-outline {
|
2017-03-23 16:04:25 +00:00
|
|
|
border: 1px solid $green-600;
|
2016-10-21 11:49:09 +00:00
|
|
|
|
|
|
|
&:focus {
|
2019-05-03 18:32:29 +00:00
|
|
|
box-shadow: 0 0 0 1px $green-600 inset, 0 1px 1px $gl-field-focus-shadow inset,
|
|
|
|
0 0 4px 0 $green-600;
|
2016-10-21 11:49:09 +00:00
|
|
|
border: 0 none;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-field-error-outline {
|
2017-03-23 16:04:25 +00:00
|
|
|
border: 1px solid $red-500;
|
2016-10-21 11:49:09 +00:00
|
|
|
|
|
|
|
&:focus {
|
2019-05-03 18:32:29 +00:00
|
|
|
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;
|
2016-10-21 11:49:09 +00:00
|
|
|
border: 0 none;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.gl-field-success-message {
|
2017-03-23 16:04:25 +00:00
|
|
|
color: $green-600;
|
2016-10-21 11:49:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.gl-field-error-message {
|
2017-03-23 16:04:25 +00:00
|
|
|
color: $red-500;
|
2016-10-21 11:49:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.gl-field-hint {
|
|
|
|
color: $gl-text-color;
|
|
|
|
}
|
|
|
|
}
|
2017-03-22 22:34:21 +00:00
|
|
|
|
2019-05-03 18:39:13 +00:00
|
|
|
.input-icon-wrapper,
|
|
|
|
.select-wrapper {
|
2018-06-29 14:34:26 +00:00
|
|
|
position: relative;
|
2019-05-03 18:39:13 +00:00
|
|
|
}
|
2018-06-29 14:34:26 +00:00
|
|
|
|
2019-05-03 18:39:13 +00:00
|
|
|
.input-icon-wrapper > .input-icon-right {
|
|
|
|
position: absolute;
|
|
|
|
right: 0.8em;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
2020-08-03 18:10:05 +00:00
|
|
|
color: $gray-400;
|
2018-06-29 14:34:26 +00:00
|
|
|
}
|
2018-07-06 14:36:02 +00:00
|
|
|
|
2018-12-18 14:38:21 +00:00
|
|
|
.input-md {
|
|
|
|
max-width: $input-md-width;
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
2018-07-06 14:36:02 +00:00
|
|
|
.input-lg {
|
2018-12-18 14:38:21 +00:00
|
|
|
max-width: $input-lg-width;
|
2018-07-06 14:36:02 +00:00
|
|
|
width: 100%;
|
|
|
|
}
|
2019-05-20 18:43:00 +00:00
|
|
|
|
|
|
|
.input-group-text {
|
|
|
|
max-height: $input-height;
|
|
|
|
}
|