Replace logo

.github/workflows/ci.yml

@@ -42,7 +42,7 @@ jobs:
       # that are expected to exist by the manifest.json view test.
     - run: |
         mkdir yarrharr/static
-        touch yarrharr/static/{icon,logotype,lettertype}-xyz.{ico,png,svg}
+        touch yarrharr/static/icon-xyz.{ico,png,svg}
         touch yarrharr/static/{normalize,main,fonts}-xyz.css
         touch yarrharr/static/{runtime,vendor,main}-xyz.js
 

bin/compile-static.py

@@ -391,8 +391,6 @@ async def _main(build_dir: Path, out_dir: Path, compress: bool) -> None:
     await asyncio.gather(
         process_svg(icon, w),
         rasterize_favicon(icon, build_dir, w),
-        process_svg(repo_root / "img" / "lettertype.svg", w),
-        process_svg(repo_root / "img" / "logotype.svg", w),
         process_glob((repo_root / "vendor" / "normalize.css").glob("normalize-*.css"), w),
         process_css(repo_root / "css" / "main.css", w),
         process_fonts(repo_root, w),

css/GlobalBar.css

@@ -1,27 +1,18 @@
 .yarrharr-masthead {
     display: flex;
     flex: 0 0 auto;
+    font: 1.5rem Montez, sans-serif;
 
-    img {
-        flex: 1 1 auto;
-        width: auto;
-        height: auto;
-        max-height: 100%;
-        filter: var(--logo-filter);
+    &:link {
+        text-decoration: none;
     }
 
     .logotype {
         display: block;
-        width: 10rem;
-    }
-    .lettertype {
-        display: none;
-        width: 3rem;
     }
 
     @media (max-width: 30rem) {
         .logotype { display: none; }
-        .lettertype { display: block; }
     }
 }
 

css/main.css

@@ -15,8 +15,6 @@
     --icon-color: #666;
     --icon-color-off: var(--border-color);
 
-    --logo-filter: none;
-
     --heart-color: #c92ccc;
     --check-color: #39cc5c;
     --selected-color: hsl(24.1, 100%, 49.2%);
@@ -54,11 +52,6 @@
         --icon-color: #eee;
         --icon-color-off: #666;
 
-        /* Invert the logo image so that it is legible in the dark theme. We
-         * don't go 100% because it is pretty bold.
-         */
-        --logo-filter: invert(90%);
-
         --font-weight-mono: 300;
 
         scrollbar-color: var(--quiet-text-color) var(--background-color);
@@ -323,6 +316,8 @@ form.small-form {
         padding: 1rem 1rem 0 0;
         flex: 100 1 auto;
 
+        font: 3.5rem Montez, sans-serif;
+
         text-align: center;
 
         img {