diff options
| author | Karan Jayachandra <karan.jayachandra@nxp.com> | 2024-10-16 23:57:24 +0200 |
|---|---|---|
| committer | Karan Jayachandra <karan.jayachandra@nxp.com> | 2024-10-16 23:57:24 +0200 |
| commit | a355423ff7566ff1d38bfa1627ec5b7ffa4b6bdc (patch) | |
| tree | a1d9ae0e6dd81238a0e3cb142b13cb8d68d3699b /templates | |
| parent | 36cc7d82a55cbd8167e1f52637dd1938497dd8cc (diff) | |
Cleaned up the layout a bit
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/controls.j2 | 10 | ||||
| -rw-r--r-- | templates/index.j2 | 35 | ||||
| -rw-r--r-- | templates/macros.j2 | 4 |
3 files changed, 26 insertions, 23 deletions
diff --git a/templates/controls.j2 b/templates/controls.j2 index 1799e01..8e190c5 100644 --- a/templates/controls.j2 +++ b/templates/controls.j2 @@ -1,3 +1,5 @@ +{% from "macros.j2" import court %} +<p class="title">Controls</p> <div class="columns"> <div class="column"> <div class="field has-addons"> @@ -48,4 +50,10 @@ hx-target="#games">Reset</button> </div> </div> -<div hx-post="/clear" hx-swap="outerHTML" hx-trigger="revealed"></div> +<div class="fixed-grid has-12-cols"> +<div class="grid"> +{% for key, value in courts.items() %} + {{ court(key, value) }} +{% endfor %} +</div> +</div>
\ No newline at end of file diff --git a/templates/index.j2 b/templates/index.j2 index fcea4e3..22c72a0 100644 --- a/templates/index.j2 +++ b/templates/index.j2 @@ -11,29 +11,24 @@ </head> <body> <section class="section"> - <nav class="level"> - <div class="level-left"> + <nav class="level"> + <div class="level-left"> + <div class="level-item"> + <figure class="image container is-128x128"> + <img src="{{ url_for('static', filename='logo.png') }}"/> + </figure> + </div> + </div> <div class="level-item"> - <figure class="image container is-128x128"> - <img src="{{ url_for('static', filename='logo.png') }}"/> - </figure> + <p class="title">Match Up!</p> </div> - </div> - <div class="level-item"> - <p class="title">Match Up!</p> - </div> - <div class="level-right"> - <div hx-get="/time" hx-swap="outerHTML" hx-trigger="revealed"></div> - </div> - </nav> - </section> - <section class="section"> + <div class="level-right"> + <div hx-get="/time" hx-swap="outerHTML" hx-trigger="revealed"></div> + </div> + </nav> + <div hx-get="/control" hx-swap="outerHTML" hx-trigger="revealed"></div> <p class="title">Games</p> - {% include 'controls.j2' %} - </section> - <section class="section"> - <h2 class="title">Courts</h2> - <div hx-get="/courts" hx-swap="outerHTML" hx-trigger="revealed"></div> + <div hx-post="/clear" hx-swap="outerHTML" hx-trigger="revealed"></div> </section> <section class="section"> <h2 class="title">Players</h2> diff --git a/templates/macros.j2 b/templates/macros.j2 index 7117d11..65d886f 100644 --- a/templates/macros.j2 +++ b/templates/macros.j2 @@ -1,7 +1,7 @@ {% macro court(id, status) -%} <button class= "button is-large is-responsive {% if status %}is-success{% else %}is-danger{% endif %}" hx-post="{{ "/court-toggle/" ~ id}}" - hx-swap="outerHTML">{{ id }}</button> + hx-swap="outerHTML"> Court {{ id }}</button> {%- endmacro %} {% macro player(id, status, name) -%} @@ -18,6 +18,6 @@ {% macro timer(mins, secs) -%} <div hx-get="/time" hx-swap="outerHTML" hx-trigger="every 1s"> - <p class="title">Timer: {{mins}}:{{secs}}</p> + <p class="title">⏲️ {{mins}}:{{secs}}</p> </div> {%- endmacro %}
\ No newline at end of file |