www: logo becomes "lumbda." with a vertically-flipped λ for the l
Wordmark now renders λumbda. — flipped λ stands in for the "l", visual pun on lambda (the primitive the language shells around), trailing period as declarative closure. All-lowercase, accent-colored period. aria-label="lumbda." keeps screen readers reading the name correctly; the λ and the period both carry aria-hidden.
This commit is contained in:
parent
aae7b8980e
commit
8a51e1fd7f
2 changed files with 13 additions and 1 deletions
|
|
@ -11,7 +11,7 @@
|
|||
<body>
|
||||
|
||||
<header>
|
||||
<h1>Lumbda</h1>
|
||||
<h1 aria-label="lumbda."><span class="lambda-flip" aria-hidden="true">λ</span>umbda<span class="period" aria-hidden="true">.</span></h1>
|
||||
<p class="tagline">feedback as a primitive</p>
|
||||
</header>
|
||||
|
||||
|
|
|
|||
|
|
@ -59,6 +59,18 @@ header h1 {
|
|||
line-height: 1;
|
||||
}
|
||||
|
||||
/* Flipped lambda stands in for the "l" in the wordmark —
|
||||
visual pun on "lambda", the primitive the language shells around. */
|
||||
header h1 .lambda-flip {
|
||||
display: inline-block;
|
||||
transform: scaleY(-1);
|
||||
}
|
||||
|
||||
/* Period after the wordmark reads as declarative: "lumbda." is final. */
|
||||
header h1 .period {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.tagline {
|
||||
color: var(--muted);
|
||||
margin: 0.25rem 0 0;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue