1
<div class="translation_settings">
2
    <div class="inline-drawer">
3
        <div class="inline-drawer-toggle inline-drawer-header">
4
            <b data-i18n="ext_translate_title">Chat Translation</b>
5
            <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
6
        </div>
7
        <div class="inline-drawer-content">
8
            <label for="translation_auto_mode" class="checkbox_label" data-i18n="ext_translate_auto_mode">Auto-mode</label>
9
            <select id="translation_auto_mode">
10
                <option data-i18n="ext_translate_mode_none" value="none">None</option>
11
                <option data-i18n="ext_translate_mode_responses" value="responses">Translate responses</option>
12
                <option data-i18n="ext_translate_mode_inputs" value="inputs">Translate inputs</option>
13
                <option data-i18n="ext_translate_mode_both" value="both">Translate both</option>
14
            </select>
15
            <label data-i18n="ext_translate_mode_provider" for="translation_provider">Provider</label>
16
            <div class="flex-container gap5px flexnowrap marginBot5">
17
                <select id="translation_provider" name="provider" class="margin0 text_pole flex2">
18
                    <option value="libre">LibreTranslate</option>
19
                    <option value="google">Google</option>
20
                    <option value="lingva">Lingva</option>
21
                    <option value="deepl">DeepL API</option>
22
                    <option value="deeplx">DeepLX</option>
23
                    <option value="bing">Bing</option>
24
                    <option value="oneringtranslator">OneRingTranslator</option>
25
                    <option value="yandex">Yandex</option>
26
                </select>
27
                <select id="deepl_api_endpoint" class="margin0 text_pole flex1" title="DeepL API Endpoint">
28
                    <option value="free">Free</option>
29
                    <option value="pro">Pro</option>
30
                </select>
31
                <div id="translate_key_button" class="menu_button menu_button_icon margin0 manage-api-keys">
32
                    <i class="fa-solid fa-key"></i>
33
                    <span>Key</span>
34
                </div>
35
                <div id="translate_url_button" class="menu_button menu_button_icon margin0 manage-api-keys">
36
                    <i class="fa-solid fa-link"></i>
37
                    <span>URL</span>
38
                </div>
39
            </div>
40
            <label data-i18n="ext_translate_target_lang" for="translation_target_language">Target Language</label>
41
            <select id="translation_target_language" name="target_language"></select>
42
            <div id="translation_clear" class="menu_button">
43
                <i class="fa-solid fa-trash-can"></i>
44
                <span data-i18n="ext_translate_clear">Clear Translations</span>
45
            </div>
46
        </div>
47
    </div>
48
</div>