From ac75c3ad3d0a1041edca59c3e5a0b977e235d299 Mon Sep 17 00:00:00 2001
From: Corban-Lee Jones <corbz.jones@gmail.com>
Date: Sat, 27 Jul 2024 23:29:32 +0100
Subject: [PATCH] tabindex for advanced sub settings

---
 apps/static/js/home/index.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/static/js/home/index.js b/apps/static/js/home/index.js
index 28d4924..1460901 100644
--- a/apps/static/js/home/index.js
+++ b/apps/static/js/home/index.js
@@ -85,18 +85,19 @@ $(document).ready(function() {
         let id = $(this).attr("data-id")
             label = $(this).attr("data-label");
             helpText = $(this).attr("data-helptext");
+            tabIndex = parseInt($(this).attr("data-tabindex"));
             defaultColour = $(this).attr("data-defaultcolour");
             defaultColour = defaultColour ? defaultColour : "#3498db"
 
         $(this).replaceWith(`
             <label for="${id}Picker" class="form-label">${label}</label>
             <div id="${id}" class="input-group">
-                <input type="color" name="${id}Picker" id="${id}Picker" class="form-control-color input-group-text colour-picker">
-                <input type="text" name="${id}Text" id="${id}Text" class="form-control colour-text">
-                <button type="button" class="btn btn-secondary colour-reset" data-bs-toggle="tooltip" data-bs-title="Reset Colour" data-defaultcolour="${defaultColour}">
+                <input type="color" name="${id}Picker" id="${id}Picker" class="form-control-color input-group-text colour-picker" tabindex="${tabIndex}">
+                <input type="text" name="${id}Text" id="${id}Text" class="form-control colour-text" tabindex="${tabIndex + 1}">
+                <button type="button" class="btn btn-secondary colour-reset" data-bs-toggle="tooltip" data-bs-title="Reset Colour" data-defaultcolour="${defaultColour}" tabindex="${tabIndex + 2}">
                     <i class="bi bi-arrow-clockwise"></i>
                 </button>
-                <button type="button" class="btn btn-secondary colour-random" data-bs-toggle="tooltip" data-bs-title="Random Colour">
+                <button type="button" class="btn btn-secondary colour-random" data-bs-toggle="tooltip" data-bs-title="Random Colour" tabindex="${tabIndex + 3}">
                     <i class="bi bi-dice-5"></i>
                 </button>
             </div>