1
<div id="qr--settings">
2
	<div class="inline-drawer">
3
		<div class="inline-drawer-toggle inline-drawer-header">
4
			<strong data-i18n="Quick Reply">Quick Reply</strong>
5
			<div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
6
		</div>
7
		<div class="inline-drawer-content">
8
			<label class="flex-container">
9
				<input type="checkbox" id="qr--isEnabled"><span data-i18n="Enable Quick Replies">Enable Quick Replies</span>
10
			</label>
11
			<label class="flex-container">
12
				<input type="checkbox" id="qr--isCombined"><span data-i18n="Combine Quick Replies">Combine Quick Replies</span>
13
			</label>
14
            <label class="flex-container">
15
                <input type="checkbox" id="qr--showPopoutButton"><span data-i18n="Show Popout Button">Show Popout Button (on Desktop)</span>
16
            </label>
17

18
			<hr>
19

20
			<div id="qr--global">
21
				<div class="qr--head">
22
					<div class="qr--title" data-i18n="Global Quick Reply Sets">Global Quick Reply Sets</div>
23
					<div class="qr--actions">
24
						<div class="qr--setListAdd menu_button menu_button_icon fa-solid fa-plus" id="qr--global-setListAdd" title="Add quick reply set"></div>
25
					</div>
26
				</div>
27
				<div id="qr--global-setList" class="qr--setList"></div>
28
			</div>
29

30
			<hr>
31

32
			<div id="qr--chat">
33
				<div class="qr--head">
34
					<div class="qr--title" data-i18n="Chat Quick Reply Sets">Chat Quick Reply Sets</div>
35
					<div class="qr--actions">
36
						<div class="qr--setListAdd menu_button menu_button_icon fa-solid fa-plus" id="qr--chat-setListAdd" title="Add quick reply set"></div>
37
					</div>
38
				</div>
39
				<div id="qr--chat-setList" class="qr--setList"></div>
40
			</div>
41

42
			<hr>
43

44
			<div id="qr--character">
45
				<div class="qr--head">
46
					<div class="qr--title" data-i18n="Character Quick Reply Sets">Character Quick Reply Sets</div>
47
					<small data-i18n="(Private)">(Private)</small>
48
					<div class="qr--actions">
49
						<div class="qr--setListAdd menu_button menu_button_icon fa-solid fa-plus" id="qr--character-setListAdd" title="Add quick reply set"></div>
50
					</div>
51
				</div>
52
				<div id="qr--character-setList" class="qr--setList"></div>
53
			</div>
54

55
			<hr>
56

57
			<div id="qr--editor">
58
				<div class="qr--head">
59
					<div class="qr--title" data-i18n="Edit Quick Replies">Edit Quick Replies</div>
60
					<div class="qr--actions">
61
						<select id="qr--set" class="text_pole"></select>
62
						<div class="qr--add menu_button menu_button_icon fa-solid fa-pencil" id="qr--set-rename" title="Rename quick reply set"></div>
63
						<div class="qr--add menu_button menu_button_icon fa-solid fa-plus" id="qr--set-new" title="Create new quick reply set"></div>
64
						<div class="qr--add menu_button menu_button_icon fa-solid fa-file-import" id="qr--set-import" title="Import quick reply set"></div>
65
						<input type="file" id="qr--set-importFile" accept=".json" hidden>
66
						<div class="qr--add menu_button menu_button_icon fa-solid fa-file-export" id="qr--set-export" title="Export quick reply set"></div>
67
                        <div class="qr-add menu_button menu_button_icon fa-solid fa-paste" id="qr--set-duplicate" title="Duplicate quick reply set"></div>
68
						<div class="qr--del menu_button menu_button_icon fa-solid fa-trash redWarningBG" id="qr--set-delete" title="Delete quick reply set"></div>
69
					</div>
70
				</div>
71
				<div id="qr--set-settings">
72
					<label class="flex-container">
73
						<input type="checkbox" id="qr--disableSend"> <span data-i18n="Disable Send (Insert Into Input Field)">Disable send (insert into input field)</span>
74
					</label>
75
					<label class="flex-container">
76
						<input type="checkbox" id="qr--placeBeforeInput"> <span data-i18n="Place Quick Reply Before Input">Place quick reply before input</span>
77
					</label>
78
					<label class="flex-container" id="qr--injectInputContainer">
79
						<input type="checkbox" id="qr--injectInput"> <span><span data-i18n="Inject user input automatically">Inject user input automatically</span> <small><span data-i18n="(if disabled, use ">(if disabled, use</span><code>{{input}}</code> <span data-i18n="macro for manual injection)">macro for manual injection)</span></small></span>
80
					</label>
81
					<div class="flex-container alignItemsCenter">
82
						<toolcool-color-picker id="qr--color"></toolcool-color-picker>
83
						<div class="menu_button" id="qr--colorClear">Clear</div>
84
						<span data-i18n="Color">Color</span>
85
					</div>
86
					<label class="flex-container" id="qr--onlyBorderColorContainer">
87
						<input type="checkbox" id="qr--onlyBorderColor"> <span data-i18n="Only apply color as accent">Only apply color as accent</span>
88
					</label>
89
				</div>
90
				<div id="qr--set-qrList" class="qr--qrList"></div>
91
				<div class="qr--set-qrListActions">
92
					<div class="qr--add menu_button menu_button_icon fa-solid fa-plus" id="qr--set-add" title="Add quick reply"></div>
93
					<div class="qr--paste menu_button menu_button_icon fa-solid fa-paste" id="qr--set-paste" title="Paste quick reply from clipboard"></div>
94
					<div class="qr--import menu_button menu_button_icon fa-solid fa-file-import" id="qr--set-importQr" title="Import quick reply from file"></div>
95
				</div>
96
			</div>
97
		</div>
98
	</div>
99
</div>