subtitle: "Another example"
tag: "other"
url: "https://www.reddit.com/r/selfhosted/"
- target: "_blank" # optionnal html a tag target attribute
- # colors: # optional custom colors for card
- # background: #66a5e2
- # text: #000000
+ target: "_blank" # optional html a tag target attribute
+ # class: "green" # optional custom CSS class for card, useful with custom stylesheet
```
If you choose to fetch message information from an endpoint, the output format should be:
--- /dev/null
+@charset "UTF-8";
+
+/* Custom card colors */
+/* Use with `class:` property of services in config.yml */
+body #app .card .green
+{
+ background-color: #006600;
+ color: #00ff00;
+}
<a :href="item.url" :target="item.target" rel="noreferrer">
<div
class="card-content"
- :style="(item.colors && item.colors.background) ? {backgroundColor: item.colors.background} : null"
+ :class="item.class"
>
<div class="media">
<div v-if="item.logo" class="media-left">
<div class="media-content">
<p
class="title is-4"
- :style="(item.colors && item.colors.text) ? {color: item.colors.text} : null"
+ :class="item.class"
>{{ item.name }}</p>
<p
class="subtitle is-6"
- :style="(item.colors && item.colors.text) ? {color: item.colors.text} : null"
+ :class="item.class"
>{{ item.subtitle }}</p>
</div>
</div>