Fixed custom hotkey size

custom_configs/custom0.json

@@ -6,12 +6,12 @@
     ],
     "custom-key-0-2": [
         "https://www.google.com",
-        "30",
-        "0"
+        "55",
+        "1"
     ],
     "custom-key-0-3": [
         "Yo",
-        "20",
+        "14",
         "30"
     ],
     "custom-key-0-4": [
@@ -20,8 +20,13 @@
         "30"
     ],
     "custom-key-0-5": [
-        "https://www.google.com",
-        "20",
-        "0"
+        "http://espn.com",
+        "54",
+        "30"
+    ],
+    "custom-key-0-6": [
+        "Wow",
+        "0",
+        "30"
     ]
 }
\ No newline at end of file

public/js/client.js

@@ -177,7 +177,7 @@ $('.icon-selection').click(function() {
 //-----LOADING KEYBOARDS-----//
 
 function hotkeyStylize(ele, page, id, url){
-  ele.css({'text-indent': '-9999px'});
+  ele.css({'max-width': '20%', 'min-width': '20%', 'text-indent': '-9999px'});
   ele.append('<button class="url-icon" id="url-icon-' + id +'"> </button>')
   var urlIcon = $('#url-icon-' + id)
   try { 
@@ -191,7 +191,7 @@ function hotkeyStylize(ele, page, id, url){
 
 function hotkeyDestylize(ele, page, id, url){
   $('#url-icon-' + id).remove();
-  ele.css({width: 'auto', 'text-indent': '0px'});
+  ele.css({'max-width': '100%', 'min-width': '1%', width: 'auto', 'text-indent': '0px'});
 }
 
 function addHotkey(xpos, ypos, url, page, id){
@@ -357,6 +357,9 @@ interact('.custom-key').on('hold', function (event) {
     if (move == true){
       editModal.style.display = "block"; //Allows the modal to be displayed to User
       updateKey = event.target
+      if(event.target.id.indexOf("url-icon") != -1){
+        updateKey = updateKey.parentNode; 
+      }
       inputModal.value = updateKey.innerText
     }
 });