- static/pxe-ui.css: the redesign's colour tokens (light and dark), shell, chips, stage track, expandable rows, menus and buttons. The legacy tokens (--bg-card, --border, --text-light, ...) alias onto the new ones so pages not yet redesigned blend in. - base.html: new sidebar (Operate, Images, Updates, Tools) with the GE Aerospace logo on the brand blue, to-do count, theme toggle with aria-pressed, and a menu button on narrow screens. The to-do banner is now a one-line strip. Skip link and <main> landmark added. - _ui.html: Jinja macros for chip, track, the actions menu and the page header.
38 lines
1.6 KiB
HTML
38 lines
1.6 KiB
HTML
{# Shared redesign macros. Import with: {% import '_ui.html' as ui %} #}
|
|
|
|
{# Status chip. kind: fail err act run ok warn neutral w11 w10 off edit remove #}
|
|
{% macro chip(text, kind='neutral', title=None) -%}
|
|
<span class="chip c-{{ kind }}"{% if title %} title="{{ title }}"{% endif %}>{{ text }}</span>
|
|
{%- endmacro %}
|
|
|
|
{# Segmented stage track: one segment per stage; earlier ones grey, the
|
|
current one in the status colour (kind: fail act run ok). #}
|
|
{% macro track(total, current, kind='run', label=None) -%}
|
|
{% set total = total or 0 %}{% set current = current or 0 %}
|
|
<div class="track" role="img" aria-label="{{ label or ('Stage ' ~ current ~ ' of ' ~ total) }}">
|
|
{%- for i in range(1, total + 1) -%}
|
|
<i class="{{ kind if kind == 'ok' else ('d' if i < current else (kind if i == current else '')) }}"></i>
|
|
{%- endfor -%}
|
|
</div>
|
|
{%- endmacro %}
|
|
|
|
{# "..." menu. The caller block supplies <a>/<button>/<form> items. #}
|
|
{% macro more(label, left=False) -%}
|
|
<details class="more{{ ' lft' if left }}">
|
|
<summary class="ui-btn ghost" aria-label="More actions for {{ label }}">⋯</summary>
|
|
<div class="menu">{{ caller() }}</div>
|
|
</details>
|
|
{%- endmacro %}
|
|
|
|
{# Page header. The caller block, if any, renders the right-hand actions. #}
|
|
{% macro head(title, eyebrow=None, sub=None) -%}
|
|
<header class="ui-head">
|
|
<div>
|
|
{% if eyebrow %}<div class="eyebrow-t">{{ eyebrow }}</div>{% endif %}
|
|
<h1>{{ title }}</h1>
|
|
{% if sub %}<div class="sub" style="margin-top: 2px">{{ sub }}</div>{% endif %}
|
|
</div>
|
|
{% if caller is defined %}<div class="actions">{{ caller() }}</div>{% endif %}
|
|
</header>
|
|
{%- endmacro %}
|