index.html

<!-- <script src="./tpc.js"></script>
<script src="./vanilla.js"></script> -->
<script src="./script.js" defer></script>
<script src="./xmlToJson.js" defer></script>
<style>
    body {
        width: 70vw;
        margin: auto;
        overflow-y: scroll;
    }
    
    mark {
        background-color: #ccc;
        box-shadow: 0px 0px 0px 1px #ccc;
    }
    
    td {
        border: 1px solid;
        padding: 10px;
    }
    
    table,
    table * {
        margin: auto;
        width: inherit;
    }
    
    #van_0,
    #tpc_0 {
        background-color: #cfcfcf;
    }
    
    #title {
        
        position: fixed;
        left: 0;
        padding: 10px;
        width:100vw;

        background-color: rgba(226, 211, 192, 0.9);
    }

    
    #binContainer {
        
        position: fixed;
        right: 0;
        margin: 10px;
        margin-top: auto;
        text-align: end;
    }
    
    #allcmd, #allBin, #b4bin{
        height: 30px;
        margin-bottom: 5px;

    }

    #allBin{
        width:60vw;
    }
    
    td[id^='van_'],
    td[id*=' van_'] {
        width: 50vw;
    }
    
    td[id^='tpc_'],
    td[id*=' tpc_'] {
        width: max-content;
    }
</style>

<div id="title"> <select id="allcmd" autofocus></select>  <span id="binContainer"> <input type="text" id="b4Bin" placeholder="Input"></input><input placeholder="Parameter Output" type="text" id="allBin"><br><a href="javascript:showBin(document.getElementById('b4Bin').value)">Parameter Output</a></input></span>
<br><a href="javascript:jumpToInfo()">Command Info</a> &nbsp; &nbsp;   <a target="_blank" href="https://github.com/jetrotal/CSA/blob/main/RPG_RT.edb">RPG_RT.edb File</a>
</div>
<br><br><br><br><br>
<table>

    <tbody id="content">
        <tr>
            <td id="old">
                </th>
                <td>
                    </th>
        </tr>
        <tr>
            <td id="new"></td>
            <td></td>
        </tr>
    </tbody>
</table>