Improve design

Highlight that there are build details available with a `[details]`
link which wasn't obvious before.
This commit is contained in:
nora 2025-11-14 22:16:32 +01:00
parent 5b62eaff57
commit e523607cbc
3 changed files with 23 additions and 21 deletions

View file

@ -18,7 +18,7 @@ table {
th,
td {
padding: 2px 5px;
padding: 2px 10px;
}
tr:not(:last-child) {
@ -40,32 +40,28 @@ tr:not(:last-child) {
background-color: light-dark(lightgray, rgb(85, 85, 85));
}
.target-header {
writing-mode: sideways-lr;
}
.build-indicator-big {
padding: 10px;
margin-top: 20px;
}
.build-cell {
.build-details-link {
display: flex;
align-items: center;
text-decoration: none;
}
.build-details-emoji {
padding: 5px;
font-size: 2rem;
}
.build-info-a {
color: black;
text-decoration: none;
height: 100%;
width: 100%;
padding: 5px;
.build-details-text {
text-decoration: underline;
}
.footer {
margin-top: 20px;
display: flex;
align-items: center;
gap: 10px;
margin-top: 40px;
}
@media (prefers-color-scheme: dark) {

View file

@ -52,8 +52,11 @@
<td><a href="/target?target={{build.0}}">{{ build.0 }}</a></td>
{% match build.2 %} {% when Some with (build) %}
<td class="build-cell">
<a class="build-info-a" href="{{ build.link() }}">
<span> {{ build.status.to_emoji() }} </span>
<a href="{{ build.link() }}" class="build-details-link">
<span class="build-details-emoji">
{{ build.status.to_emoji() }}
</span>
<span class="build-details-text">[details]</span>
</a>
</td>
{% when None %}

View file

@ -1,4 +1,4 @@
<!doctype html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
@ -63,8 +63,11 @@
<td><a href="/nightly?nightly={{build.0}}">{{ build.0 }}</a></td>
{% match build.2 %} {% when Some with (build) %}
<td class="build-cell">
<a class="build-info-a" href="{{ build.link() }}">
<span> {{ build.status.to_emoji() }} </span>
<a href="{{ build.link() }}" class="build-details-link">
<span class="build-details-emoji">
{{ build.status.to_emoji() }}
</span>
<span class="build-details-text">[details]</span>
</a>
</td>
{% when None %}