docs: improve icons documentation

Author: mrholek

packages/docs/content/components/icon.mdx

@@ -257,7 +257,7 @@ export const LinearExample = () => {
       {icons.map((i, idx) => {
         return (
           <CCol className="mb-4" key={idx}>
-            <div className="p-3 py-4 mb-2 bg-light text-center rounded">
+            <div className="p-3 py-4 mb-2 bg-body-tertiary text-center rounded">
               <CIcon icon={icon[i]} size="xxl"/>
             </div>
             <div className="text-body-secondary text-center pt-1 small">{i}</div>
@@ -274,7 +274,7 @@ export const BrandExample = () => {
       {icons.map((i, idx) => {
         return (
           <CCol className="mb-4" key={idx}>
-            <div className="p-3 py-4 mb-2 bg-light text-center rounded">
+            <div className="p-3 py-4 mb-2 bg-body-tertiary text-center rounded">
               <CIcon icon={icon[i]} size="xxl"/>
             </div>
             <div className="text-body-secondary text-center pt-1 small">{i}</div>
@@ -291,7 +291,7 @@ export const FlagsExample = () => {
       {icons.map((i, idx) => {
         return (
           <CCol className="mb-4" key={idx}>
-            <div className="p-3 py-4 mb-2 bg-light text-center rounded">
+            <div className="p-3 py-4 mb-2 bg-body-tertiary text-center rounded">
               <CIcon icon={icon[i]} size="xxl"/>
             </div>
             <div className="text-body-secondary text-center pt-1 small">{i}</div>