From f0c05858329430c9487bdcfcf36d0aa98f60776d Mon Sep 17 00:00:00 2001
From: xidedix <xidedix@users.noreply.github.com>
Date: Mon, 14 Dec 2020 18:09:23 +0100
Subject: [PATCH] fix(BrandButtons): minor temp fixes with stylings

---
 src/scss/_fixes.scss                          |  16 ++
 src/scss/style.scss                           |   3 +
 .../buttons/brand-buttons/BrandButtons.js     | 178 +++++++++---------
 3 files changed, 108 insertions(+), 89 deletions(-)
 create mode 100644 src/scss/_fixes.scss

diff --git a/src/scss/_fixes.scss b/src/scss/_fixes.scss
new file mode 100644
index 0000000..93d3535
--- /dev/null
+++ b/src/scss/_fixes.scss
@@ -0,0 +1,16 @@
+// todo: disabled button styles
+button {
+  &:disabled {
+    cursor: default;
+  }
+  &.disabled {
+    cursor: default;
+  }
+}
+
+// todo: brand button icon margin
+.btn-brand:not(:only-child) {
+  .c-icon {
+    margin-top: 0 !important;
+  }
+}
diff --git a/src/scss/style.scss b/src/scss/style.scss
index 6347a09..e993a80 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -4,5 +4,8 @@
 // Import CoreUI styles
 @import "~@coreui/coreui/scss/coreui.scss";
 
+// Some temp fixes
+@import "fixes";
+
 // If you want to add something do it here
 @import "custom";
