fix(components): Position validation hint relative to checkbox (#457)

Author: connor-baer

src/components/Checkbox/Checkbox.js

@@ -116,6 +116,8 @@ const inputStyles = ({ theme }) => css`
 
 const checkboxWrapperBaseStyles = ({ theme }) => css`
   label: checkbox;
+  position: relative;
+
   &:last-of-type {
     margin-bottom: ${theme.spacings.mega};
   }

src/components/Checkbox/__snapshots__/Checkbox.spec.js.snap

@@ -1,6 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Checkbox should render with a tooltip when passed a validation hint 1`] = `
+.circuit-6 {
+  position: relative;
+}
+
 .circuit-6:last-of-type {
   margin-bottom: 16px;
 }
@@ -158,6 +162,10 @@ exports[`Checkbox should render with a tooltip when passed a validation hint 1`]
 `;
 
 exports[`Checkbox should render with checked styles when passed the checked prop 1`] = `
+.circuit-4 {
+  position: relative;
+}
+
 .circuit-4:last-of-type {
   margin-bottom: 16px;
 }
@@ -269,6 +277,10 @@ exports[`Checkbox should render with checked styles when passed the checked prop
 `;
 
 exports[`Checkbox should render with default styles 1`] = `
+.circuit-4 {
+  position: relative;
+}
+
 .circuit-4:last-of-type {
   margin-bottom: 16px;
 }
@@ -380,6 +392,10 @@ exports[`Checkbox should render with default styles 1`] = `
 `;
 
 exports[`Checkbox should render with disabled styles when passed the disabled prop 1`] = `
+.circuit-4 {
+  position: relative;
+}
+
 .circuit-4:last-of-type {
   margin-bottom: 16px;
 }
@@ -509,6 +525,10 @@ exports[`Checkbox should render with disabled styles when passed the disabled pr
 `;
 
 exports[`Checkbox should render with invalid styles when passed the invalid prop 1`] = `
+.circuit-4 {
+  position: relative;
+}
+
 .circuit-4:last-of-type {
   margin-bottom: 16px;
 }