feat: New logo (#238)

Nuclear-Squid · web-flow · commit 1d580923f317 · 2024-09-09T21:52:24.000+02:00
* feat: New logo

* remove useless comments and blank lines
diff --git a/www/static/favicon.svg b/www/static/favicon.svg
@@ -1,39 +1,79 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="400" height="410">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-128 -128 256 256">
 
   <style>
-    :root { color-scheme: light dark; }
-
-    /* full-size icon */
-    .green  { fill: hsl(125,  75%, 40%); }
-    .purple { fill: hsl(290,  80%, 30%); }
-    .red    { fill: hsl(  0,  92%, 50%); }
-    .blue   { fill: hsl(200, 100%, 40%); }
-    .yellow { fill: hsl( 50, 100%, 50%); }
-    #rocket { fill: #544; }
-    @media (prefers-color-scheme: dark) { #rocket { fill: #cbb; } }
-
-    /* favicon */
-    @media (max-width: 32px) { #oif path { fill: none; } }
-    @media (max-width: 32px) and (prefers-color-scheme: dark)  { #rocket { fill: #fff; } }
-    @media (max-width: 32px) and (prefers-color-scheme: light) { #rocket { fill: #333; } }
+    :root {
+      color-scheme: light dark;
+      --rocket:  #343048;
+      --border:  #edebf0;
+      --red:     hsl(-10,  80%, 55%);
+      --yellow:  hsl( 45,  90%, 55%);
+      --green:   hsl(130,  80%, 40%);
+      --blue:    hsl(200, 100%, 40%);
+      --purple:  hsl(275,  75%, 55%);
+    }
+
+    @media (prefers-color-scheme: dark) { :root {
+      --rocket: #edebf0;
+      --border: #343048;
+    }}
+
+    .star {
+      fill:   var(--border);
+      stroke: none;
+    }
+
+    .rocket {
+      fill:   var(--rocket);
+      stroke: var(--border);
+      stroke-width: 4px;
+    }
+
+    .gas {
+      fill:   var(--rocket);
+      stroke: var(--border);
+      stroke-width: 2px;
+    }
   </style>
 
-  <!-- https://upload.wikimedia.org/wikipedia/commons/0/0b/Logo_OIF.svg -->
-  <g id="oif" transform="scale(10-10) translate(-1-42)">
-    <path class="green"  transform="translate(17.908 39.630)" d="m0 0-.006-1.004c.957.139 1.932.21 2.921.199l.002-3.691c5.757-.389 10.777-4.304 12.497-9.896l4.339 1.411C17.137-4.583 8.896.944 0 0"/>
-    <path class="red"    transform="translate(31.284 06.873)" d="m0 0-2.17 2.984C-7.059-.083-13.419.132-18.098 3.647l-2.681-3.693C-13.727-5.302-3.81-4.928 2.832 1.062l-.586.817A18.628 18.628 0 0 0 0 0"/>
-    <path class="purple" transform="translate(37.526 29.670)" d="m0 0-.958-.304c.429-.867.799-1.773 1.093-2.717l-3.509-1.142c1.407-5.597-.764-11.579-5.551-14.944l2.683-3.69C.937-17.715 3.644-8.168 0 0"/>
-    <path class="blue"   transform="translate(12.673 09.812)" d="M0 0c-4.428 3.702-6.189 9.817-4.293 15.353l-4.339 1.408c-2.82-8.329.6-17.646 8.35-22.112l.596.811c-.857.448-1.688.963-2.481 1.555L0 0"/>
-    <path class="yellow" transform="translate(07.550 25.434)" d="M0 0c2.151 5.356 7.424 8.92 13.275 8.828l-.002 4.563c-8.794.107-16.597-6.024-18.45-14.775l.955-.317c.161.955.395 1.904.713 2.84L0 0"/>
+  <defs>
+    <path id="oif-segment" stroke="var(--border)" stroke-width="1.25"
+      d="M74.363-55.96a96 96 0 0 0-12.776-22.795 100 100 90 0 0-92.302-16.446
+         100 100 90 0 0-25.833 12.79 96 96 0 0 1 2.34-.951A96 96 0 0 1
+         66.76-21.727a96 96 0 0 1 3.588 44.171 96 96 0 0 0 4.015-78.403z"/>
+
+    <path id="drop"
+      d="M0,0
+          C-10,0  -22,8  -22,20
+          C-22,30  -7,50   0,70
+          C7,50    22,30  22,20
+          C22,8    10,0    0,0z"/>
+  </defs>
+
+  <g transform="scale(1.09)">
+    <use href="#oif-segment" fill="var(--green)"  transform="rotate(0)"   />
+    <use href="#oif-segment" fill="var(--purple)" transform="rotate(72)"  />
+    <use href="#oif-segment" fill="var(--red)"    transform="rotate(144)" />
+    <use href="#oif-segment" fill="var(--blue)"   transform="rotate(216)" />
+    <use href="#oif-segment" fill="var(--yellow)" transform="rotate(288)" />
   </g>
 
-  <!-- https://www.svgrepo.com/svg/99963/rocket-pointing-to-upper-left-direction -->
-  <g id="rocket" transform="scale(-0.6,0.6) translate(-600,70)">
-    <path d="M208.195,373.272l24.652,88.625c0.287,1.062,0.908,1.998,1.75,2.707l75.802,63.035c0.985,0.812,2.2,1.244,3.443,1.244 c0.535,0,1.052-0.078,1.577-0.24c1.74-0.535,3.089-1.902,3.596-3.643l26.039-89.486c18.972,0.766,35.716-3.576,49.495-13.043 l34.502,28.344c2.189,1.787,5.374,1.605,7.334-0.449l25.618-26.957c0.994-1.043,1.521-2.449,1.473-3.902 c-0.048-1.443-0.68-2.811-1.75-3.787l-34.157-31.326c2.916-7.955,8.147-27.779,2.601-57.939l87.784-32.053 c1.712-0.622,2.983-2.066,3.395-3.835c0.421-1.769-0.096-3.624-1.349-4.944l-67.97-71.413c-0.794-0.832-1.817-1.387-2.955-1.597 l-89.533-16.007c-16.85-19.479-36.453-39.188-58.284-58.618C175.548,26.125,77.284,9.428,29.902,9.428 c-15.596,0-24.193,1.894-24.556,1.97c-2.133,0.478-3.758,2.199-4.131,4.351c-0.956,5.565-21.401,138.178,151.174,310.753 C152.618,326.721,175.749,349.145,208.195,373.272z M216.352,276.806c-30.026,0-54.363-24.337-54.363-54.363 c0-30.026,24.336-54.362,54.363-54.362s54.363,24.336,54.363,54.362C270.714,252.469,246.378,276.806,216.352,276.806z"/>
-    <path d="M420.97,471.278c-1.166-1.146-2.859-1.605-4.456-1.215c-1.597,0.393-2.878,1.568-3.395,3.117l-12.364,36.73 c-0.593,1.76-0.115,3.701,1.224,4.982l58.638,56.045c0.898,0.852,2.075,1.33,3.309,1.33l0,0h49.429l0,0 c1.95,0,3.7-1.186,4.437-2.984c0.727-1.807,0.287-3.873-1.109-5.23L420.97,471.278z"/>
-    <path d="M486.454,441.329c-0.908-0.947-2.161-2.936-3.462-2.936c-0.038,0-0.076,0-0.124,0c-1.349,0-2.61,2.084-3.49,3.107 l-21.258,26.049c-1.625,1.883-1.539,4.695,0.201,6.473l94.745,96.82c0.898,0.918,2.133,1.436,3.414,1.436l0,0h15.663h4.781 c2.64,0,4.781-2.143,4.781-4.781v-22.893c0-1.225-0.479-3.137-1.319-4.027L486.454,441.329z"/>
-    <path d="M580.262,453.11l-68.458-66.729c-1.587-1.559-4.045-1.797-5.89-0.611l-28.028,17.748c-1.233,0.785-2.036,2.074-2.189,3.52 c-0.153,1.443,0.354,2.887,1.387,3.91l96.485,95.701c0.918,0.91,2.142,1.387,3.376,1.387c0.611,0,1.243-0.123,1.836-0.373 c1.769-0.736,2.926-2.477,2.926-4.408v-46.73C581.706,455.243,581.18,453.999,580.262,453.11z"/>
+  <g transform="rotate(36)">
+    <!-- Rocket -->
+    <path class="rocket"
+      d="M0-141
+       A820,820 0 0 1 72,103
+       A270,270 0 0 0 0,16.5
+       A270,270 0 0 0 -72,103
+       A820,820 0 0 1 0-141"/>
+
+    <!-- Star -->
+    <path transform="translate(0-36) scale(1.5)" class="star"
+      d="M0-16 3.652-4.76h11.817l-9.56 6.944 3.65 11.24L0 6.474l-9.561 6.947
+          3.652-11.24-9.56-6.943h11.817L0-16z"/>
+
+    <use href="#drop" class="gas"  transform="translate(0 40) scale(1.3 1.4)" />
+    <use href="#drop" class="star" transform="translate(0 39) scale(0.8 0.7)" />
   </g>
 
 </svg>
