From cba8b6207cd165e7ebab2fbedc5c5d511211a888 Mon Sep 17 00:00:00 2001
From: Ada Werefox <ada.werefox@tutanota.com>
Date: Thu, 21 Mar 2024 16:14:41 -0500
Subject: [PATCH] Modified the trunic svg so that it will display properly.

---
 .../tracker/static/tracker/images/trunic.svg  | 132 +++++++++++++++++-
 .../tracker/templates/tracker/index.html      |  16 ++-
 2 files changed, 140 insertions(+), 8 deletions(-)

diff --git a/tunictracker/tracker/static/tracker/images/trunic.svg b/tunictracker/tracker/static/tracker/images/trunic.svg
index be90503..b802784 100644
--- a/tunictracker/tracker/static/tracker/images/trunic.svg
+++ b/tunictracker/tracker/static/tracker/images/trunic.svg
@@ -1 +1,131 @@
-<svg xmlns="http://www.w3.org/2000/svg"><style>line, circle{stroke-linecap: round;stroke-width: 20;}path{stroke-linecap: round;stroke-width: 10;}line, circle, path{stroke: black;fill: black;}</style><svg id="rune1" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="10" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="100" y2="353"></line><line x1="100" y1="10" x2="190" y2="70"></line><line x1="100" y1="10" x2="10" y2="70"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><line x1="10" y1="293" x2="100" y2="353"></line></svg><svg id="rune2" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="55" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="100" y1="233" x2="10" y2="293"></line><line x1="100" y1="233" x2="190" y2="293"></line><line x1="10" y1="293" x2="100" y2="353"></line><line x1="190" y1="293" x2="100" y2="353"></line></svg><svg id="rune3" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="100" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="100" y1="10" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="190" y2="293"></line></svg><svg id="rune4" viewBox="0 0 200 400" height="100" width="40" x="145" y="10"></svg><svg id="rune5" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="180" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="100" y2="353"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><line x1="190" y1="293" x2="100" y2="353"></line></svg><svg id="rune6" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="225" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="100" y1="233" x2="10" y2="293"></line><line x1="100" y1="233" x2="190" y2="293"></line><line x1="100" y1="10" x2="190" y2="70"></line><line x1="100" y1="10" x2="10" y2="70"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><circle cx="100" cy="371" r="18" fill="none"></circle></svg><svg id="rune7" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="270" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="100" y1="10" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="100" y2="353"></line><line x1="100" y1="233" x2="190" y2="293"></line><line x1="10" y1="293" x2="100" y2="353"></line><line x1="190" y1="293" x2="100" y2="353"></line></svg><svg id="rune8" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="315" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="10" y2="293"></line><line x1="100" y1="233" x2="100" y2="353"></line><line x1="100" y1="233" x2="190" y2="293"></line><line x1="100" y1="10" x2="190" y2="70"></line><line x1="100" y1="10" x2="10" y2="70"></line></svg><svg id="rune9" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="360" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="100" y1="233" x2="10" y2="293"></line><line x1="100" y1="233" x2="190" y2="293"></line></svg><svg id="rune10" viewBox="0 0 200 400" height="100" width="40" x="405" y="10"></svg><svg id="rune11" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="440" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="100" y2="353"></line><line x1="100" y1="10" x2="190" y2="70"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><line x1="10" y1="293" x2="100" y2="353"></line><line x1="190" y1="293" x2="100" y2="353"></line></svg><svg id="rune12" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="485" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="100" y1="10" x2="100" y2="130"></line><line x1="190" y1="70" x2="100" y2="130"></line><line x1="100" y1="130" x2="100" y2="166"></line><line x1="100" y1="233" x2="190" y2="293"></line><line x1="100" y1="10" x2="190" y2="70"></line><line x1="100" y1="10" x2="10" y2="70"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><circle cx="100" cy="371" r="18" fill="none"></circle></svg><svg id="rune13" viewBox="0 0 200 400" height="100" width="50" xmlns="http://www.w3.org/2000/svg" x="530" y="10"><style></style><line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line><line x1="10" y1="70" x2="10" y2="166"></line><line x1="10" y1="233" x2="10" y2="293"></line><line x1="190" y1="293" x2="100" y2="353"></line></svg></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg">
+    <style>line, circle{stroke-linecap: round;stroke-width: 20;}path{stroke-linecap:
+        round;stroke-width: 10;}line, circle, path{stroke: black;fill: black;}</style>
+    <svg id="rune1" viewBox="920 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="100" y2="353"></line>
+        <line x1="100" y1="10" x2="190" y2="70"></line>
+        <line x1="100" y1="10" x2="10" y2="70"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <line x1="10" y1="293" x2="100" y2="353"></line>
+    </svg>
+    <svg id="rune2" viewBox="740 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="233" x2="10" y2="293"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+        <line x1="10" y1="293" x2="100" y2="353"></line>
+        <line x1="190" y1="293" x2="100" y2="353"></line>
+    </svg>
+    <svg id="rune3" viewBox="560 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="100" y1="10" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+    </svg>
+    <svg id="rune5" viewBox="280 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="100" y2="353"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <line x1="190" y1="293" x2="100" y2="353"></line>
+    </svg>
+    <svg id="rune6" viewBox="100 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="233" x2="10" y2="293"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+        <line x1="100" y1="10" x2="190" y2="70"></line>
+        <line x1="100" y1="10" x2="10" y2="70"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <circle cx="100" cy="350" r="18" fill="none"></circle>
+    </svg>
+    <svg id="rune7" viewBox="-80 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="10" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="100" y2="353"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+        <line x1="10" y1="293" x2="100" y2="353"></line>
+        <line x1="190" y1="293" x2="100" y2="353"></line>
+    </svg>
+    <svg id="rune8" viewBox="-260 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="10" y2="293"></line>
+        <line x1="100" y1="233" x2="100" y2="353"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+        <line x1="100" y1="10" x2="190" y2="70"></line>
+        <line x1="100" y1="10" x2="10" y2="70"></line>
+    </svg>
+    <svg id="rune9" viewBox="-440 0 200 400" xmlns="http://www.w3.org/2000/svg"
+        x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="233" x2="10" y2="293"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+    </svg>
+    <svg id="rune11" viewBox="-620 0 200 400"
+        xmlns="http://www.w3.org/2000/svg" x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="100" y2="353"></line>
+        <line x1="100" y1="10" x2="190" y2="70"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <line x1="10" y1="293" x2="100" y2="353"></line>
+        <line x1="190" y1="293" x2="100" y2="353"></line>
+    </svg>
+    <svg id="rune12" viewBox="-800 0 200 400"
+        xmlns="http://www.w3.org/2000/svg" x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="100" y1="10" x2="100" y2="130"></line>
+        <line x1="190" y1="70" x2="100" y2="130"></line>
+        <line x1="100" y1="130" x2="100" y2="166"></line>
+        <line x1="100" y1="233" x2="190" y2="293"></line>
+        <line x1="100" y1="10" x2="190" y2="70"></line>
+        <line x1="100" y1="10" x2="10" y2="70"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <circle cx="100" cy="350" r="18" fill="none"></circle>
+    </svg>
+    <svg id="rune13" viewBox="-980 0 200 400"
+        xmlns="http://www.w3.org/2000/svg" x="0" y="0">
+        <style></style>
+        <line x1="0" y1="166" x2="200" y2="166" stroke="black" stroke-linecap="butt"></line>
+        <line x1="10" y1="70" x2="10" y2="166"></line>
+        <line x1="10" y1="233" x2="10" y2="293"></line>
+        <line x1="190" y1="293" x2="100" y2="353"></line>
+    </svg>
+</svg>
\ No newline at end of file
diff --git a/tunictracker/tracker/templates/tracker/index.html b/tunictracker/tracker/templates/tracker/index.html
index 62411d3..0779bf3 100644
--- a/tunictracker/tracker/templates/tracker/index.html
+++ b/tunictracker/tracker/templates/tracker/index.html
@@ -7,18 +7,20 @@
                 <div class="space-y-2 px-2">
                     <div class="flex flex-col align-middle max-w-fit">
                         <div class="flex flex-row align-middle max-w-fit h-12 space-x-2">
