readme: Add support for light/dark modes in the logo

Use the mechanism described here:
https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#specifying-the-theme-an-image-is-shown-to

to provide different logos for light and dark mode, so that the "Zephyr"
text is clearly visible in both.

Signed-off-by: Carles Cufi <carles.cufi@nordicsemi.no>
This commit is contained in:
Carles Cufi 2022-11-17 18:08:37 +01:00 committed by Carles Cufí
parent 1374415a2c
commit 3fea29d7c5
3 changed files with 172 additions and 1 deletions

View File

@ -2,7 +2,11 @@
<a href="https://www.zephyrproject.org">
<p align="center">
<img src="doc/_static/images/logo-readme.svg">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="doc/_static/images/logo-readme-dark.svg">
<source media="(prefers-color-scheme: light)" srcset="doc/_static/images/logo-readme-light.svg">
<img src="doc/_static/images/logo-readme-light.svg">
</picture>
</p>
</a>

167
doc/_static/images/logo-readme-dark.svg generated vendored Normal file
View File

@ -0,0 +1,167 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 360 185"
version="1.1"
id="svg55"
width="360"
height="185">
<metadata
id="metadata59">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs20">
<style
id="style2">.cls-1{fill:#7929d2;}.cls-2{fill:#9454db;}.cls-3{fill:#af7fe4;}.cls-4{fill:url(#linear-gradient);}.cls-5{fill:url(#linear-gradient-2);}.cls-6{fill:url(#linear-gradient-3);}.cls-7{fill:url(#linear-gradient-4);}.cls-8{fill:#ffffff;}</style>
<linearGradient
id="linear-gradient"
x1="173.22662"
y1="83.041153"
x2="269.62073"
y2="83.041153"
gradientUnits="userSpaceOnUse">
<stop
offset="0"
stop-color="#7929d2"
id="stop4" />
<stop
offset="1"
stop-color="#0070c5"
id="stop6" />
</linearGradient>
<linearGradient
id="linear-gradient-2"
x1="179.78728"
y1="-1.87884"
x2="178.9799"
y2="93.40757"
gradientUnits="userSpaceOnUse">
<stop
offset="0"
stop-color="#00aeff"
id="stop9" />
<stop
offset="1"
stop-color="#9454db"
id="stop11" />
</linearGradient>
<linearGradient
id="linear-gradient-3"
x1="232.84549"
y1="37.632019"
x2="212.26581"
y2="1.98698"
gradientUnits="userSpaceOnUse">
<stop
offset="0"
stop-color="#66a9dc"
id="stop14" />
<stop
offset="1"
stop-color="#b1e4fa"
id="stop16" />
</linearGradient>
<linearGradient
id="linear-gradient-4"
x1="237.4232"
y1="9.7026796"
x2="249.11588"
y2="90.576942"
xlink:href="#linear-gradient-2" />
<linearGradient
xlink:href="#linear-gradient-2"
id="linearGradient884"
gradientUnits="userSpaceOnUse"
x1="179.78728"
y1="-1.87884"
x2="178.9799"
y2="93.40757" />
</defs>
<g
id="Colored_Positive"
data-name="Colored Positive"
transform="matrix(0.81480572,0,0,0.81480572,1.6221167,-0.40622648)">
<polygon
class="cls-1"
points="105.31,135.046 132.385,148.72 137.154,121.601 "
id="polygon22" />
<polygon
class="cls-2"
points="34.434,126.703 42.309,153.408 68.401,139.419 "
id="polygon24" />
<polygon
class="cls-3"
points="105.31,135.046 68.401,139.419 84.508,115.518 "
id="polygon26" />
<polygon
class="cls-3"
points="34.434,126.703 8.759,101.076 38.535,97.167 "
id="polygon28" />
<polygon
class="cls-4"
points="220.982,44.482 258.666,94.416 137.154,121.601 "
id="polygon30"
style="fill:url(#linear-gradient)" />
<polygon
class="cls-5"
points="172.959,8.13 220.982,44.482 137.154,121.601 "
id="polygon32"
style="fill:url(#linearGradient884)" />
<polygon
class="cls-6"
points="258.666,8.13 220.982,44.482 172.959,8.13 "
id="polygon34"
style="fill:url(#linear-gradient-3)" />
<polygon
class="cls-7"
points="258.666,8.13 220.982,44.482 258.666,94.416 "
id="polygon36"
style="fill:url(#linear-gradient-4)" />
<path
class="cls-8"
d="m 172.56179,206.12831 v -9.06612 l 24.189,-33.82651 h -23.04621 v -9.828 h 35.88353 v 8.6471 l -24.41756,34.24553 h 25.06514 v 9.828 z"
id="path38" />
<path
class="cls-8"
d="m 225.19819,188.71984 q 0.26614,5.33352 2.59032,7.65668 2.32317,2.32392 7.31384,2.32367 a 16.21678,16.21678 0 0 0 5.0854,-0.72377 8.14694,8.14694 0 0 0 3.82834,-2.78078 l 7.31384,5.21873 a 14.7969,14.7969 0 0 1 -6.22819,5.18064 q -3.82835,1.71418 -10.45651,1.71418 -9.86706,0 -14.72291,-5.18064 -4.85685,-5.18013 -4.85685,-15.65619 0,-21.44607 19.19883,-21.44631 8.53182,0 13.00874,4.81875 4.47491,4.81926 4.47592,14.03724 v 4.8378 z m 16.799,-6.78054 q 0,-9.10395 -7.96142,-9.10421 a 9.102,9.102 0 0 0 -4.3045,0.89519 6.69237,6.69237 0 0 0 -2.68555,2.6665 16.81823,16.81823 0 0 0 -1.58086,5.54252 z"
id="path40" />
<path
class="cls-8"
d="m 295.96782,185.86287 a 30.72681,30.72681 0 0 1 -1.94274,11.35169 16.29,16.29 0 0 1 -5.56156,7.50431 14.46506,14.46506 0 0 1 -8.6471,2.59032 16.46611,16.46611 0 0 1 -11.3136,-4.15213 V 221.175 h -9.828 v -55.00617 h 9.06618 v 3.92357 a 23.592,23.592 0 0 1 5.77107,-3.71406 16.89719,16.89719 0 0 1 6.952,-1.35229 q 7.58,0 11.54216,5.333 3.96059,5.33352 3.96159,15.50382 z m -10.13272,0.15238 q 0,-5.82822 -2.01892,-9.08517 a 6.62576,6.62576 0 0 0 -6.01868,-3.25694 12.12546,12.12546 0 0 0 -4.933,1.12374 16.5144,16.5144 0 0 0 -4.36164,2.76174 v 17.48465 a 15.71263,15.71263 0 0 0 3.86644,2.49508 11.0079,11.0079 0 0 0 4.74256,1.08565 7.3295,7.3295 0 0 0 6.38057,-3.44741 q 2.34268,-3.44715 2.34267,-9.16134 z"
id="path42" />
<path
class="cls-8"
d="M 328.834,206.12831 V 184.1106 q 0,-6.32292 -1.18088,-8.38044 a 4.41856,4.41856 0 0 0 -4.19022,-2.057 q -4.38168,0 -10.55174,5.79012 v 26.66505 h -9.828 V 149.408 h 9.828 v 21.94152 a 22.63076,22.63076 0 0 1 6.66626,-4.72352 16.77074,16.77074 0 0 1 6.93292,-1.5999 q 6.70335,0 9.428,3.77119 2.72315,3.77121 2.72365,10.666 v 26.66505 z"
id="path44" />
<path
class="cls-8"
d="m 343.30229,211.49941 a 17.84733,17.84733 0 0 0 5.752,1.1047 6.06415,6.06415 0 0 0 3.88548,-1.33326 q 1.67508,-1.33375 3.46645,-5.52347 l 1.02851,-2.36176 -14.43722,-37.21679 h 10.20891 l 9.447,25.52226 9.6756,-25.52226 h 9.98035 L 365.12953,208.871 a 31.82753,31.82753 0 0 1 -4.07594,7.61858 11.66364,11.66364 0 0 1 -4.62829,3.58074 17.35552,17.35552 0 0 1 -6.64722,1.10469 32.71115,32.71115 0 0 1 -8.5709,-1.14278 z"
id="path46" />
<path
class="cls-8"
d="m 410.98539,175.76825 a 9.086,9.086 0 0 0 -4.03785,-0.76186 10.86745,10.86745 0 0 0 -5.19968,1.31421 22.916,22.916 0 0 0 -5.04731,3.82834 v 25.97937 h -9.828 v -39.95948 h 9.828 v 5.71394 a 25.65574,25.65574 0 0 1 5.40919,-4.53306 12.06278,12.06278 0 0 1 6.4758,-1.79036 8.69776,8.69776 0 0 1 4.34259,0.79995 z"
id="path48" />
<path
class="cls-8"
d="m 424.04622,167.02661 h -0.904 v 2.07682 h -1.234 v -5.79574 h 2.71145 a 1.8049,1.8049 0 0 1 1.94644,1.86828 1.66317,1.66317 0 0 1 -1.26926,1.72025 l 1.30385,2.20721 h -1.4166 z m 0.39081,-2.65889 h -1.29486 v 1.59886 h 1.29483 a 0.8022,0.8022 0 1 0 0,-1.59886 z"
id="path50" />
<path
class="cls-8"
d="m 424.254,172.49932 a 6.29376,6.29376 0 1 1 6.29434,-6.294 6.30082,6.30082 0 0 1 -6.29434,6.294 z m 0,-11.7913 a 5.49754,5.49754 0 1 0 5.49812,5.49735 5.50374,5.50374 0 0 0 -5.49812,-5.49737 z"
id="path52" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 7.1 KiB

View File

Before

Width:  |  Height:  |  Size: 7.1 KiB

After

Width:  |  Height:  |  Size: 7.1 KiB