fleet/frontend/components/forms/FormField/_styles.scss
Martavis Parker 33c5f0651c
New tooltips! (#4326)
* Allow sort by more than one key

* created custom tooltip component

* remove unused code

* fixed style for more layouts

* added tooltip to query side panel

* tooltips added to setting form

* finished settings form

* added tooltip for perf impact table headers

* tooltip for pack table and user form

* tooltip on manage policies page

* tooltip for manage schedules

* tooltip for automations; spacing for form input

* tooltip for automations modal

* user form; fixed input with icon component

* more user form tooltips

* tooltip for homepage; style fixes

* replaced many more tooltips with new version

* added story for tooltip

* added position prop

* fixed tests

* re-work how we click react-select dropdowns

* forcing the update button click

* trying a blur

* fixed typo

* trying blur on another element

* temp check-in

* replaced tooltip from host details software

* more consolidation of tooltip use for software

* fixed settings flow test

Co-authored-by: Tomas Touceda <chiiph@gmail.com>
2022-02-28 13:25:06 -08:00

40 lines
739 B
SCSS

.form-field {
margin-bottom: $pad-large;
&__label {
font-size: $x-small;
font-weight: $bold;
color: $core-fleet-black;
display: block;
margin-bottom: $pad-xsmall;
&--error {
font-weight: $bold;
color: $core-vibrant-red;
}
&[data-has-tooltip="true"] {
margin-bottom: $pad-small;
}
}
&__hint {
font-size: $x-small;
font-style: italic;
font-weight: $regular;
line-height: 20px;
display: inline-block;
margin-top: $pad-small;
code {
color: $core-vibrant-blue;
background-color: $ui-light-grey;
padding: $pad-xxsmall;
font-family: "SourceCodePro", $monospace;
}
}
&--checkbox {
margin-bottom: $pad-medium;
}
}