aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/components/Service.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Service.vue')
-rw-r--r--src/components/Service.vue48
1 files changed, 15 insertions, 33 deletions
diff --git a/src/components/Service.vue b/src/components/Service.vue
index 81ad8a2..8686759 100644
--- a/src/components/Service.vue
+++ b/src/components/Service.vue
@@ -1,44 +1,26 @@
1<template> 1<template>
2 <div> 2 <component v-bind:is="component" :item="item"></component>
3 <div class="card" :class="item.class">
4 <a :href="item.url" :target="item.target" rel="noreferrer">
5 <div class="card-content">
6 <div class="media">
7 <div v-if="item.logo" class="media-left">
8 <figure class="image is-48x48">
9 <img :src="item.logo" :alt="`${item.name} logo`" />
10 </figure>
11 </div>
12 <div v-if="item.icon" class="media-left">
13 <figure class="image is-48x48">
14 <i style="font-size: 35px;" :class="['fa-fw', item.icon]"></i>
15 </figure>
16 </div>
17 <div class="media-content">
18 <p class="title is-4">{{ item.name }}</p>
19 <p class="subtitle is-6">{{ item.subtitle }}</p>
20 </div>
21 </div>
22 <div class="tag" :class="item.tagstyle" v-if="item.tag">
23 <strong class="tag-text">#{{ item.tag }}</strong>
24 </div>
25 </div>
26 </a>
27 </div>
28 </div>
29</template> 3</template>
30 4
31<script> 5<script>
6import Generic from "./services/Generic.vue";
7
32export default { 8export default {
33 name: "Service", 9 name: "Service",
10 components: {
11 Generic,
12 },
34 props: { 13 props: {
35 item: Object, 14 item: Object,
36 }, 15 },
16 computed: {
17 component() {
18 const type = this.item.type || "Generic";
19 if (type == "Generic") {
20 return Generic;
21 }
22 return () => import(`./services/${type}.vue`);
23 },
24 },
37}; 25};
38</script> 26</script>
39
40<style scoped lang="scss">
41.media-left img {
42 max-height: 100%;
43}
44</style>