mirror of
				https://github.com/SillyTavern/SillyTavern.git
				synced 2025-06-05 21:59:27 +02:00 
			
		
		
		
	Resize FA icon in QR editor, add label caption
This commit is contained in:
		| @@ -4,17 +4,19 @@ | |||||||
| 		<div class="qr--labels"> | 		<div class="qr--labels"> | ||||||
| 			<label class="qr--fit"> | 			<label class="qr--fit"> | ||||||
| 				<span class="qr--labelText" data-i18n="Label">Icon</span> | 				<span class="qr--labelText" data-i18n="Label">Icon</span> | ||||||
| 				<div class="menu_button" id="qr--modal-icon" title="Click to change icon"></div> | 				<small class="qr--labelHint"> </small> | ||||||
|  | 				<div class="menu_button fa-fw" id="qr--modal-icon" title="Click to change icon"></div> | ||||||
| 			</label> | 			</label> | ||||||
| 			<div class="label"> | 			<div class="label"> | ||||||
| 				<span class="qr--labelText" data-i18n="Label">Label</span> | 				<span class="qr--labelText" data-i18n="Label">Label</span> | ||||||
|  | 				<small class="qr--labelHint" data-i18n="(label of the button, if no icon is chosen) ">(label of the button, if no icon is chosen)</small> | ||||||
| 				<div class="qr--inputGroup"> | 				<div class="qr--inputGroup"> | ||||||
| 					<label class="checkbox_label" title="Show label even if an icon is assigned"> | 					<label class="checkbox_label" title="Show label even if an icon is assigned"> | ||||||
| 						<input type="checkbox" id="qr--modal-showLabel"> | 						<input type="checkbox" id="qr--modal-showLabel"> | ||||||
| 						Show | 						Show | ||||||
| 					</label> | 					</label> | ||||||
| 					<input type="text" class="text_pole" id="qr--modal-label"> | 					<input type="text" class="text_pole" id="qr--modal-label"> | ||||||
| 					<div class="menu_button fa-solid fa-chevron-down" id="qr--modal-switcher" title="Switch to another QR"></div> | 					<div class="menu_button fa-fw fa-solid fa-chevron-down" id="qr--modal-switcher" title="Switch to another QR"></div> | ||||||
| 				</div> | 				</div> | ||||||
| 			</div> | 			</div> | ||||||
| 			<label> | 			<label> | ||||||
|   | |||||||
| @@ -455,6 +455,7 @@ | |||||||
|   display: flex; |   display: flex; | ||||||
|   flex-direction: row; |   flex-direction: row; | ||||||
|   gap: 0.5em; |   gap: 0.5em; | ||||||
|  |   padding: 1px; | ||||||
| } | } | ||||||
| .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor > #qr--main > .qr--labels > label, | .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor > #qr--main > .qr--labels > label, | ||||||
| .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor > #qr--main > .qr--labels > .label { | .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor > #qr--main > .qr--labels > .label { | ||||||
| @@ -650,6 +651,10 @@ | |||||||
|   border-radius: 5px; |   border-radius: 5px; | ||||||
|   position: relative; |   position: relative; | ||||||
| } | } | ||||||
|  | .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-icon { | ||||||
|  |   height: 100%; | ||||||
|  |   aspect-ratio: 1 / 1; | ||||||
|  | } | ||||||
| .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-executeButtons { | .popup:has(#qr--modalEditor) .popup-content > #qr--modalEditor #qr--modal-executeButtons { | ||||||
|   display: flex; |   display: flex; | ||||||
|   gap: 1em; |   gap: 1em; | ||||||
|   | |||||||
| @@ -527,6 +527,7 @@ | |||||||
| 					display: flex; | 					display: flex; | ||||||
| 					flex-direction: row; | 					flex-direction: row; | ||||||
| 					gap: 0.5em; | 					gap: 0.5em; | ||||||
|  | 					padding: 1px; | ||||||
| 					> label, > .label { | 					> label, > .label { | ||||||
| 						flex: 1 1 1px; | 						flex: 1 1 1px; | ||||||
| 						display: flex; | 						display: flex; | ||||||
| @@ -695,6 +696,10 @@ | |||||||
| 					} | 					} | ||||||
| 				} | 				} | ||||||
| 			} | 			} | ||||||
|  |             #qr--modal-icon { | ||||||
|  |                 height: 100%; | ||||||
|  |                 aspect-ratio: 1 / 1; | ||||||
|  |             } | ||||||
|             #qr--modal-executeButtons { |             #qr--modal-executeButtons { | ||||||
|                 display: flex; |                 display: flex; | ||||||
|                 gap: 1em; |                 gap: 1em; | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user