glacier-web-cli 0.5.0

Command-line tool for creating and running Glacier applications.
1
2
3
4
5
6
7
8
9
10
11
12
13

{# trend: its text ("12%"); direction: "up" | "down"; tone: "" | "good" | "bad". href makes the tile a link. #}
{% props label: String, value: String, sub: String = "", trend: String = "", direction: String = "up", tone: String = "", href: String = "" %}
{%- let tag = if href.is_empty() { "div" } else { "a" } %}
<{{ tag }} class="ui-stat-tile"{% if !href.is_empty() %} href="{{ href }}"{% end %}>
  <span class="ui-stat-label">{{ label }}{% if !href.is_empty() %}<svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>{% end %}</span>
  <span class="ui-stat-value">{{ value }}</span>
  {%- if !trend.is_empty() || !sub.is_empty() %}
  <span class="ui-stat-sub">
    {%- if !trend.is_empty() %}<span class="ui-trend"{% if !tone.is_empty() %} data-tone="{{ tone }}"{% end %}>
      {%- if direction == "down" %}<svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M22 17 13.5 8.5 8.5 13.5 2 7"/><path d="M16 17h6v-6"/></svg><span class="ui-sr-only">Down </span>
      {%- else %}<svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M22 7 13.5 15.5 8.5 10.5 2 17"/><path d="M16 7h6v6"/></svg><span class="ui-sr-only">Up </span>{% end %}{{ trend }}</span>{% end %}{{ sub }}</span>
  {%- end %}
</{{ tag }}>