From 772a0502b815a57601f5b4ff64fbc5006cbf522d Mon Sep 17 00:00:00 2001
From: woothu <32914662+woothu@users.noreply.github.com>
Date: Fri, 14 Jun 2019 11:45:48 +0200
Subject: [PATCH] feat: add Font Awesome brand icons view

---
 src/_nav.js                |  9 +++++++--
 src/router/index.js        |  8 +++++++-
 src/views/icons/Brands.vue | 39 ++++++++++++++++++++++++++++++++++++++
 3 files changed, 53 insertions(+), 3 deletions(-)
 create mode 100644 src/views/icons/Brands.vue

diff --git a/src/_nav.js b/src/_nav.js
index 2504cee7..0615cbdf 100644
--- a/src/_nav.js
+++ b/src/_nav.js
@@ -157,12 +157,12 @@ export default {
       icon: 'cui-pie-chart'
     },
     {
-      name: 'CoreUI Icons',
+      name: 'Icons',
       url: '/icons',
       icon: 'cui-star',
       children: [
         {
-          name: 'Icons library',
+          name: 'CoreUI Icons',
           url: '/icons/coreui-icons',
           icon: 'cui-star',
           badge: {
@@ -170,6 +170,11 @@ export default {
             text: 'NEW'
           }
         },
+        {
+          name: 'Brands',
+          url: '/icons/brands',
+          icon: 'cui-star'
+        },
         {
           name: 'Flags',
           url: '/icons/flags',
diff --git a/src/router/index.js b/src/router/index.js
index 2a22e85e..48e2090c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -38,8 +38,9 @@ const Dropdowns = () => import('@/views/buttons/Dropdowns')
 const BrandButtons = () => import('@/views/buttons/BrandButtons')
 
 // Views - Icons
-const Flags = () => import('@/views/icons/Flags')
 const CoreUIIcons = () => import('@/views/icons/CoreUIIcons')
+const Brands = () => import('@/views/icons/Brands')
+const Flags = () => import('@/views/icons/Flags')
 
 // Views - Notifications
 const Alerts = () => import('@/views/notifications/Alerts')
@@ -256,6 +257,11 @@ export default new Router({
               name: 'Icons library',
               component: CoreUIIcons
             },
+            {
+              path: 'brands',
+              name: 'Brands',
+              component: Brands
+            },
             {
               path: 'flags',
               name: 'Flags',
diff --git a/src/views/icons/Brands.vue b/src/views/icons/Brands.vue
new file mode 100644
index 00000000..c2c46ecb
--- /dev/null
+++ b/src/views/icons/Brands.vue
@@ -0,0 +1,39 @@
+<template>
+  <div>
+    <CCard>
+      <CCardHeader>
+        <i class="cui-globe"></i>Font Awesome brand icons
+      </CCardHeader>
+      <CCardBody>
+        <CRow class="c-text-center">
+          <CCol class="c-mb-5" col="12">
+            <!-- For using the flags inline with text add the classes
+            <code>.flag-icon</code> and <code>.flag-icon-xx</code>
+            (where xx is the ISO 3166-1-alpha-2 code of a country) to an empty
+            span. If you want to have a squared version flag then add the class
+            flag-icon-squared as well. -->
+          </CCol>
+          <template v-for="(brand, brandName) in $options.brands">
+            <CCol
+              class="c-mb-5"
+              col="3"
+              sm="2"
+              :key="key"
+            >
+              <CIcon :height="42" :content="$options.brands[brandName]"/>
+              <div>{{brandName}}</div>
+            </CCol>
+          </template>
+        </CRow>
+      </CCardBody>
+    </CCard>
+  </div>
+</template>
+
+<script>
+import { iconSet as brands } from '@coreui/icons/brands'
+export default {
+  name: 'Brands',
+  brands
+}
+</script>