From cf60518a28e6c1eb38302cc72e1dbc56795b1e66 Mon Sep 17 00:00:00 2001
From: reschan <reschan>
Date: Mon, 18 Oct 2021 10:06:33 +0700
Subject: [PATCH] style: almost correct scaling of text and elements

---
 sq2.css  |  5 +++--
 sq2.html | 10 +++++-----
 sq2.js   |  4 ++--
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/sq2.css b/sq2.css
index cc1de78..53a8813 100644
--- a/sq2.css
+++ b/sq2.css
@@ -198,7 +198,7 @@ td.damage-size {
 }
 
 .skp-tooltip {
-    font-size: 11px;
+    font-size: 0.7rem;
 }
 
 .draggable {
@@ -266,7 +266,8 @@ p.Damage {
     flex-direction: column; 
     vertical-align: top; 
     background-color: rgb(30, 30, 30); 
-    width: 20.5em; 
+    width: 20.5rem; 
+    height: 29.65rem;
 }
 
 .nDam {
diff --git a/sq2.html b/sq2.html
index 52a90ab..896cfae 100644
--- a/sq2.html
+++ b/sq2.html
@@ -314,7 +314,7 @@
     <div id="right" class="column">
         <div class="bottom">
             <div class="all-equipment" id="column1">
-                <div class="weapon-container" style="width: 46em;">
+                <div class="weapon-container" style="width: 46rem;">
                     <table style="width: 46em; border-collapse: collapse;" class="full-border">
                         <tr>
                             <td id="weapon-img-loc" style="border: none;">
@@ -354,7 +354,7 @@
                     </table>
                 </div>
                 <div style="display: inline-flex; flex-direction: row;" >
-                    <div class="equipment-container" style="width: 23em;">
+                    <div class="equipment-container" style="width: 23rem;">
                         <table class="full-border" style="border-collapse: collapse;">
                             <tr>
                                 <td id="helmet-img-loc" style="border: none; width: 0.1%;">
@@ -456,7 +456,7 @@
                             </tr>
                         </table>
                     </div>
-                    <div class="equipment-container" style="width: 23em;">
+                    <div class="equipment-container" style="width: 23rem;">
                         <table class="full-border" style="border-collapse: collapse;">
                             <tr>
                                 <td id="ring1-img-loc" style="border: none; width: 0.1%;">
@@ -560,7 +560,7 @@
                     </div>
                 </div>
                 <div class="skp-container">
-                    <table style="width: 46em; height: 11.15em;" class="full-border">
+                    <table style="width: 46rem; height: 11.15em;" class="full-border">
                         <tr>
                             <td class="skp-text" style="text-align: center;">
                                 <p class="eDam" style="font-weight: bold;">✤Strength</p>
@@ -648,7 +648,7 @@
                 <div style="display: none; overflow: auto;" id="minimal-defensive-stats" class="minimal-stats-container"></div>
                 <div style="overflow: auto;" id="minimal-stats" class="minimal-stats-container"></div>
             </div>
-            <div id="column3" style="display: inline-flex; vertical-align: top; background-color: rgb(30, 30, 30); width: 20.5em;">
+            <div id="column3" style="display: inline-flex; vertical-align: top; background-color: rgb(30, 30, 30); width: 20.5em; height: 29.65rem;">
                 <table style="width: 100%;">
                     <tr style="height: 6em;">
                         <td class="full-border" style="text-align: center; vertical-align: middle;">
diff --git a/sq2.js b/sq2.js
index 6e2a59f..d124d41 100644
--- a/sq2.js
+++ b/sq2.js
@@ -2,8 +2,8 @@ let equipment_keys = ['weapon', 'helmet', 'chestplate', 'leggings', 'boots', 'ri
 
 $(document).ready(function(){
     // inits
-    $("#column2").height($("#column1").height());
-    $("#column3").height($("#column1").height());
+    // $("#column2").height($("#column1").height());
+    // $("#column3").height($("#column1").height());
 
     $("#overall-window").toggle();
     $("#search-container").toggle();