{% load i18n %}

<div class="tab-content h-100 w-100 p-0" id="entryTabsContent">
    <div class="col h-100 w-100 p-0 tab-pane show active" id="semantics" role="tabpanel" aria-labelledby="semantics-tab">
        <div class="row m-0 p-0" id="semantics-top-pane">
            <div class="col h-100 px-1 pt-0 pb-0 overflow-auto" id="semantics-frames-pane">
                <table class="table-button-menu" cellspacing="1">
                    <tr style="background-color: white;">
                        <td id="change-title" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Zmień nazwę
                        </td>
                        <td id="add-arg" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Dodaj argum.
                        </td>
                        <td id="add-pref" style="padding: 10px 15px 10px 15px; color: #000000;"
                            onclick="addSelectivePreference()">
                            Dodaj prefer.
                        </td>
                        <td id="merge" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Scal
                        </td>
                        <td id="ready" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Gotowe
                        </td>
                    </tr>
                    <tr style="background-color: white;">
                        <td id="change-role" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Zmień rolę
                        </td>
                        <td id="remove-arg" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Usuń argum.
                        </td>
                        <td id="change-windows" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Zamień okna
                        </td>
                        <td id="duplicates" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Duplikuj
                        </td>
                        <td id="save-changes" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Zapisz
                        </td>
                    </tr>
                </table>
                <br>
                <div id="unified-frame"></div>
                <div id="unified-frame-lexical-units"></div>
                <br>
                <table class="table-button-menu" cellspacing="1">
                    <tr style="background-color: white;">
                        <td id="wrong-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Błędna
                        </td>
                        <td id="extract-frame" style="padding: 10px 15px 10px 15px; color: #000000;"
                            onclick="extract_frames_to_new_frame(1, [104274,104238], null)">
                            Rozdziel
                        </td>
                        <td id="hide-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Ukryj
                        </td>
                        <td id="ready-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Gotowe
                        </td>
                        <td id="filter-slowal-frames" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Filtruj
                        </td>
                    </tr>
                    <tr style="background-color: white;">
                        <td id="inccorect-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Niepasująca
                        </td>
                        <td id="move-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;"
                            onclick="extract_frames_to_new_frame(3, [104274], 1)">
                            Przerzuć
                        </td>
                        <td id="show-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Pokaż
                        </td>
                        <td id="reollback-slowal-frame" style="padding: 10px 15px 10px 15px; color: #000000;">
                            Przywróć
                        </td>
                        <td id="empty" style="padding: 10px 15px 10px 15px; color: #000000;">

                        </td>
                    </tr>
                </table>
                <br>
                <div id="semantics-frames"></div>
            </div>
            <div class="col h-100 px-1 pt-0 pb-0 overflow-auto" id="semantics-schemata-pane">
                <ul class="nav nav-pills nav-justified p-1" id="entryTabs" role="tablist">
                    <li class="nav-item mr-1">
                        <a class="btn btn-sm btn-outline-dark nav-link active" id="unified-frame-semantics-tab" data-toggle="tab" href="#semantics" role="tab" aria-controls="semantics" aria-selected="true">
                            {% trans "Schematy" %}
                        </a>
                    </li>
                    <li class="nav-item mr-1">
                        <a class="btn btn-sm btn-outline-dark nav-link" id="unified-frame-view2-tab" data-toggle="tab" href="#syntax" role="tab" aria-controls="syntax" aria-selected="false">
                            {% trans "Podgląd ram" %}
                        </a>
                    </li>
                    <li class="nav-item mr-0">
                        <a class="btn btn-sm btn-outline-dark nav-link" id="unified-frame-notes-tab" data-toggle="tab" href="#examples" role="tab" aria-controls="examples" aria-selected="false">
                            {% trans "Notatki" %}
                        </a>
                    </li>
                </ul>
                <div id="semantics-schemata"></div>
            </div>
        </div>
        <div class="row m-0 p-0 overflow-auto" id="semantics-examples-pane">
            <table id="semantics-examples" class="table table-sm table-hover">
                <thead>
                <tr>
                    <th scope="col">{% trans "Przykład" %}<i id="examples-argument"></i><i id="examples-lu"></i><i id="examples-schema"></i></th>
                    <th scope="col">{% trans "Źródło" %}</th>
                    <th scope="col">{% trans "Opinia" %}</th>
                </tr>
                </thead>
                <tbody id="semantics-examples-list">
                </tbody>
            </table>
            <p class="mx-1 my-1"id="semantics-no-examples">{% trans "Brak przykładów" %}</p>
        </div>
    </div>

</div>