Home page: the noise bars' widths in the stylesheet (#254)

The site's CSP is style-src 'self', which refuses style attributes, so
the bars would all have drawn at full width.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-16 20:48:14 +00:00
parent 0e21195e8d
commit 894e5e4711
2 changed files with 7 additions and 6 deletions

View File

@@ -116,13 +116,13 @@
<div class="tune" aria-hidden="true">
<p class="for">Listening for <b>rockets</b>, <b>launch</b>, <b>orbit</b></p>
<ul>
<li class="n"><i style="width:62%"></i></li>
<li class="n"><i></i></li>
<li class="s">What it takes to stay in orbit</li>
<li class="n"><i style="width:48%"></i></li>
<li class="n"><i style="width:70%"></i></li>
<li class="n"><i></i></li>
<li class="n"><i></i></li>
<li class="s">A week at the launch site</li>
<li class="n"><i style="width:55%"></i></li>
<li class="n"><i style="width:40%"></i></li>
<li class="n"><i></i></li>
<li class="n"><i></i></li>
<li class="s">Why the second stage came down early</li>
</ul>
</div>

View File

@@ -93,7 +93,8 @@ h2{margin:0 0 1.5rem;color:var(--navy);font-weight:800;font-size:clamp(1.75rem,4
.tune .for b{color:#fff;font-weight:650}
.tune ul{list-style:none;margin:0;padding:0;display:grid;gap:.3rem}
.tune li{display:flex;align-items:center;min-height:1.6rem;padding-left:.7rem;border-left:3px solid transparent;font-size:.95rem;font-weight:600;line-height:1.3}
.tune .n i{display:block;height:.55rem;border-radius:.3rem;background:var(--tick)}
.tune .n i{display:block;height:.55rem;border-radius:.3rem;background:var(--tick);width:58%}
.tune .n:nth-child(3) i{width:46%}.tune .n:nth-child(4) i{width:70%}.tune .n:nth-child(7) i{width:40%} /* the page's CSP takes no inline style */
.tune .n{animation:noise 7s ease-in-out infinite}
.tune .s{animation:signal 7s ease-in-out infinite}
@keyframes noise{0%,14%{opacity:.7}36%,86%{opacity:.15}100%{opacity:.7}}