From 4e9eff9b31b909e8c7647157099c04d623e22db3 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 09:11:38 -0700
Subject: [PATCH 1/7] Update generator.js

---
 scripts/generator.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/generator.js b/scripts/generator.js
index 7f8a48c..0c4840a 100644
--- a/scripts/generator.js
+++ b/scripts/generator.js
@@ -210,7 +210,7 @@ Generator.generateHorizontalBorder = function (borderId, title) {
     // Handle title first in order to subtract text width from full width
     if (title) {
         // Yes, 1.36 is a magic number found by guess-and-check
-        var text = '<text font-size="' + (options.height * 1.36) + '">' + title + '</text>';
+        var text = '<text font-size="' + (options.height * 1.36) + ' font-family="trek"' + '">' + title + '</text>';
         var textWidth = svgElementWidth(text);
         
         text = '<text x="' + (options.width - textWidth + x) + '" y="' + 

From 6ee26558141d22c35d4a558f046ec4e335f2ce2a Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 09:17:46 -0700
Subject: [PATCH 2/7] fix utils.js to accomodate the font fix

---
 scripts/util/utils.js | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/scripts/util/utils.js b/scripts/util/utils.js
index a28a268..a277556 100644
--- a/scripts/util/utils.js
+++ b/scripts/util/utils.js
@@ -72,7 +72,12 @@ var svgElementWidth = function (html) {
     var width = $elem.find('text')[0].getBBox().width;
     $elem.remove();
     
-    // A magic number fix for an inexplicable phenomena where this function returns a width 2.104x 
+    // what used to be a magic number fix for an inexplicable phenomena (now explained) where this function returns a width 2.104x 
     //   the actual width of the element
-    return width * 0.4752; 
+
+    // the reason why this was happening is because the 'font-family' tag wasn't defined in line 213 in generator.js
+    //   so it just used a default font to get the width of the element. this also caused some strange side effects
+    //   where the text area wouldn't be scaled properly depending on which characters were used, e.g. a lot of 1s would
+    //   cause it to be smaller than needed whereas a lot of Ws would cause it to be larger than needed.
+    return width // * 0.4752; 
 };

From 127bcd7350a75e92bc390b05cab95dbfb23a3f46 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 10:13:22 -0700
Subject: [PATCH 3/7] generator.js new fix

---
 scripts/generator.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/scripts/generator.js b/scripts/generator.js
index 0c4840a..0f54be0 100644
--- a/scripts/generator.js
+++ b/scripts/generator.js
@@ -201,6 +201,7 @@ Generator.generate = function () {
 Generator.generateHorizontalBorder = function (borderId, title) {
     var options = Generator.options.border[borderId];
     var padding = Generator.options.border.padding;
+    Generator.options.magic = (options.height * 1.36); // make the magic text size accessible to other files
     
     // The only two options that will change in generating the blocks
     var x = options.x, remainingWidth = options.width;
@@ -210,7 +211,7 @@ Generator.generateHorizontalBorder = function (borderId, title) {
     // Handle title first in order to subtract text width from full width
     if (title) {
         // Yes, 1.36 is a magic number found by guess-and-check
-        var text = '<text font-size="' + (options.height * 1.36) + ' font-family="trek"' + '">' + title + '</text>';
+        var text = '<text>' + title + '</text>';
         var textWidth = svgElementWidth(text);
         
         text = '<text x="' + (options.width - textWidth + x) + '" y="' + 

From 58ba2b5f0f855f19de1cde943fe92b038b8f9322 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 10:17:46 -0700
Subject: [PATCH 4/7] finish implementing new font fix

---
 scripts/util/utils.js | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/scripts/util/utils.js b/scripts/util/utils.js
index a277556..193935a 100644
--- a/scripts/util/utils.js
+++ b/scripts/util/utils.js
@@ -65,7 +65,7 @@ var rgbToHash = function (rgb) {
  * @return {Number} the width
  */
 var svgElementWidth = function (html) {
-    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1">' + html + '</svg>';
+    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="font-family:trek;font-size:'+ Generator.options.magic +';">' + html + '</svg>';
     
     var $elem = $(code).appendTo('body');
     
@@ -75,9 +75,12 @@ var svgElementWidth = function (html) {
     // what used to be a magic number fix for an inexplicable phenomena (now explained) where this function returns a width 2.104x 
     //   the actual width of the element
 
-    // the reason why this was happening is because the 'font-family' tag wasn't defined in line 213 in generator.js
+    // the reason why this was happening is because the 'font-family' tag wasn't defined,
     //   so it just used a default font to get the width of the element. this also caused some strange side effects
     //   where the text area wouldn't be scaled properly depending on which characters were used, e.g. a lot of 1s would
     //   cause it to be smaller than needed whereas a lot of Ws would cause it to be larger than needed.
+
+    // UPDATED FIX
+    // moving css to the 'code' variable because it doesn't work properly in utils.js' 'text' variable
     return width // * 0.4752; 
 };

From 464b2397cd7610c95ee150c2d358dfdca026b1e6 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 10:27:23 -0700
Subject: [PATCH 5/7] fix mistake

---
 scripts/util/utils.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/util/utils.js b/scripts/util/utils.js
index 193935a..cc0ed73 100644
--- a/scripts/util/utils.js
+++ b/scripts/util/utils.js
@@ -65,7 +65,7 @@ var rgbToHash = function (rgb) {
  * @return {Number} the width
  */
 var svgElementWidth = function (html) {
-    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="font-family:trek;font-size:'+ Generator.options.magic +';">' + html + '</svg>';
+    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="font-family:trek;font-size:'+ Generator.options.magic +'pt;">' + html + '</svg>';
     
     var $elem = $(code).appendTo('body');
     

From 5d7a952df0574707fb6adf68ea15605d4b7a98d6 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 10:28:16 -0700
Subject: [PATCH 6/7] px, not pt

---
 scripts/util/utils.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/util/utils.js b/scripts/util/utils.js
index cc0ed73..7befb03 100644
--- a/scripts/util/utils.js
+++ b/scripts/util/utils.js
@@ -65,7 +65,7 @@ var rgbToHash = function (rgb) {
  * @return {Number} the width
  */
 var svgElementWidth = function (html) {
-    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="font-family:trek;font-size:'+ Generator.options.magic +'pt;">' + html + '</svg>';
+    var code = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="font-family:trek;font-size:'+ Generator.options.magic +'px;">' + html + '</svg>';
     
     var $elem = $(code).appendTo('body');
     

From 54c4e2c55415879ba495612dc6cfbd4a2875d1b5 Mon Sep 17 00:00:00 2001
From: TheoCGaming <65421262+TheoCGaming@users.noreply.github.com>
Date: Wed, 13 Mar 2024 11:48:41 -0700
Subject: [PATCH 7/7] fix lowercase letters screwing up scaling

---
 scripts/generator.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/generator.js b/scripts/generator.js
index 0f54be0..f7ffe97 100644
--- a/scripts/generator.js
+++ b/scripts/generator.js
@@ -211,7 +211,7 @@ Generator.generateHorizontalBorder = function (borderId, title) {
     // Handle title first in order to subtract text width from full width
     if (title) {
         // Yes, 1.36 is a magic number found by guess-and-check
-        var text = '<text>' + title + '</text>';
+        var text = '<text>' + title.toUpperCase() + '</text>';
         var textWidth = svgElementWidth(text);
         
         text = '<text x="' + (options.width - textWidth + x) + '" y="' +