Using vector instead of lowres image

public/css/embed.css

@@ -150,7 +150,7 @@
   position: absolute;
     top: -47px;
     left: 10px;
-    background-image: url('public/images/squareicon_small.png');
+    background-image: url('public/images/z.svg');
     width: 50px;
     height: 50px;
     background-position: center;

public/images/z.svg

@@ -0,0 +1,92 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+              "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="1600" height="1024"
+     viewBox="0 0 1600 1024">
+  <path id="letterZ"
+        fill="white" stroke="none" stroke-width="1"
+        d="M 424.00,88.47
+           C 448.68,98.55 455.10,132.92 436.83,151.91
+             427.76,161.34 418.44,163.14 406.00,163.00
+             389.20,162.80 374.05,150.57 370.52,134.00
+             369.82,130.73 369.99,126.41 370.00,123.00
+             370.03,104.41 381.95,90.48 400.00,86.46
+             407.48,85.43 416.95,85.60 424.00,88.47 Z
+           M 652.00,88.47
+           C 676.68,98.55 683.10,132.92 664.83,151.91
+             655.76,161.34 646.44,163.14 634.00,163.00
+             617.20,162.80 602.05,150.57 598.52,134.00
+             597.82,130.73 597.99,126.41 598.00,123.00
+             598.03,104.41 609.95,90.48 628.00,86.46
+             635.48,85.43 644.95,85.60 652.00,88.47 Z
+           M 750.00,231.00
+           C 750.00,231.00 750.00,275.00 750.00,275.00
+             749.98,285.27 746.65,286.97 740.63,295.00
+             740.63,295.00 723.13,318.00 723.13,318.00
+             723.13,318.00 643.88,422.00 643.88,422.00
+             643.88,422.00 445.88,682.00 445.88,682.00
+             445.88,682.00 378.88,770.00 378.88,770.00
+             378.88,770.00 345.00,814.00 345.00,814.00
+             345.00,814.00 753.00,814.00 753.00,814.00
+             753.00,814.00 753.00,865.00 753.00,865.00
+             753.00,865.00 270.00,865.00 270.00,865.00
+             270.00,865.00 270.00,821.00 270.00,821.00
+             270.02,810.30 274.03,808.20 280.35,800.00
+             280.35,800.00 297.87,777.00 297.87,777.00
+             297.87,777.00 379.35,670.00 379.35,670.00
+             379.35,670.00 581.12,405.00 581.12,405.00
+             581.12,405.00 648.12,317.00 648.12,317.00
+             648.12,317.00 674.00,283.00 674.00,283.00
+             674.00,283.00 304.00,283.00 304.00,283.00
+             304.00,283.00 304.00,231.00 304.00,231.00
+             304.00,231.00 750.00,231.00 750.00,231.00 Z" />
+   <path id="shadeZ"
+         fill="black" stroke="none" style="fill-opacity:0.3;" stroke-width="1"
+         d="M 465.00,125.00
+            C 465.00,125.00 506.00,166.00 506.00,166.00
+              506.00,166.00 547.00,207.00 547.00,207.00
+              547.00,207.00 569.00,230.00 569.00,230.00
+              569.00,230.00 463.00,230.00 463.00,230.00
+              460.91,230.00 457.94,230.12 456.00,229.40
+              452.15,227.98 444.26,219.26 441.00,216.00
+              441.00,216.00 406.00,181.00 406.00,181.00
+              398.41,173.41 380.82,156.95 375.70,149.00
+              372.76,144.44 369.02,137.43 371.00,132.00
+              372.13,138.21 374.82,143.10 378.82,147.96
+              393.72,166.06 420.54,167.00 436.56,149.83
+              445.06,140.72 448.84,128.30 446.53,116.00
+              445.68,111.45 443.46,107.35 442.00,103.00
+              442.00,103.00 465.00,125.00 465.00,125.00 Z
+            M 1586.67,1021.33
+            C 1586.67,1021.33 426.33,1024.00 426.33,1024.00
+              426.33,1024.00 270.00,864.00 270.00,864.00
+              270.00,864.00 753.00,864.00 753.00,864.00
+              753.00,864.00 753.00,813.00 753.00,813.00
+              753.00,813.00 345.00,813.00 345.00,813.00
+              345.00,813.00 372.63,776.00 372.63,776.00
+              372.63,776.00 436.63,692.00 436.63,692.00
+              436.63,692.00 644.37,419.00 644.37,419.00
+              644.37,419.00 722.87,316.00 722.87,316.00
+              722.87,316.00 740.37,293.00 740.37,293.00
+              746.87,284.35 749.98,283.01 750.00,272.00
+              750.00,272.00 750.00,230.00 750.00,230.00
+              750.00,230.00 691.00,230.00 691.00,230.00
+              688.91,230.00 685.94,230.12 684.00,229.40
+              680.15,227.98 672.26,219.26 669.00,216.00
+              669.00,216.00 629.00,176.00 629.00,176.00
+              621.24,168.24 607.66,155.97 602.46,147.00
+              599.98,142.71 597.21,136.91 599.00,132.00
+              600.13,138.21 602.82,143.10 606.82,147.96
+              621.72,166.06 648.54,167.00 664.56,149.83
+              673.06,140.72 676.84,128.30 674.53,116.00
+              673.68,111.45 671.46,107.35 670.00,103.00
+              676.59,107.72 1586.66,1019.24 1586.67,1021.33 Z
+            M 675.00,281.00
+            C 675.00,281.00 638.37,330.00 638.37,330.00
+              638.37,330.00 561.58,431.00 561.58,431.00
+              561.58,431.00 514.00,494.00 514.00,494.00
+              514.00,494.00 304.00,281.00 304.00,281.00
+              304.00,281.00 675.00,281.00 675.00,281.00 Z" />
+</svg>

