Form tooltips don't use $tooltip variables

[bhrutledge]

Instead, they use hard-coded values:

bootstrap/scss/mixins/_forms.scss

Lines 38 to 51 in 779ad9f

	.#{$state}-tooltip {
	position: absolute;
	top: 100%;
	z-index: 5;
	display: none;
	max-width: 100%; // Contain to parent when possible
	padding: .5rem;
	margin-top: .1rem;
	font-size: .875rem;
	line-height: 1;
	color: $white;
	background-color: rgba($color, .8);
	border-radius: .2rem;
	}

Here's what I did in my project to make them look more like the other tooltips:

@each $state, $bg-color in (valid: $form-feedback-valid-color, invalid: $form-feedback-invalid-color) {
    .#{$state}-tooltip {
        background-color: rgba($bg-color, $tooltip-opacity);
        border-radius: if($enable-rounded, $border-radius, 0);
        color: color-yiq($bg-color);
        line-height: $line-height-base;
        font-size: $tooltip-font-size;
        padding: $tooltip-padding-y $tooltip-padding-x;
        z-index: $zindex-tooltip;
    }
}