v2 ui tweaks (#702)

* fix m3u and xml urls (kind of)

* use svg logos

* tweak theme colors

ErsatzTV/client-app/src/assets/images/ersatztv-logo.svg

@@ -0,0 +1,88 @@
+<?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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="67.791206mm"
+   height="36.611721mm"
+   viewBox="0 0 67.791206 36.611721"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)"
+   sodipodi:docname="ersatztv-logo.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.49497475"
+     inkscape:cx="199.98633"
+     inkscape:cy="92.251514"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="3408"
+     inkscape:window-height="1364"
+     inkscape:window-x="14"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <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>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-66.205082,-134.16488)">
+    <g
+       aria-label="Etv"
+       id="text78"
+       style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:50.8px;line-height:1.25;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:0px;word-spacing:0px;fill:#c0c000;fill-opacity:1;stroke:none;stroke-width:0.264583">
+      <path
+         d="m 66.205082,170.2805 v -36.11562 h 24.159765 v 6.02754 H 73.671293 v 8.60722 h 14.262695 v 5.8291 H 73.671293 v 9.64903 h 16.767968 v 6.00273 z"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:50.8px;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#c0c000;fill-opacity:1;stroke-width:0.264583"
+         id="path98" />
+      <path
+         d="m 107.75293,170.10687 q -2.00918,0.66973 -4.31601,0.66973 -3.522269,0 -5.605863,-1.83555 -2.083593,-1.83555 -2.083593,-6.10195 v -14.16348 h -3.943946 v -5.23379 h 3.943946 v -6.62285 h 7.168556 v 6.62285 h 4.56406 v 5.23379 h -4.56406 v 13.41934 q 0,1.68671 0.69453,2.23242 0.69453,0.5457 2.05879,0.5457 1.0914,0 2.08359,-0.19844 z"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:50.8px;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#00c0c0;fill-opacity:1;stroke-width:0.264583"
+         id="path100" />
+      <path
+         d="m 133.99629,143.44183 -9.05371,26.83867 h -6.82129 l -9.07852,-26.83867 h 7.51583 l 4.98574,18.03301 4.96093,-18.03301 z"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:50.8px;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#00c000;fill-opacity:1;stroke-width:0.264583"
+         id="path102" />
+    </g>
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-weight:normal;font-size:10.5833px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.264583"
+       x="58.779785"
+       y="199.18695"
+       id="text82"><tspan
+         sodipodi:role="line"
+         id="tspan80"
+         x="58.779785"
+         y="199.18695"
+         style="stroke-width:0.264583"></tspan></text>
+  </g>
+</svg>

ErsatzTV/client-app/src/assets/images/ersatztv.svg

@@ -0,0 +1,77 @@
+<?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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="191.74141mm"
+   height="34.2752mm"
+   viewBox="0 0 191.74141 34.2752"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="ersatztv.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.35"
+     inkscape:cx="368.16022"
+     inkscape:cy="84.671368"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="3436"
+     inkscape:window-height="1389"
+     inkscape:window-x="0"
+     inkscape:window-y="24"
+     inkscape:window-maximized="0"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0" />
+  <metadata
+     id="metadata5">
+    <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>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-8.4242743,-125.76403)">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-weight:normal;font-size:19.8158px;line-height:1.25;font-family:sans-serif;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.495396"
+       x="5.4054561"
+       y="159.5748"
+       id="text841"><tspan
+         sodipodi:role="line"
+         id="tspan839"
+         x="5.4054561"
+         y="159.5748"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:47.558px;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;stroke-width:0.495396"><tspan
+           style="fill:#c0c000;fill-opacity:1"
+           id="tspan843">Ersatz</tspan><tspan
+           style="fill:#00c0c0;fill-opacity:1"
+           id="tspan845">T</tspan><tspan
+           style="fill:#00c000;fill-opacity:1"
+           id="tspan847">V</tspan></tspan></text>
+  </g>
+</svg>

ErsatzTV/client-app/src/components/Navigation/SideBarLogo.vue

@@ -2,12 +2,12 @@
     <span>
         <v-img
             v-if="!isNavigationMini"
-            src="@/assets/images/ersatztv.png"
+            src="@/assets/images/ersatztv.svg"
             class="ma-3"
         ></v-img>
         <v-img
             v-if="isNavigationMini"
-            src="@/assets/images/ersatztv-500.png"
+            src="@/assets/images/ersatztv-logo.svg"
             class="ma-1"
         ></v-img>
         <v-divider inset></v-divider>

ErsatzTV/client-app/src/plugins/vuetify.js

@@ -11,8 +11,8 @@ export default new Vuetify({
     theme: {
         themes: {
             dark: {
-                primary: colors.yellow,
-                secondary: colors.teal.accent3,
+                primary: "#c0c000",
+                secondary: "#00c0c0",
                 accent: colors.yellow.accent2,
                 error: colors.red,
                 warning: colors.orange,

ErsatzTV/client-app/src/stores/applicationState.js

@@ -1,14 +1,14 @@
 import { defineStore } from "pinia";
 
-const pageURL = `${window.location}`;
+const originURL = `${window.location.origin}`;
 
 export const applicationState = defineStore("appState", {
     state: () => {
         return {
             miniMenu: false,
             currentVersion: "0.4.3-7cd2f9a-docker-nvidia", // Needs to be pulled from API with an action when ready
-            m3uURL: pageURL + "iptv/channels.m3u",
-            xmlURL: pageURL + "iptv/xmltv.xml",
+            m3uURL: originURL + "/iptv/channels.m3u", // this will need to be fixed for reverse proxies
+            xmlURL: originURL + "/iptv/xmltv.xml", // this will need to be fixed for reverse proxies
             documentationURL: "https://ersatztv.org/",
             githubURL: "https://github.com/jasongdove/ErsatzTV",
             discordURL: "https://discord.gg/hHaJm3yGy6",

ErsatzTV/client-app/vue.config.js

@@ -9,5 +9,5 @@ module.exports = defineConfig({
     },
     publicPath: "/v2/",
     outputDir: "../wwwroot/v2",
-    filenameHashing: false
+    filenameHashing: false,
 });

artwork/ersatztv.svg

@@ -0,0 +1,77 @@
+<?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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="191.74141mm"
+   height="34.2752mm"
+   viewBox="0 0 191.74141 34.2752"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
+   sodipodi:docname="ersatztv.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.35"
+     inkscape:cx="368.16022"
+     inkscape:cy="84.671368"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     inkscape:window-width="3436"
+     inkscape:window-height="1389"
+     inkscape:window-x="0"
+     inkscape:window-y="24"
+     inkscape:window-maximized="0"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0" />
+  <metadata
+     id="metadata5">
+    <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>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-8.4242743,-125.76403)">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-weight:normal;font-size:19.8158px;line-height:1.25;font-family:sans-serif;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.495396"
+       x="5.4054561"
+       y="159.5748"
+       id="text841"><tspan
+         sodipodi:role="line"
+         id="tspan839"
+         x="5.4054561"
+         y="159.5748"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:47.558px;font-family:Roboto;-inkscape-font-specification:'Roboto, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;stroke-width:0.495396"><tspan
+           style="fill:#c0c000;fill-opacity:1"
+           id="tspan843">Ersatz</tspan><tspan
+           style="fill:#00c0c0;fill-opacity:1"
+           id="tspan845">T</tspan><tspan
+           style="fill:#00c000;fill-opacity:1"
+           id="tspan847">V</tspan></tspan></text>
+  </g>
+</svg>