<div id="options-dialog" class="modal fade mx-auto" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg modal-dialog-scrollable" style="min-width: 1000px;" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Options</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div>
                    <ul class="nav nav-tabs">
                        <li class="nav-item">
                            <a class="nav-link active" data-toggle="tab" href="#options-appearance">Appearance</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-shortcuts">Shortcuts</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-code-notes">Code notes</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-password">Password</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-etapi">ETAPI</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-backup">Backup</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-sync-setup">Sync</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-other">Other</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-toggle="tab" href="#options-advanced">Advanced</a>
                        </li>
                    </ul>
                    <br/>
                    <div class="tab-content">
                        <div id="options-appearance" class="tab-pane active"></div>
                        <div id="options-shortcuts" class="tab-pane"></div>
                        <div id="options-code-notes" class="tab-pane"></div>
                        <div id="options-password" class="tab-pane"></div>
                        <div id="options-etapi" class="tab-pane"></div>
                        <div id="options-backup" class="tab-pane"></div>
                        <div id="options-sync-setup" class="tab-pane"></div>
                        <div id="options-other" class="tab-pane"></div>
                        <div id="options-advanced" class="tab-pane"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
