diff options
| author | Joe Mou <dev@mou.fo> | 2026-08-11 12:54:27 -0400 |
|---|---|---|
| committer | Joe Mou <dev@mou.fo> | 2026-08-11 13:04:49 -0400 |
| commit | d2c94ae32ff8d88f438d0e3348ca4f4a81f7bdd7 (patch) | |
| tree | 4ee4da82a6fb27241e116b76922177c7b98851cc /views | |
| parent | 0a39a7a981f619ac64fdeb26294c7cfd4f110a1a (diff) | |
Mitigate placeholder layout shift
Diffstat (limited to 'views')
| -rw-r--r-- | views/_tree.eta | 7 | ||||
| -rw-r--r-- | views/repo.eta | 5 |
2 files changed, 10 insertions, 2 deletions
diff --git a/views/_tree.eta b/views/_tree.eta index 2eb445f..fc7707b 100644 --- a/views/_tree.eta +++ b/views/_tree.eta @@ -1,7 +1,12 @@ <%~ include("./_nav.eta", {...it, isTree: true}) %> <% const commitPath = it.path && it.path !== "/" ? it.path : ""; %> -<div class="placeholder box" data-src="/api/<%= it.repo.owner %>/<%= it.repo.name %>/latest-commit/<%= it.branch %>/<%= commitPath %>">Loading latest commit…</div> +<div class="placeholder commit box" data-src="/api/<%= it.repo.owner %>/<%= it.repo.name %>/latest-commit/<%= it.branch %>/<%= commitPath %>"> + <div> + <div>…</div> + <div class="commit-author">…</div> + </div> +</div> <table> <% for (const item of it.items) { %> diff --git a/views/repo.eta b/views/repo.eta index 9122594..1bff97f 100644 --- a/views/repo.eta +++ b/views/repo.eta @@ -29,6 +29,9 @@ </div> <% } %> -<div class="placeholder box" data-src="/api/<%= it.repo.owner %>/<%= it.repo.name %>/languages">Loading languages…</div> +<div class="placeholder languages box" data-src="/api/<%= it.repo.owner %>/<%= it.repo.name %>/languages"> + <div class="language-bar"><span style="width: 100%; background: #ededed"></span></div> + <ul class="language-list"><li>…</li></ul> +</div> <%~ include("./_tree", it) %> |