From 1eb21d247b9feb748b39526606577747b78f7e87 Mon Sep 17 00:00:00 2001
From: Kyle Carberry <kyle@coder.com>
Date: Thu, 5 Oct 2023 16:11:15 -0500
Subject: [PATCH] feat: adjust favicon based on system color-scheme (#10087)

This will still default to light-theme, but support showing
a white favicon when the system-theme is dark.
---
 site/index.html                               |  20 ++++++++++++++++--
 .../{favicon.png => favicon-dark.png}         | Bin
 .../{favicon.svg => favicon-dark.svg}         |   0
 site/static/favicons/favicon-light.png        | Bin 0 -> 2742 bytes
 site/static/favicons/favicon-light.svg        |   8 +++++++
 5 files changed, 26 insertions(+), 2 deletions(-)
 rename site/static/favicons/{favicon.png => favicon-dark.png} (100%)
 rename site/static/favicons/{favicon.svg => favicon-dark.svg} (100%)
 create mode 100644 site/static/favicons/favicon-light.png
 create mode 100644 site/static/favicons/favicon-light.svg

diff --git a/site/index.html b/site/index.html
index df2ecc4b18..99f24c4747 100644
--- a/site/index.html
+++ b/site/index.html
@@ -28,13 +28,29 @@
   <link
     rel="alternate icon"
     type="image/png"
-    href="/favicons/favicon.png"
+    href="/favicons/favicon-light.png"
+    media="(prefers-color-scheme: dark)"
     data-react-helmet="true"
   />
   <link
     rel="icon"
     type="image/svg+xml"
-    href="/favicons/favicon.svg"
+    href="/favicons/favicon-light.svg"
+    media="(prefers-color-scheme: dark)"
+    data-react-helmet="true"
+  />
+  <link
+    rel="alternate icon"
+    type="image/png"
+    href="/favicons/favicon-dark.png"
+    media="(prefers-color-scheme: light)"
+    data-react-helmet="true"
+  />
+  <link
+    rel="icon"
+    type="image/svg+xml"
+    href="/favicons/favicon-dark.svg"
+    media="(prefers-color-scheme: light)"
     data-react-helmet="true"
   />
   <style>
diff --git a/site/static/favicons/favicon.png b/site/static/favicons/favicon-dark.png
similarity index 100%
rename from site/static/favicons/favicon.png
rename to site/static/favicons/favicon-dark.png
diff --git a/site/static/favicons/favicon.svg b/site/static/favicons/favicon-dark.svg
similarity index 100%
rename from site/static/favicons/favicon.svg
rename to site/static/favicons/favicon-dark.svg
diff --git a/site/static/favicons/favicon-light.png b/site/static/favicons/favicon-light.png
new file mode 100644
index 0000000000000000000000000000000000000000..048d4e974ccec7f77964cb6cc1b141bb49437fe5
GIT binary patch
literal 2742
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
R?eoVy0k&2Ss7gy>{J-1*BP;*_

literal 0
HcmV?d00001

diff --git a/site/static/favicons/favicon-light.svg b/site/static/favicons/favicon-light.svg
new file mode 100644
index 0000000000..03949d61e9
--- /dev/null
+++ b/site/static/favicons/favicon-light.svg
@@ -0,0 +1,8 @@
+<svg width="117" height="117" viewBox="0 0 117 117" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M109.69 52.8897C107.511 52.8897 106.059 51.6121 106.059 48.9897V33.9276C106.059 24.3121 102.098 19 91.8643 19H87.1107V29.1534H88.5633C92.5905 29.1534 94.5051 31.3724 94.5051 35.3396V48.6535C94.5051 54.4362 96.2216 56.7897 99.9849 58C96.2216 59.1432 94.5051 61.5638 94.5051 67.3465C94.5051 70.6415 94.5051 73.9362 94.5051 77.2312C94.5051 79.9879 94.5051 82.6776 93.7789 85.4344C93.0527 87.9897 91.8643 90.4103 90.2138 92.4947C89.2895 93.7053 88.2331 94.7138 87.0449 95.6553V97H91.7982C102.032 97 105.993 91.6879 105.993 82.0724V67.0103C105.993 64.3206 107.379 63.1103 109.624 63.1103H112.331V52.9568H109.69V52.8897Z" fill="white"/>
+<path d="M77.3397 34.3331H62.683C62.3528 34.3331 62.0889 34.0641 62.0889 33.7279V32.5849C62.0889 32.2486 62.3528 31.9797 62.683 31.9797H77.4057C77.7357 31.9797 77.9998 32.2486 77.9998 32.5849V33.7279C77.9998 34.0641 77.6696 34.3331 77.3397 34.3331Z" fill="white"/>
+<path d="M79.8483 48.8566H69.153C68.8228 48.8566 68.5586 48.5875 68.5586 48.2513V47.1083C68.5586 46.7722 68.8228 46.5031 69.153 46.5031H79.8483C80.1785 46.5031 80.4424 46.7722 80.4424 47.1083V48.2513C80.4424 48.5204 80.1785 48.8566 79.8483 48.8566Z" fill="white"/>
+<path d="M84.0737 41.5948H62.683C62.3528 41.5948 62.0889 41.3259 62.0889 40.9897V39.8465C62.0889 39.5103 62.3528 39.2414 62.683 39.2414H84.0077C84.3379 39.2414 84.602 39.5103 84.602 39.8465V40.9897C84.602 41.2586 84.4039 41.5948 84.0737 41.5948Z" fill="white"/>
+<path d="M45.7154 37.6259C47.1678 37.6259 48.6204 37.7604 50.0068 38.0966V35.3396C50.0068 31.4396 51.9874 29.1534 55.9488 29.1534H57.4012V19H52.6476C42.4142 19 38.4531 24.3121 38.4531 33.9276V38.9034C40.7637 38.0966 43.2067 37.6259 45.7154 37.6259Z" fill="white"/>
+<path d="M88.5634 74.2037C87.507 65.664 81.0369 58.5364 72.7182 56.9226C70.4076 56.452 68.0967 56.3846 65.8521 56.7881C65.7861 56.7881 65.7861 56.7208 65.7201 56.7208C62.0889 48.9881 54.2985 43.8777 45.8477 43.8777C37.397 43.8777 29.6726 48.8537 25.9753 56.5864C25.9093 56.5864 25.9093 56.6537 25.8433 56.6537C23.4666 56.3846 21.0898 56.519 18.713 57.1243C10.5264 59.1414 4.32042 66.1346 3.19806 74.607C3.06602 75.4811 3 76.3552 3 77.1623C3 79.7173 4.71655 82.0708 7.22534 82.407C10.3283 82.8778 13.0352 80.457 12.9692 77.364C12.9692 76.8932 12.9692 76.3552 13.0352 75.8846C13.5634 71.5811 16.7984 67.9502 21.0237 66.9414C22.3442 66.6052 23.6646 66.5381 24.919 66.7399C28.9463 67.2778 32.9075 65.1932 34.6241 61.5623C35.8786 58.8726 37.8592 56.519 40.5001 55.2414C43.4048 53.8293 46.706 53.6278 49.7431 54.7037C52.9119 55.8467 55.2886 58.2673 56.7412 61.2932C58.2596 64.252 58.9858 66.3364 62.221 66.7399C63.5413 66.9414 67.2385 66.8743 68.625 66.807C71.3319 66.807 74.0388 67.7484 75.9534 69.6984C77.2076 71.0432 78.1319 72.7243 78.5282 74.607C79.1223 77.6329 78.3961 80.6587 76.6135 82.9449C75.359 84.5587 73.6425 85.769 71.7279 86.307C70.8036 86.5761 69.8793 86.6432 68.955 86.6432C68.4269 86.6432 67.7007 86.6432 66.8425 86.6432C64.2017 86.6432 58.5898 86.6432 54.3643 86.6432C51.4596 86.6432 49.1487 84.2899 49.1487 81.3311V71.3793V61.6293C49.1487 60.8226 48.4886 60.1502 47.6963 60.1502H45.6496C41.6222 60.2173 38.3873 64.7899 38.3873 69.6311C38.3873 74.4726 38.3873 87.3158 38.3873 87.3158C38.3873 92.5605 42.5465 96.7967 47.6963 96.7967C47.6963 96.7967 70.6057 96.7293 70.9357 96.7293C76.2173 96.1914 81.103 93.4346 84.4039 89.1984C87.7051 85.0967 89.2235 79.7173 88.5634 74.2037Z" fill="white"/>
+</svg>