eric/cedarmore-room-data-TRMNL-Plugin
1
0
Fork 0
Code Issues Pull Requests Packages Releases Wiki Activity

Inital Commit

Browse Source
This commit is contained in:
Eric Taylor
2025-11-20 12:37:10 -05:00
parent 60c870e664
commit 5ceff088ec
1 changed files with 57 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
template.liquid Normal file
View File

@@ -0,0 +1,57 @@
{% assign json_data = data | where: "TRMNL_ID", trmnl.plugin_settings.custom_fields_values.device_id | first %}
{% assign my_id = trmnl.plugin_settings.custom_fields_values.device_id %}
{% if json_data %}
<div class="layout">
<div class="columns">
<div class="column">
<div class="grid grid--cols-1 gap--large">
<div class="title">
<span class="value value--xlarge">{{ json_data.header }}</span>
</div>
<em> <span class="value value--med">{{ json_data.tagline }}</span></em>
<div class="divider--h"></div>
<div class="meta"></div>
<div class="content">
<ul><center><p class="label label--large">{{ json_data.info }}</p></center></ul>
</div>
<div class="flex flex--row">
{% assign room_days = json_data.days | split: ',' %}
{% for day in room_days %}
<div style="font-family: sans-serif;
text-transform: uppercase;
font-size: 1.6rem;
padding: 0.5rem 1.2rem;
border: 2px solid #000;
border-radius: 0.4rem;">
{{ day }}
</div>
{% endfor %}
</div>
<center><p class="label text--center">{{json_data.note}}</p></center>
</div>
</div>
</div>
</div>
<div class="title_bar">
<!-- <img class="image" style="
filter: grayscale(100%) brightness(30%);
" src="https://gocrossings.org/wp-content/uploads/2020/03/cropped-favicon2-150x150.png">
<span class="title">Cedarmore Camp and Conference Center</span>-->
<img height="50px"style="
filter: grayscale(100%) brightness(0%) ; float: right;" src="https://gocrossings.org/wp-content/uploads/2020/02/logo-white_1.png"/>
<span class="instance"><p>DeviceID: {{ my_id }} Updated at {{ "now" | date: "%s" | plus: trmnl.user.utc_offset | date: "%H:%M" }}</p></span>
</div>
{% else %} <!-- If There is no json data just show the logo -->
<div class="layout layout--center">
<img class="image-dither" style="
filter: grayscale(100%) brightness(70%) contrast(500%);" src="https://gocrossings.org/wp-content/uploads/2020/03/cedarmore.png"/>
</div>
{% endif %}