-                            <span class="h-8 max-w-8 my-auto align-middle backdrop-blur">
+                            <span class="flex flex-shrink-0 object-contain w-8 h-8 my-auto align-middle backdrop-blur">
                                 <img src="{% static 'tracker/images/neofox_flag_trans_256.png' %}"
                                      alt="A trans pride fox emoji."
                                      width="32"
                                      height="32" />
                             </span>
-                            <span class="max-h-12 max-w-64 my-auto align-middle invert drop-shadow-[1px_2px_2px_rgba(0,0,0,1)] ">
-                                <img src="{% static 'tracker/images/trunic_title.png' %}"
-                                     alt="A trans pride fox emoji."
-                                     width="365"
-                                     height="64" />
-                            </span>
+                            <img class="object-scale-down flex flex-shrink overflow-x-scroll w-64 h-12 align-middle invert drop-shadow-[1px_2px_2px_rgba(0,0,0,1)]"
+                                 src="{% static 'tracker/images/trunic.svg' %}"
+                                 alt="A trans pride fox emoji."
+                                 width=""
+                                 height="" />
+                            {% comment %} <span class="max-h-12 max-w-64 my-auto align-middle invert drop-shadow-[1px_2px_2px_rgba(0,0,0,1)] ">
+                                    <img src="{% static 'tracker/images/trunic_title.png' %}" alt="A trans pride fox emoji." width="365" height="64" />
+                            </span> {% endcomment %}
                         </div>
                         <div class="mt-auto text-sm max-w-fit">(Tunic Transition Tracker)</div>
                     </div>