github.com/covergates/covergates@v0.2.2-0.20201009050117-42ef8a19fb95/web/src/views/Home.vue (about) 1 <template> 2 <perfect-scrollbar class="page-container"> 3 <v-container> 4 <v-row justify="center" align="center" class="mt-5"> 5 <v-avatar size="56" class="mr-5"> 6 <img :src="require('@/assets/logo.png')" /> 7 </v-avatar> 8 <span class="text-h2 font-weight-bold">Covergates</span> 9 </v-row> 10 <v-banner class="text-center primary--text">The portal gates to coverage reports.</v-banner> 11 <v-row justify="center" class="ma-10"> 12 <intro-card v-for="(intro, index) in introductions.slice(0,2)" :key="index" :intro="intro" /> 13 </v-row> 14 <v-row justify="center" class="ma-10"> 15 <intro-card v-for="(intro, index) in introductions.slice(2,4)" :key="index" :intro="intro" /> 16 </v-row> 17 <v-row class="mt-10 mb-5 justify-center"> 18 <div class="d-flex flex-column flex-sm-row align-center"> 19 <v-btn color="primary" to="/repo" large dark>Get start!</v-btn> 20 <span class="my-2 mx-5">Or</span> 21 <v-btn color="primary" href="https://docs.covergates.com/" large dark>Documentation</v-btn> 22 </div> 23 </v-row> 24 </v-container> 25 </perfect-scrollbar> 26 </template> 27 28 <script lang="ts"> 29 import { Component } from 'vue-property-decorator'; 30 import Vue from '@/vue'; 31 import IntroCard from '@/components/IntroCard.vue'; 32 33 type intro = { 34 title: string; 35 icon: string; 36 body: string; 37 }; 38 39 @Component({ 40 name: 'Home', 41 components: { 42 IntroCard 43 } 44 }) 45 export default class HomeVue extends Vue { 46 introductions = [ 47 { 48 title: 'Open Source', 49 icon: 'mdi-open-source-initiative', 50 body: ` 51 Covergates is open source under GPL-3.0 license. 52 It's free for self-hosted. 53 Visit our <a href="https://github.com/covergates/covergates">GitHub</a> 54 if your are interested in this project!` 55 }, 56 { 57 title: 'Easy to Install', 58 icon: 'mdi-clock-fast', 59 body: ` 60 <a href="https://github.com/covergates/covergates/releases">Get the pre-built binary</a> 61 for your platform. Simple run the binary and you are ready to go! 62 ` 63 }, 64 { 65 title: 'Simple and Clean', 66 icon: 'mdi-monitor-clean', 67 body: ` 68 Review coverage reports with the clean interface. No more distractions. 69 ` 70 }, 71 { 72 title: 'Cross-platform', 73 icon: 'mdi-hexagon-multiple-outline', 74 body: ` 75 Covergates is built with <a href="https://golang.org/">Go</a>. 76 You can run it on Windows, Linux, macOS and 77 any other <a href="https://golang.org/">Go</a> supports platform. 78 ` 79 } 80 ] as intro[]; 81 } 82 </script> 83 84 <style lang="scss" scoped> 85 .page-container { 86 overflow-y: auto; 87 height: calc(100vh - 64px - 60px); 88 } 89 </style>