diff --git a/src/views/buttons/brand-buttons/BrandButtons.js b/src/views/buttons/brand-buttons/BrandButtons.js
index 0805822..931b97e 100644
--- a/src/views/buttons/brand-buttons/BrandButtons.js
+++ b/src/views/buttons/brand-buttons/BrandButtons.js
@@ -19,68 +19,68 @@ const BrandButtons = () => {
           </CCardHeader>
           <CCardBody>
             <h6>Size Small
-              <small> Add this class <code>.btn-sm</code></small>
+              <small> <code>size="sm"</code></small>
             </h6>
             <p>
-              <CButton size="sm" className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /><span>Facebook</span></CButton>
-              <CButton size="sm" className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /><span>Twitter</span></CButton>
-              <CButton size="sm" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /><span>LinkedIn</span></CButton>
-              <CButton size="sm" className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /><span>Flickr</span></CButton>
-              <CButton size="sm" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /><span>Tumblr</span></CButton>
-              <CButton size="sm" className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /><span>Xing</span></CButton>
-              <CButton size="sm" className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /><span>Github</span></CButton>
-              <CButton size="sm" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /><span>StackOverflow</span></CButton>
-              <CButton size="sm" className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /><span>YouTube</span></CButton>
-              <CButton size="sm" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /><span>Dribbble</span></CButton>
-              <CButton size="sm" className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /><span>Instagram</span></CButton>
-              <CButton size="sm" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /><span>Pinterest</span></CButton>
-              <CButton size="sm" className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /><span>VK</span></CButton>
-              <CButton size="sm" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /><span>Yahoo</span></CButton>
-              <CButton size="sm" className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /><span>Behance</span></CButton>
-              <CButton size="sm" className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /><span>Reddit</span></CButton>
-              <CButton size="sm" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /><span>Vimeo</span></CButton>
+              <CButton size="sm" className="btn-facebook btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-facebook" /><span className="mfs-2">Facebook</span></CButton>
+              <CButton size="sm" className="btn-twitter btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-twitter" /><span className="mfs-2">Twitter</span></CButton>
+              <CButton size="sm" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-linkedin" /><span className="mfs-2">LinkedIn</span></CButton>
+              <CButton size="sm" className="btn-flickr btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-flickr" /><span className="mfs-2">Flickr</span></CButton>
+              <CButton size="sm" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-tumblr" /><span className="mfs-2">Tumblr</span></CButton>
+              <CButton size="sm" className="btn-xing btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-xing" /><span className="mfs-2">Xing</span></CButton>
+              <CButton size="sm" className="btn-github btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-github" /><span className="mfs-2">Github</span></CButton>
+              <CButton size="sm" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-stackoverflow" /><span className="mfs-2">StackOverflow</span></CButton>
+              <CButton size="sm" className="btn-youtube btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-youtube" /><span className="mfs-2">YouTube</span></CButton>
+              <CButton size="sm" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-dribbble" /><span className="mfs-2">Dribbble</span></CButton>
+              <CButton size="sm" className="btn-instagram btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-instagram" /><span className="mfs-2">Instagram</span></CButton>
+              <CButton size="sm" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-pinterest" /><span className="mfs-2">Pinterest</span></CButton>
+              <CButton size="sm" className="btn-vk btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-vk" /><span className="mfs-2">VK</span></CButton>
+              <CButton size="sm" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-yahoo" /><span className="mfs-2">Yahoo</span></CButton>
+              <CButton size="sm" className="btn-behance btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-behance" /><span className="mfs-2">Behance</span></CButton>
+              <CButton size="sm" className="btn-reddit btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-reddit" /><span className="mfs-2">Reddit</span></CButton>
+              <CButton size="sm" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-vimeo" /><span className="mfs-2">Vimeo</span></CButton>
             </p>
             <h6>Size Normal</h6>
             <p>
-              <CButton className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /><span>Facebook</span></CButton>
-              <CButton className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /><span>Twitter</span></CButton>
-              <CButton className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /><span>LinkedIn</span></CButton>
-              <CButton className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /><span>Flickr</span></CButton>
-              <CButton className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /><span>Tumblr</span></CButton>
-              <CButton className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /><span>Xing</span></CButton>
-              <CButton className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /><span>Github</span></CButton>
-              <CButton className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /><span>StackOverflow</span></CButton>
-              <CButton className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /><span>YouTube</span></CButton>
-              <CButton className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /><span>Dribbble</span></CButton>
-              <CButton className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /><span>Instagram</span></CButton>
-              <CButton className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /><span>Pinterest</span></CButton>
-              <CButton className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /><span>VK</span></CButton>
-              <CButton className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /><span>Yahoo</span></CButton>
-              <CButton className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /><span>Behance</span></CButton>
-              <CButton className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /><span>Reddit</span></CButton>
-              <CButton className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /><span>Vimeo</span></CButton>
+              <CButton className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /><span className="mfs-2">Facebook</span></CButton>
+              <CButton className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /><span className="mfs-2">Twitter</span></CButton>
+              <CButton className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /><span className="mfs-2">LinkedIn</span></CButton>
+              <CButton className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /><span className="mfs-2">Flickr</span></CButton>
+              <CButton className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /><span className="mfs-2">Tumblr</span></CButton>
+              <CButton className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /><span className="mfs-2">Xing</span></CButton>
+              <CButton className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /><span className="mfs-2">Github</span></CButton>
+              <CButton className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /><span className="mfs-2">StackOverflow</span></CButton>
+              <CButton className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /><span className="mfs-2">YouTube</span></CButton>
+              <CButton className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /><span className="mfs-2">Dribbble</span></CButton>
+              <CButton className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /><span className="mfs-2">Instagram</span></CButton>
+              <CButton className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /><span className="mfs-2">Pinterest</span></CButton>
+              <CButton className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /><span className="mfs-2">VK</span></CButton>
+              <CButton className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /><span className="mfs-2">Yahoo</span></CButton>
+              <CButton className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /><span className="mfs-2">Behance</span></CButton>
+              <CButton className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /><span className="mfs-2">Reddit</span></CButton>
+              <CButton className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /><span className="mfs-2">Vimeo</span></CButton>
             </p>
             <h6>Size Large
-              <small> Add this class <code>.btn-lg</code></small>
+              <small> <code>size="lg"</code></small>
             </h6>
             <p>
-              <CButton size="lg" className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /><span>Facebook</span></CButton>
-              <CButton size="lg" className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /><span>Twitter</span></CButton>
-              <CButton size="lg" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /><span>LinkedIn</span></CButton>
-              <CButton size="lg" className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /><span>Flickr</span></CButton>
-              <CButton size="lg" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /><span>Tumblr</span></CButton>
-              <CButton size="lg" className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /><span>Xing</span></CButton>
-              <CButton size="lg" className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /><span>Github</span></CButton>
-              <CButton size="lg" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /><span>StackOverflow</span></CButton>
-              <CButton size="lg" className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /><span>YouTube</span></CButton>
-              <CButton size="lg" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /><span>Dribbble</span></CButton>
-              <CButton size="lg" className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /><span>Instagram</span></CButton>
-              <CButton size="lg" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /><span>Pinterest</span></CButton>
-              <CButton size="lg" className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /><span>VK</span></CButton>
-              <CButton size="lg" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /><span>Yahoo</span></CButton>
-              <CButton size="lg" className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /><span>Behance</span></CButton>
-              <CButton size="lg" className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /><span>Reddit</span></CButton>
-              <CButton size="lg" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /><span>Vimeo</span></CButton>
+              <CButton size="lg" className="btn-facebook btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-facebook" /><span className="mfs-2">Facebook</span></CButton>
+              <CButton size="lg" className="btn-twitter btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-twitter" /><span className="mfs-2">Twitter</span></CButton>
+              <CButton size="lg" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-linkedin" /><span className="mfs-2">LinkedIn</span></CButton>
+              <CButton size="lg" className="btn-flickr btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-flickr" /><span className="mfs-2">Flickr</span></CButton>
+              <CButton size="lg" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-tumblr" /><span className="mfs-2">Tumblr</span></CButton>
+              <CButton size="lg" className="btn-xing btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-xing" /><span className="mfs-2">Xing</span></CButton>
+              <CButton size="lg" className="btn-github btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-github" /><span className="mfs-2">Github</span></CButton>
+              <CButton size="lg" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-stackoverflow" /><span className="mfs-2">StackOverflow</span></CButton>
+              <CButton size="lg" className="btn-youtube btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-youtube" /><span className="mfs-2">YouTube</span></CButton>
+              <CButton size="lg" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-dribbble" /><span className="mfs-2">Dribbble</span></CButton>
+              <CButton size="lg" className="btn-instagram btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-instagram" /><span className="mfs-2">Instagram</span></CButton>
+              <CButton size="lg" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-pinterest" /><span className="mfs-2">Pinterest</span></CButton>
+              <CButton size="lg" className="btn-vk btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-vk" /><span className="mfs-2">VK</span></CButton>
+              <CButton size="lg" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-yahoo" /><span className="mfs-2">Yahoo</span></CButton>
+              <CButton size="lg" className="btn-behance btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-behance" /><span className="mfs-2">Behance</span></CButton>
+              <CButton size="lg" className="btn-reddit btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-reddit" /><span className="mfs-2">Reddit</span></CButton>
+              <CButton size="lg" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-vimeo" /><span className="mfs-2">Vimeo</span></CButton>
             </p>
           </CCardBody>
         </CCard>
@@ -94,26 +94,26 @@ const BrandButtons = () => {
           </CCardHeader>
           <CCardBody>
             <h6>Size Small
-              <small> Add this class <code>.btn-sm</code></small>
+              <small> <code>size="sm"</code></small>
             </h6>
             <p>
-              <CButton size="sm" className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /></CButton>
-              <CButton size="sm" className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /></CButton>
-              <CButton size="sm" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /></CButton>
-              <CButton size="sm" className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /></CButton>
-              <CButton size="sm" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /></CButton>
-              <CButton size="sm" className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /></CButton>
-              <CButton size="sm" className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /></CButton>
-              <CButton size="sm" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /></CButton>
-              <CButton size="sm" className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /></CButton>
-              <CButton size="sm" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /></CButton>
-              <CButton size="sm" className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /></CButton>
-              <CButton size="sm" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /></CButton>
-              <CButton size="sm" className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /></CButton>
-              <CButton size="sm" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /></CButton>
-              <CButton size="sm" className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /></CButton>
-              <CButton size="sm" className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /></CButton>
-              <CButton size="sm" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /></CButton>
+              <CButton size="sm" className="btn-facebook btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-facebook" /></CButton>
+              <CButton size="sm" className="btn-twitter btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-twitter" /></CButton>
+              <CButton size="sm" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-linkedin" /></CButton>
+              <CButton size="sm" className="btn-flickr btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-flickr" /></CButton>
+              <CButton size="sm" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-tumblr" /></CButton>
+              <CButton size="sm" className="btn-xing btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-xing" /></CButton>
+              <CButton size="sm" className="btn-github btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-github" /></CButton>
+              <CButton size="sm" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-stackoverflow" /></CButton>
+              <CButton size="sm" className="btn-youtube btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-youtube" /></CButton>
+              <CButton size="sm" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-dribbble" /></CButton>
+              <CButton size="sm" className="btn-instagram btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-instagram" /></CButton>
+              <CButton size="sm" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-pinterest" /></CButton>
+              <CButton size="sm" className="btn-vk btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-vk" /></CButton>
+              <CButton size="sm" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-yahoo" /></CButton>
+              <CButton size="sm" className="btn-behance btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-behance" /></CButton>
+              <CButton size="sm" className="btn-reddit btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-reddit" /></CButton>
+              <CButton size="sm" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon size="sm" name="cib-vimeo" /></CButton>
             </p>
             <h6>Size Normal</h6>
             <p>
@@ -136,26 +136,26 @@ const BrandButtons = () => {
               <CButton className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /></CButton>
             </p>
             <h6>Size Large
-              <small> Add this class <code>.btn-lg</code></small>
+              <small> <code>size="lg"</code></small>
             </h6>
             <p>
-              <CButton size="lg" className="btn-facebook btn-brand mr-1 mb-1"><CIcon name="cib-facebook" /></CButton>
-              <CButton size="lg" className="btn-twitter btn-brand mr-1 mb-1"><CIcon name="cib-twitter" /></CButton>
-              <CButton size="lg" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon name="cib-linkedin" /></CButton>
-              <CButton size="lg" className="btn-flickr btn-brand mr-1 mb-1"><CIcon name="cib-flickr" /></CButton>
-              <CButton size="lg" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon name="cib-tumblr" /></CButton>
-              <CButton size="lg" className="btn-xing btn-brand mr-1 mb-1"><CIcon name="cib-xing" /></CButton>
-              <CButton size="lg" className="btn-github btn-brand mr-1 mb-1"><CIcon name="cib-github" /></CButton>
-              <CButton size="lg" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon name="cib-stackoverflow" /></CButton>
-              <CButton size="lg" className="btn-youtube btn-brand mr-1 mb-1"><CIcon name="cib-youtube" /></CButton>
-              <CButton size="lg" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon name="cib-dribbble" /></CButton>
-              <CButton size="lg" className="btn-instagram btn-brand mr-1 mb-1"><CIcon name="cib-instagram" /></CButton>
-              <CButton size="lg" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon name="cib-pinterest" /></CButton>
-              <CButton size="lg" className="btn-vk btn-brand mr-1 mb-1"><CIcon name="cib-vk" /></CButton>
-              <CButton size="lg" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon name="cib-yahoo" /></CButton>
-              <CButton size="lg" className="btn-behance btn-brand mr-1 mb-1"><CIcon name="cib-behance" /></CButton>
-              <CButton size="lg" className="btn-reddit btn-brand mr-1 mb-1"><CIcon name="cib-reddit" /></CButton>
-              <CButton size="lg" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon name="cib-vimeo" /></CButton>
+              <CButton size="lg" className="btn-facebook btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-facebook" /></CButton>
+              <CButton size="lg" className="btn-twitter btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-twitter" /></CButton>
+              <CButton size="lg" className="btn-linkedin btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-linkedin" /></CButton>
+              <CButton size="lg" className="btn-flickr btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-flickr" /></CButton>
+              <CButton size="lg" className="btn-tumblr btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-tumblr" /></CButton>
+              <CButton size="lg" className="btn-xing btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-xing" /></CButton>
+              <CButton size="lg" className="btn-github btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-github" /></CButton>
+              <CButton size="lg" className="btn-stack-overflow btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-stackoverflow" /></CButton>
+              <CButton size="lg" className="btn-youtube btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-youtube" /></CButton>
+              <CButton size="lg" className="btn-dribbble btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-dribbble" /></CButton>
+              <CButton size="lg" className="btn-instagram btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-instagram" /></CButton>
+              <CButton size="lg" className="btn-pinterest btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-pinterest" /></CButton>
+              <CButton size="lg" className="btn-vk btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-vk" /></CButton>
+              <CButton size="lg" className="btn-yahoo btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-yahoo" /></CButton>
+              <CButton size="lg" className="btn-behance btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-behance" /></CButton>
+              <CButton size="lg" className="btn-reddit btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-reddit" /></CButton>
+              <CButton size="lg" className="btn-vimeo btn-brand mr-1 mb-1"><CIcon size="lg" name="cib-vimeo" /></CButton>
             </p>
           </CCardBody>
         </CCard>