diff options
| author | Bastien Wirtz <bastien.wirtz@gmail.com> | 2021-10-06 22:55:09 +0200 |
|---|---|---|
| committer | Bastien Wirtz <bastien.wirtz@gmail.com> | 2021-10-06 22:55:09 +0200 |
| commit | 2ca4faad9cb336ac8904bbc775fdcc2a12731b90 (patch) | |
| tree | 76f26d0503c5f86e6240e3d84fa4e793cc4c44ed /src/components/services/Generic.vue | |
| parent | c7dc6bfd0d73f803914092593d440d8b27e2c851 (diff) | |
| download | homer-2ca4faad9cb336ac8904bbc775fdcc2a12731b90.tar.gz homer-2ca4faad9cb336ac8904bbc775fdcc2a12731b90.tar.zst homer-2ca4faad9cb336ac8904bbc775fdcc2a12731b90.zip | |
Extendable base service for easier development.
Diffstat (limited to 'src/components/services/Generic.vue')
| -rw-r--r-- | src/components/services/Generic.vue | 33 |
1 files changed, 19 insertions, 14 deletions
diff --git a/src/components/services/Generic.vue b/src/components/services/Generic.vue index 08bd3f6..af65a8c 100644 --- a/src/components/services/Generic.vue +++ b/src/components/services/Generic.vue | |||
| @@ -8,22 +8,27 @@ | |||
| 8 | <a :href="item.url" :target="item.target" rel="noreferrer"> | 8 | <a :href="item.url" :target="item.target" rel="noreferrer"> |
| 9 | <div class="card-content"> | 9 | <div class="card-content"> |
| 10 | <div :class="mediaClass"> | 10 | <div :class="mediaClass"> |
| 11 | <div v-if="item.logo" class="media-left"> | 11 | <slot name="icon"> |
| 12 | <figure class="image is-48x48"> | 12 | <div v-if="item.logo" class="media-left"> |
| 13 | <img :src="item.logo" :alt="`${item.name} logo`" /> | 13 | <figure class="image is-48x48"> |
| 14 | </figure> | 14 | <img :src="item.logo" :alt="`${item.name} logo`" /> |
| 15 | </div> | 15 | </figure> |
| 16 | <div v-if="item.icon" class="media-left"> | 16 | </div> |
| 17 | <figure class="image is-48x48"> | 17 | <div v-if="item.icon" class="media-left"> |
| 18 | <i style="font-size: 35px" :class="['fa-fw', item.icon]"></i> | 18 | <figure class="image is-48x48"> |
| 19 | </figure> | 19 | <i style="font-size: 35px" :class="['fa-fw', item.icon]"></i> |
| 20 | </div> | 20 | </figure> |
| 21 | </div> | ||
| 22 | </slot> | ||
| 21 | <div class="media-content"> | 23 | <div class="media-content"> |
| 22 | <p class="title is-4">{{ item.name }}</p> | 24 | <slot name="content"> |
| 23 | <p class="subtitle is-6" v-if="item.subtitle"> | 25 | <p class="title is-4">{{ item.name }}</p> |
| 24 | {{ item.subtitle }} | 26 | <p class="subtitle is-6" v-if="item.subtitle"> |
| 25 | </p> | 27 | {{ item.subtitle }} |
| 28 | </p> | ||
| 29 | </slot> | ||
| 26 | </div> | 30 | </div> |
| 31 | <slot name="indicator" class="indicator"></slot> | ||
| 27 | </div> | 32 | </div> |
| 28 | <div class="tag" :class="item.tagstyle" v-if="item.tag"> | 33 | <div class="tag" :class="item.tagstyle" v-if="item.tag"> |
| 29 | <strong class="tag-text">#{{ item.tag }}</strong> | 34 | <strong class="tag-text">#{{ item.tag }}</strong> |