fleet/frontend/components/forms/fields/InputFieldWithIcon/_styles.scss
Gabe Hernandez efb35b537a
add prettier and have it format all fleet application code (#625)
* add prettier and have it format all js code except website:
:

* trying running prettier check in CI

* fix runs on in CI

* change CI job name

* fix prettier erros and fix CI
2021-04-12 14:32:25 +01:00

73 lines
1.2 KiB
SCSS

.input-icon-field {
margin-top: 16px;
position: relative;
width: 100%;
&__icon {
position: absolute;
right: 6px;
top: 28px;
font-size: 18px;
color: $core-medium-blue-grey;
&--active {
color: $core-blue;
}
&--error {
color: $alert;
}
}
&__input {
border: 1px solid $ui-borders;
background-color: $ui-light-grey;
border-radius: 4px;
padding: 9px 30px 9px 16px;
font-size: $small;
text-indent: 1px;
position: relative;
width: 100%;
box-sizing: border-box;
color: $core-dark-blue-grey;
font-weight: $regular;
::placeholder {
color: $core-medium-blue-grey;
}
&:focus {
outline: none;
}
&--error {
border-bottom-color: $alert;
}
}
&__label {
font-size: $x-small;
font-weight: $bold;
margin-bottom: 4px;
}
&__errors {
font-size: $x-small;
}
&__hint {
font-size: $x-small;
font-style: italic;
font-weight: $regular;
line-height: 20px;
display: inline-block;
margin-top: 8px;
code {
color: $core-blue;
background-color: $ui-light-grey;
padding: 2px;
font-family: "SourceCodePro", $monospace;
}
}
}