Make logo lighter in dark mode

This commit is contained in:
Richard Feldman 2023-10-31 20:27:36 -04:00
parent 4b5b718241
commit 56bd921d5b
No known key found for this signature in database
GPG Key ID: F1F21AA5B1D9E43B
2 changed files with 22 additions and 7 deletions

View File

@ -1,15 +1,14 @@
<div role="presentation" id="homepage-intro-box">
<h1 id="homepage-h1">Roc</h1>
<svg id="homepage-logo" alt="The Roc logo, a purple origami bird made of six triangles" width="240" height="240" viewBox="0 0 51 53" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M23.6751 22.7086L17.655 53L27.4527 45.2132L26.4673 39.3424L23.6751 22.7086Z" fill="#612BDE"/>
<path d="M37.2438 19.0101L44.0315 26.3689L45 22L45.9665 16.6324L37.2438 19.0101Z" fill="#8257E5"/>
<path d="M23.8834 3.21052L0 0L23.6751 22.7086L23.8834 3.21052Z" fill="#8257E5"/>
<path d="M44.0315 26.3689L23.6751 22.7086L26.4673 39.3424L44.0315 26.3689Z" fill="#8257E5"/>
<path d="M50.5 22L45.9665 16.6324L45 22H50.5Z" fill="#612BDE"/>
<path d="M23.6751 22.7086L44.0315 26.3689L37.2438 19.0101L23.8834 3.21052L23.6751 22.7086Z" fill="#612BDE"/>
<path d="M23.6751 22.7086L17.655 53L27.4527 45.2132L26.4673 39.3424L23.6751 22.7086Z" class="logo-dark"/>
<path d="M37.2438 19.0101L44.0315 26.3689L45 22L45.9665 16.6324L37.2438 19.0101Z" class="logo-light"/>
<path d="M23.8834 3.21052L0 0L23.6751 22.7086L23.8834 3.21052Z" class="logo-light"/>
<path d="M44.0315 26.3689L23.6751 22.7086L26.4673 39.3424L44.0315 26.3689Z" class="logo-light"/>
<path d="M50.5 22L45.9665 16.6324L45 22H50.5Z" class="logo-dark"/>
<path d="M23.6751 22.7086L44.0315 26.3689L37.2438 19.0101L23.8834 3.21052L23.6751 22.7086Z" class="logo-dark"/>
</svg>
<p id="homepage-tagline">A fast, friendly, functional language.</p>
<!-- This exact sample was chosen for several reasons:

View File

@ -66,6 +66,14 @@ footer {
margin: 0 auto;
}
.logo-dark {
fill: #612BDE;
}
.logo-light {
fill: #8257E5;
}
/* Used for e.g. displaying the instruction "Click" on desktop and "Touch" on mobile.
* When we think we're on mobile (based on max-width), we can switch the instruction.
*/
@ -643,6 +651,14 @@ li {
--heading-color: #eee;
}
.logo-dark {
fill: #6c3bdc;
}
.logo-light {
fill: #8A66DE;
}
#homepage-h1 {
color: #fcf9fd;
}