ieeemysight4rehab/ieeemysight4rehab.github.io

<template>
    <v-container class="pa-0 white--text">
        <v-layout wrap align-center justify-center row fill-height class="my-3" >
           <v-flex xs12 md12 lg12 class="pa-2">
               <p class="google-font" style="font-size:150%">About {{chapterDetails.ChapterName}}</p>
               <p class="google-font" style="font-size:110%">
                   {{chapterDetails.ChapterLongDescription}}
               </p>
               <v-btn :href="chapterDetails.socialLinks[0].link" target="_blank" rel="noopener" outline color="white" class="ma-0 google-font" style="border-radius:5px;text-transform: capitalize;">Facebook Page</v-btn>
               &nbsp;
               <v-btn :href="chapterDetails.socialLinks[1].link" target="_blank" rel="noopener" outline color="white" class="ma-0 google-font" style="border-radius:5px;text-transform: capitalize;">Google Sites Page</v-btn>
               &nbsp;
               <v-btn :href="chapterDetails.socialLinks[2].link" target="_blank" rel="noopener" outline color="white" class="ma-0 google-font" style="border-radius:5px;text-transform: capitalize;">GitHub Page</v-btn>
               <br>
               <br>
               <router-link to="/about" class="google-font" style="text-decoration:none;color:white">See More about {{chapterDetails.ChapterName}}</router-link>
            </v-flex> 
           
        </v-layout>

    </v-container>
</template>

<script>
import ChapterDetails from '@/assets/data/chapterDetails.json'
export default {
    data() {
        return {
            chapterDetails: ChapterDetails
        }
    },
}
</script>