fixed issue #Add Committee

assets/scss/materialize.scss

@@ -1 +1,2 @@
-@import '@/node_modules/materialize-css/sass/materialize.scss';
+@import '@/node_modules/materialize-css/sass/materialize.scss';
+

layouts/README.md

@@ -1,7 +1,7 @@
-# LAYOUTS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your Application Layouts.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
+# LAYOUTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).

layouts/default.vue

@@ -1,19 +1,19 @@
-<template>
-  <div>
-    <Header />
-    <nuxt />
-  </div>
-</template>
-
-<script>
-import Header from '~/components/Header'
-
-export default {
-  components: {
-    Header
-  }
-}
-</script>
-
-<style>
-</style>
+<template>
+  <div>
+    <Header />
+    <nuxt />
+  </div>
+</template>
+
+<script>
+import Header from '~/components/Header'
+export default {
+  components: {
+    Header
+  }
+}
+</script>
+
+<style lang='scss'>
+
+</style>

pages/committee/index.vue

@@ -1,14 +1,111 @@
 <template>
-  <div>
-    Committee Page
-  </div>
+  <div><br>
+    <div class="center-align"><h4>Our Committee Members</h4></div><br><br>
+    <div class="row">
+    <section v-for=' c in content.committee' :key=' c.designation'>
+        <div class='col s12 m7 l3'>
+          <div class='card-panel hoverable'>
+            <p class="center-align text">{{c.designation}}</p>
+            <div class='card-image center-align'>
+              <img class="circle responsive-image img" :src='c.url'>
+            </div>
+            <div class='card-content center-align text'>
+              <p>{{ c.name }}</p>
+            </div><br><br>
+            <div class='card-action middle'>
+              <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>&nbsp;
+              <a :href='c.profiles.instagram' class="wave-effect wave-light"><i class="fa fa-instagram hoverable circle"></i></a>&nbsp;
+              <a :href='c.profiles.twitter' class="wave-effect wave-light"><i class="fa fa-twitter hoverable circle"></i></a>&nbsp;
+              <a :href='c.profiles.linkedin' class="wave-effect wave-light"><i class="fa fa-linkedin hoverable circle"></i></a>&nbsp;
+              <a :href='c.profiles.github' class="wave-effect wave-light"><i class="fa fa-github hoverable circle"></i></a>&nbsp;
+              <a :href='c.profiles.website' class="wave-effect wave-light"><i class="material-icons action hoverable circle">language</i></a>
+            </div>
+        </div>
+        </div>
+    </section>
+    </div>
+</div>
 </template>
 
 <script>
 export default {
-
+  data () {
+    return {
+      content: {
+        committee: [
+          {
+            name: 'Prof. Syam Sankar',
+            designation: 'Faculty Advisor',
+            url: '/profilepic.png',
+            profiles: {
+              instagram: '',
+              twitter: '',
+              linkedin: '',
+              github: '',
+              website: ''
+            }
+          },
+          {
+            name: 'Milind Soorya  ',
+            designation: ' Chairman',
+            url: '/profilepic.png',
+            profiles: {
+              instagram: '',
+              twitter: '',
+              linkedin: '',
+              github: '',
+              website: ''
+            }
+          },
+          {
+            name: 'Meekha E Saji  ',
+            url: '/profilepic.png',
+            designation: ' Newsletter Editor',
+            profiles: {
+              instagram: '',
+              twitter: '',
+              linkedin: '',
+              github: '',
+              website: ''
+            }
+          },
+          {
+            name: 'Allen K Abraham',
+            url: '/profilepic.png',
+            designation: ' Website Maintainer',
+            profiles: {
+              instagram: '',
+              twitter: '',
+              linkedin: '',
+              github: '',
+              website: ''
+            }
+          }
+        ]
+      }
+    }
+  }
 }
 </script>
+<style lang="scss">
+.card-panel{
+border-radius: 16px 16px 16px 16px;
+box-shadow: 0 4px 4px grey;
+height: 400px;
+}
+.text{
+  text-align: center;
+  font-weight: bold;
+  font-size: 16px;
+}
 
-<style>
+.img{
+width: 140px;
+height: 140px;
+}
+.middle{
+position: absolute;
+font-size: 28px;
+overflow: hidden;
+}
 </style>

pages/index.vue

@@ -3,7 +3,7 @@
     <div>
       Home Page
     </div>
-  </div>
+    </div>
 </template>
 
 <script>