feat(home): add links ✨

Author: PierreBrisorgueil

src/config/defaults/development.js

@@ -139,5 +139,31 @@ module.exports = {
       title: 'Contact Us',
       mail: 'mailto:pierre@weareopensource.me',
     },
+    links: [
+      {
+        title: 'Useful',
+        items: [{
+          label: 'Blog',
+          icon: 'fa-rss',
+          url: 'https://weareopensource.me',
+        }],
+      },
+      {
+        title: 'About',
+        items: [{
+          label: 'GDPR / RGPD',
+          icon: 'fa-lock',
+          url: 'https://weareopensource.me',
+        }],
+      },
+      {
+        title: 'Others',
+        items: [{
+          label: 'Twitter',
+          icon: 'fab fa-twitter',
+          url: 'https://weareopensource.me',
+        }],
+      },
+    ],
   },
 };

src/modules/_core/components/core.footer.component.vue

@@ -6,7 +6,7 @@
     <div class="flex-grow-1"></div>
     <div>
       &copy; 2019
-      <a href="https://weareopensource.me">We Are Open Source</a>
+      <a href="https://weareopensource.me" style="color:white; text-decoration:none;">We Are Open Source</a>
     </div>
   </v-footer>
 </template>

src/modules/home/views/home.view.vue

@@ -47,7 +47,7 @@
                   md="7"
                   lg="6"
                   xl="5"
-                  style="bottom: 15%; position: absolute; opacity:75%;"
+                  style="bottom: 10%; position: absolute; opacity:75%;"
                   data-aos="fade-up"
                   v-if="config.home.subscriptions"
                 >
@@ -226,6 +226,46 @@
         </v-theme-provider>
       </v-container>
     </section>
+
+    <section
+      id="features"
+      class="py-12"
+      :style="{ background: config.vuetify.theme.themes[theme].surface }"
+      v-if="config.home.links.length > 0"
+    >
+      <v-container>
+        <v-row>
+          <v-col
+            v-for="({ items, title }, i) in config.home.links"
+            :key="i"
+            cols="12"
+            md="4"
+          >
+            <v-card :flat="config.vuetify.theme.flat">
+              <v-card-title
+                class="justify-center text--secondary"
+                v-text="title"
+              ></v-card-title>
+              <v-list dense>
+                <v-list-item-group color="primary">
+                  <v-list-item
+                    v-for="(item, i) in items"
+                    :key="i"
+                  >
+                    <v-list-item-content>
+                      <v-list-item-title class="text-center">
+                        <v-icon class="pr-2" small>{{ item.icon }}</v-icon> {{item.label}}
+                      </v-list-item-title>
+                    </v-list-item-content>
+                  </v-list-item>
+                </v-list-item-group>
+              </v-list>
+            </v-card>
+          </v-col>
+        </v-row>
+      </v-container>
+    </section>
+
   </div>
 </template>