Fix logo: iOS ignores @media (prefers-color-scheme:dark)

skryukov · skryukov · commit 0f2dee9509cf · 2024-11-05T14:58:42.000+03:00
diff --git a/README.md b/README.md
@@ -1,5 +1,8 @@
 <p align="center">
-  <img src="./assets/logo.svg" title="Turbo Mount logo" width="220" height="45">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="assets/logo-dark.svg">
+    <img src="assets/logo.svg" title="Turbo Mount logo" width="220" height="45">
+  </picture>
 </p>
 
 <h1 align="center">Turbo Mount</h1>
diff --git a/assets/logo-dark.svg b/assets/logo-dark.svg
@@ -0,0 +1 @@
+<svg width="220" height="45" fill="none" xmlns="http://www.w3.org/2000/svg"><style>:root{color:#fff}</style><path d="M72.45 18.808 82.477 4.687h9.437L85.71 40.314H75.35l3.261-18.627-6.88 9.902h-2.977l-3.613-9.647-3.2 18.372h-8.936l6.207-35.627h7.713l5.524 14.121Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M121.472 5.761a4.43 4.43 0 0 1 1.551 2.345 8.33 8.33 0 0 1 .052 3.82l-3.67 20.803a11.436 11.436 0 0 1-1.341 3.97 7.198 7.198 0 0 1-2.323 2.443 9.214 9.214 0 0 1-3.236 1.236 22.7 22.7 0 0 1-4.09.344h-8.6a20.816 20.816 0 0 1-3.977-.344 6.113 6.113 0 0 1-2.772-1.236 4.378 4.378 0 0 1-1.423-2.443 10.107 10.107 0 0 1 .037-3.97l3.633-20.802a11.017 11.017 0 0 1 1.364-3.821 6.97 6.97 0 0 1 2.329-2.345 9.03 9.03 0 0 1 3.214-1.168 23.256 23.256 0 0 1 3.955-.315h8.6a21.552 21.552 0 0 1 3.873.315 6.427 6.427 0 0 1 2.824 1.168Zm-19.267 25.83h7.019l3.206-18.166h-7.019l-3.206 18.165ZM144.79 4.687l-4.678 26.902h-6.087l4.685-26.902h-10.322l-4.887 28.116a10.177 10.177 0 0 0-.06 4.003c.195.95.705 1.805 1.447 2.428a6.15 6.15 0 0 0 2.803 1.192c1.289.229 2.597.337 3.906.323h7.713a23.344 23.344 0 0 0 4.07-.323 8.774 8.774 0 0 0 3.224-1.192 7.22 7.22 0 0 0 2.316-2.428 11.89 11.89 0 0 0 1.357-4.003l4.872-28.116H144.79Z" fill="currentColor"/><path d="m160.192 4.687-6.222 35.7h9.41l2.881-16.55 9.206 16.55h7.42l6.222-35.7H179.7l-2.907 16.626-9.231-16.626h-7.37Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M219.195 4.687h-26.422l-1.574 9.032h8.043l-4.633 26.595h10.329l4.633-26.595h8.043l1.581-9.032Z" fill="currentColor"/><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M2 0a2 2 0 0 0-2 2v32.856l8.557-15.083 6.063 3.44 9.61-16.94 6.07-.03L45 31.548V2a2 2 0 0 0-2-2H2Zm12.611 23.287L2.293 45H43c.54 0 1.03-.214 1.39-.563L27.31 15.03l-6.636 11.697-6.063-3.44ZM23 36v-5h-4v5h4Zm6 2v2.1a2 2 0 1 1-4 0V38h4Zm5-2v-5h-4v5h4Z" fill="currentColor"/></g><defs><clipPath id="a"><rect width="45" height="45" rx="2" fill="#fff"/></clipPath></defs></svg>
diff --git a/assets/logo.svg b/assets/logo.svg
@@ -1 +1 @@
-<svg width="220" height="45" fill="none" xmlns="http://www.w3.org/2000/svg"><style>:root{color:#000}@media (prefers-color-scheme:dark){:root{color:#fff}}</style><path d="M72.45 18.808 82.477 4.687h9.437L85.71 40.314H75.35l3.261-18.627-6.88 9.902h-2.977l-3.613-9.647-3.2 18.372h-8.936l6.207-35.627h7.713l5.524 14.121Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M121.472 5.761a4.43 4.43 0 0 1 1.551 2.345 8.33 8.33 0 0 1 .052 3.82l-3.67 20.803a11.436 11.436 0 0 1-1.341 3.97 7.198 7.198 0 0 1-2.323 2.443 9.214 9.214 0 0 1-3.236 1.236 22.7 22.7 0 0 1-4.09.344h-8.6a20.816 20.816 0 0 1-3.977-.344 6.113 6.113 0 0 1-2.772-1.236 4.378 4.378 0 0 1-1.423-2.443 10.107 10.107 0 0 1 .037-3.97l3.633-20.802a11.017 11.017 0 0 1 1.364-3.821 6.97 6.97 0 0 1 2.329-2.345 9.03 9.03 0 0 1 3.214-1.168 23.256 23.256 0 0 1 3.955-.315h8.6a21.552 21.552 0 0 1 3.873.315 6.427 6.427 0 0 1 2.824 1.168Zm-19.267 25.83h7.019l3.206-18.166h-7.019l-3.206 18.165ZM144.79 4.687l-4.678 26.902h-6.087l4.685-26.902h-10.322l-4.887 28.116a10.177 10.177 0 0 0-.06 4.003c.195.95.705 1.805 1.447 2.428a6.15 6.15 0 0 0 2.803 1.192c1.289.229 2.597.337 3.906.323h7.713a23.344 23.344 0 0 0 4.07-.323 8.774 8.774 0 0 0 3.224-1.192 7.22 7.22 0 0 0 2.316-2.428 11.89 11.89 0 0 0 1.357-4.003l4.872-28.116H144.79Z" fill="currentColor"/><path d="m160.192 4.687-6.222 35.7h9.41l2.881-16.55 9.206 16.55h7.42l6.222-35.7H179.7l-2.907 16.626-9.231-16.626h-7.37Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M219.195 4.687h-26.422l-1.574 9.032h8.043l-4.633 26.595h10.329l4.633-26.595h8.043l1.581-9.032Z" fill="currentColor"/><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M2 0a2 2 0 0 0-2 2v32.856l8.557-15.083 6.063 3.44 9.61-16.94 6.07-.03L45 31.548V2a2 2 0 0 0-2-2H2Zm12.611 23.287L2.293 45H43c.54 0 1.03-.214 1.39-.563L27.31 15.03l-6.636 11.697-6.063-3.44ZM23 36v-5h-4v5h4Zm6 2v2.1a2 2 0 1 1-4 0V38h4Zm5-2v-5h-4v5h4Z" fill="currentColor"/></g><defs><clipPath id="a"><rect width="45" height="45" rx="2" fill="#fff"/></clipPath></defs></svg>
+<svg width="220" height="45" fill="none" xmlns="http://www.w3.org/2000/svg"><style>:root{color:#000}</style><path d="M72.45 18.808 82.477 4.687h9.437L85.71 40.314H75.35l3.261-18.627-6.88 9.902h-2.977l-3.613-9.647-3.2 18.372h-8.936l6.207-35.627h7.713l5.524 14.121Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M121.472 5.761a4.43 4.43 0 0 1 1.551 2.345 8.33 8.33 0 0 1 .052 3.82l-3.67 20.803a11.436 11.436 0 0 1-1.341 3.97 7.198 7.198 0 0 1-2.323 2.443 9.214 9.214 0 0 1-3.236 1.236 22.7 22.7 0 0 1-4.09.344h-8.6a20.816 20.816 0 0 1-3.977-.344 6.113 6.113 0 0 1-2.772-1.236 4.378 4.378 0 0 1-1.423-2.443 10.107 10.107 0 0 1 .037-3.97l3.633-20.802a11.017 11.017 0 0 1 1.364-3.821 6.97 6.97 0 0 1 2.329-2.345 9.03 9.03 0 0 1 3.214-1.168 23.256 23.256 0 0 1 3.955-.315h8.6a21.552 21.552 0 0 1 3.873.315 6.427 6.427 0 0 1 2.824 1.168Zm-19.267 25.83h7.019l3.206-18.166h-7.019l-3.206 18.165ZM144.79 4.687l-4.678 26.902h-6.087l4.685-26.902h-10.322l-4.887 28.116a10.177 10.177 0 0 0-.06 4.003c.195.95.705 1.805 1.447 2.428a6.15 6.15 0 0 0 2.803 1.192c1.289.229 2.597.337 3.906.323h7.713a23.344 23.344 0 0 0 4.07-.323 8.774 8.774 0 0 0 3.224-1.192 7.22 7.22 0 0 0 2.316-2.428 11.89 11.89 0 0 0 1.357-4.003l4.872-28.116H144.79Z" fill="currentColor"/><path d="m160.192 4.687-6.222 35.7h9.41l2.881-16.55 9.206 16.55h7.42l6.222-35.7H179.7l-2.907 16.626-9.231-16.626h-7.37Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M219.195 4.687h-26.422l-1.574 9.032h8.043l-4.633 26.595h10.329l4.633-26.595h8.043l1.581-9.032Z" fill="currentColor"/><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M2 0a2 2 0 0 0-2 2v32.856l8.557-15.083 6.063 3.44 9.61-16.94 6.07-.03L45 31.548V2a2 2 0 0 0-2-2H2Zm12.611 23.287L2.293 45H43c.54 0 1.03-.214 1.39-.563L27.31 15.03l-6.636 11.697-6.063-3.44ZM23 36v-5h-4v5h4Zm6 2v2.1a2 2 0 1 1-4 0V38h4Zm5-2v-5h-4v5h4Z" fill="currentColor"/></g><defs><clipPath id="a"><rect width="45" height="45" rx="2" fill="#fff"/></clipPath></defs></svg>