public/php/channel.php

@@ -12,7 +12,7 @@
 
                 <div class="brand-logo truncate zbrand">
                     <a href="/" class="brand-logo brand-logo-navigate noselect">
-                        <img id="zicon" src="public/images/squareicon_small.png" alt="zöff" title="Zöff" />
+                        <img id="zicon" src="public/images/z.svg" alt="zöff" title="Zöff" />
                     </a>
 
                     <span id="chan" class="chan clickable truncate" title="Show big URL"><?php echo(ucfirst($list));?></span>

public/php/controller.php

@@ -8,11 +8,11 @@
         <nav id="fp-nav">
             <div class="nav-wrapper">
                 <a href="/" class="brand-logo brand-logo-navigate hide-on-med-and-down noselect">
-                    <img id="zicon" src="public/images/squareicon_small.png" alt="zöff" title="Zöff" />
+                    <img id="zicon" src="public/images/z.svg" alt="zöff" title="Zöff" />
                 </a>
                 <div class="brand-logo truncate zbrand">
                     <a href="/" class="hide-on-large-only brand-logo-navigate">
-                        <img id="zicon" src="public/images/squareicon_small.png" alt="zöff" title="Zöff" />
+                        <img id="zicon" src="public/images/z.svg" alt="zöff" title="Zöff" />
                     </a>
                 </div>
                 <ul class="right hide-on-med-and-down">

public/php/frontpage.php

@@ -17,7 +17,7 @@ if(isset($_GET['chan'])){
         <nav id="fp-nav">
             <div class="nav-wrapper">
                 <a href="#" class="brand-logo noselect">
-                    <img id="zicon" src="public/images/squareicon_small.png" alt="zöff" title="Zöff" />
+                    <img id="zicon" src="public/images/z.svg" alt="zöff" title="Zöff" />
                 </a>
                 <div id="frontpage-viewer-counter" data-position="bottom" data-delay="5" data-tooltip="Total viewers" class="noselect tooltipped" title="Divided among all channels. Hidden or not"></div>
                 <!--<a href="//zoff.no" class="brand-logo brand-mobile hide-on-med-and-up">Zöff</a>-->