fixed it all... hopefully

create.php

@@ -144,7 +144,6 @@
           </button>
       </div>
     </div>
-
     <!-- Cardpreview -->
     <div class="col s6">
       <div class="blurry">
@@ -180,7 +179,6 @@
               <div class="collapsible-body">
                 <pre >Normal Role Convars (also found in ULX):
                 <code id="cvars"></code>
-
                 Rolespecific Convars:
                 <code id="rcvars"></code></pre>
               </div>
@@ -212,40 +210,31 @@
         </div>
       </div>
     </div>
-
     <!-- Updatescript -->
     <script>
     function updateName() {
       document.getElementById("cardname").innerHTML = $('#name').val();
     }
-
     function updateHowToPlay() {
       document.getElementById("thowtoplay").innerHTML = $('#howtoplay').val();
     }
-
     function createMenuItem(name) {
            let li = document.createElement('li');
            li.textContent = name;
            return li;
        }
-
        function updateGoodRoles() {
        goodRoles = $('#goodRoles').val();
        goodRoles.forEach(element => document.getElementById("tplaysbestwith").appendChild(createMenuItem(element)); )
      );
        }
-
     function updateDescription() {
       document.getElementById("carddescription").innerHTML = $('#description').val();
     }
-
     function updateColor() {
       document.getElementById("rolecard").className = "card " + $('#rolecolor').val() +" "+ $('#modifier').val() +"-"+ $('#strength').val() + " " + $('#tcolor').val();
     }
-
     </script>
-
-
     <!-- Start Tab init -->
     <script>
       $(document).ready(function() {