mirror of https://github.com/bastienwirtz/homer
feat: added SecondaryLink service to allow a second link to be added to generic cards.
parent
64629742f7
commit
5d3029eb75
|
@ -52,6 +52,21 @@ If you experiencing any issue, please have a look to the [troubleshooting](troub
|
||||||
type: "<type>"
|
type: "<type>"
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## SecondaryLink
|
||||||
|
|
||||||
|
The SecondaryLink service allows generic cards to have a second link added to them in the format of an icon.
|
||||||
|
|
||||||
|
The following configuration is available for the SecondaryLink service:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
- type: "SecondaryLink"
|
||||||
|
SecondaryLinkUrl: "https://my-second-link" # url for the second link
|
||||||
|
SecondaryLinkTarget: "_blank" # optional html tag target attribute.
|
||||||
|
SecondaryLinkHover: " " # optional text to show when the second link is hovered over.
|
||||||
|
SecondaryLinkIcon: "fas fa-circle-info" # icon to use as the visual indicator of the link
|
||||||
|
```
|
||||||
|
Like the rest of Homer, FontAwesome icons can be used for the SecondaryLinkIcon.
|
||||||
|
|
||||||
## PiHole
|
## PiHole
|
||||||
|
|
||||||
Using the PiHole service you can display info about your local PiHole instance right on your Homer dashboard.
|
Using the PiHole service you can display info about your local PiHole instance right on your Homer dashboard.
|
||||||
|
|
|
@ -0,0 +1,32 @@
|
||||||
|
<template>
|
||||||
|
<Generic :item="item">
|
||||||
|
<template #indicator>
|
||||||
|
<div class="status">
|
||||||
|
<a :href="item.SecondaryLinkUrl" :target="item.SecondaryLinkTarget" :title="item.SecondaryLinkHover" rel="noreferrer">
|
||||||
|
<i
|
||||||
|
class="fa-xl" :class="item.SecondaryLinkIcon"
|
||||||
|
></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</Generic>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import service from "@/mixins/service.js";
|
||||||
|
import Generic from "./Generic.vue";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "SecondaryLink",
|
||||||
|
mixins: [service],
|
||||||
|
props: {
|
||||||
|
item: Object,
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
Generic,
|
||||||
|
},
|
||||||
|
data: () => ({
|
||||||
|
animate: false,
|
||||||
|
}),
|
||||||
|
};
|
||||||
|
</script>
|
Loading…
Reference in New Issue