diff options
| author | toasted-nutbread <toasted-nutbread@users.noreply.github.com> | 2022-06-03 18:19:40 -0400 | 
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-06-03 18:19:40 -0400 | 
| commit | 6cc57d953df7f6201b45cbbb1a8e80dda4d1fa8a (patch) | |
| tree | 8f744d3b7b17fe36fe9d18ebbb2ce5b8d9af4029 | |
| parent | c966d9b1ebb12386ac876d93f377fe3a470c6976 (diff) | |
Settings modal updates (#2173)
* Move the "Add" button into the footer
* Scroll to the bottom when adding
* Move the Audio Sources add button
* Simplify, remove the (?) link
* Move "Add" button to footer
| -rw-r--r-- | ext/js/pages/settings/scan-inputs-controller.js | 6 | ||||
| -rw-r--r-- | ext/settings.html | 25 | 
2 files changed, 12 insertions, 19 deletions
| diff --git a/ext/js/pages/settings/scan-inputs-controller.js b/ext/js/pages/settings/scan-inputs-controller.js index 855ccf9a..f6851eb2 100644 --- a/ext/js/pages/settings/scan-inputs-controller.js +++ b/ext/js/pages/settings/scan-inputs-controller.js @@ -116,6 +116,12 @@ class ScanInputsController {              deleteCount: 0,              items: [scanningInput]          }]); + +        // Scroll to bottom +        const button = e.currentTarget; +        const modalContainer = button.closest('.modal'); +        const scrollContainer = modalContainer.querySelector('.modal-body'); +        scrollContainer.scrollTop = scrollContainer.scrollHeight;      }      _addOption(index, scanningInput) { diff --git a/ext/settings.html b/ext/settings.html index ec9dd34b..a3cc40f5 100644 --- a/ext/settings.html +++ b/ext/settings.html @@ -2706,23 +2706,11 @@              <div class="settings-item-inner">                  <div class="settings-item-left">                      <div class="settings-item-label"> -                        Audio sources -                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a> +                        When searching for audio, the sources are checked in order until the first +                        valid source is found. This allows for selecting a fallback source if the +                        first choice is not available.                      </div>                  </div> -                <div class="settings-item-right"> -                    <button id="audio-source-add" class="low-emphasis">Add</button> -                </div> -            </div> -            <div class="settings-item-children more" hidden> -                <p> -                    When searching for audio, the sources are checked in order until the first -                    valid source is found. This allows for selecting a fallback source if the -                    first choice is not available. -                </p> -                <p> -                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less…</a> -                </p>              </div>              <div class="settings-item-children">                  <div id="audio-source-list" class="generic-list"></div> @@ -2733,6 +2721,7 @@          </div>      </div>      <div class="modal-footer"> +        <button id="audio-source-add" class="low-emphasis">Add</button>          <button data-modal-action="hide">Close</button>      </div>  </div></div> @@ -2876,9 +2865,9 @@              No scanning inputs have been defined yet.              Click the <em>Add</em> button to add a new input.          </div> -        <div class="flex-row-nowrap right"><button class="low-emphasis" id="scan-input-add">Add</button></div>      </div>      <div class="modal-footer"> +        <button class="low-emphasis" id="scan-input-add">Add</button>          <button data-modal-action="hide">Close</button>      </div>  </div></div> @@ -3435,9 +3424,6 @@                  <div class="settings-item-left">                      <div class="settings-item-label">Text replacement patterns</div>                  </div> -                <div class="settings-item-right"> -                    <button id="translation-text-replacement-add" class="low-emphasis">Add</button> -                </div>              </div>              <div class="settings-item-children">                  <div id="translation-text-replacement-list" class="generic-list"></div> @@ -3446,6 +3432,7 @@          </div>      </div>      <div class="modal-footer"> +        <button id="translation-text-replacement-add" class="low-emphasis">Add</button>          <button data-modal-action="hide">Close</button>      </div>  </div></div> |