From 492f9bb0467a0e267e13ac50142a61cbbc41411a Mon Sep 17 00:00:00 2001
From: Aaron Gyes <var.log@icloud.com>
Date: Sat, 26 Mar 2022 13:03:27 -0700
Subject: [PATCH] web config: buttons are <buttons> instead of <span>s.

This is exactly what <button> is for, and we can remove
some CSS.
---
 share/tools/web_config/fishconfig.css              | 4 ----
 share/tools/web_config/partials/abbreviations.html | 2 +-
 share/tools/web_config/partials/colors.html        | 8 ++++----
 share/tools/web_config/partials/prompt.html        | 6 +++---
 4 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/share/tools/web_config/fishconfig.css b/share/tools/web_config/fishconfig.css
index e1afc50f7..e1f76a058 100644
--- a/share/tools/web_config/fishconfig.css
+++ b/share/tools/web_config/fishconfig.css
@@ -529,13 +529,9 @@ img.delete_icon {
 .generic_button {
     border-radius: 5px;
     border: solid rgba(71, 71, 71, 0.5) 1px;
-    padding: 5px 8px;
     font-size: 13pt;
-    display: inline-block;
-    margin-top: 12px;
     background-color: rgba(128, 128, 128, 0.4);
     color: #fff;
-    cursor: pointer;
 }
 
 .save_button:hover,
diff --git a/share/tools/web_config/partials/abbreviations.html b/share/tools/web_config/partials/abbreviations.html
index 382ebeeef..0d577fcea 100644
--- a/share/tools/web_config/partials/abbreviations.html
+++ b/share/tools/web_config/partials/abbreviations.html
@@ -14,7 +14,7 @@
             <span ng-show="abbreviation.editable"><input ng-model="abbreviation.phrase" class="abbreviation_input" style="text-align: left; 	min-width: 22em;"></span>
         </td>
         <td ng-class="{ data_table_cell: true }" class="abbreviation_actions">
-            <span ng-show="abbreviation.editable && abbreviation.word && abbreviation.phrase" ng-click="saveAbbreviation(abbreviation)"><span class="save_button" style="margin: inherit;">Save</span></span>
+            <span ng-show="abbreviation.editable && abbreviation.word && abbreviation.phrase" ng-click="saveAbbreviation(abbreviation)"><button class="save_button" style="margin: inherit;">Save</button></span>
             <a ng-show="abbreviation.word" ng-click="removeAbbreviation(abbreviation)"><img alt="Delete" src="delete.png" style="vertical-align: text-bottom"></a>
         </td>
     </tr>
diff --git a/share/tools/web_config/partials/colors.html b/share/tools/web_config/partials/colors.html
index 19a7f8ebd..95fa02746 100644
--- a/share/tools/web_config/partials/colors.html
+++ b/share/tools/web_config/partials/colors.html
@@ -96,15 +96,15 @@ fish cannot change the background color of your terminal. Refer to your terminal
 
 		<div style="position: absolute; right: 5px; bottom: 5px;">
 
-			<span class="customize_theme_button"
+			<button class="customize_theme_button"
 				  ng-class="{button_highlight: customizationActive}"
 				  data-ng-style="{'color': text_color_for_color(terminalBackgroundColor || 'black')}"
-				  ng-click="toggleCustomizationActive();">Customize</span>
+				  ng-click="toggleCustomizationActive();">Customize</button>
 
-			<span class="save_button"
+			<button class="save_button"
 				  data-ng-style="{'color': text_color_for_color(terminalBackgroundColor || 'black')}"
 				  ng-show="showSaveButton"
-				  ng-click="setTheme()">{{saveThemeButtonTitle}}</span>
+				  ng-click="setTheme()">{{saveThemeButtonTitle}}</button>
 		</div>
 
     </div>
diff --git a/share/tools/web_config/partials/prompt.html b/share/tools/web_config/partials/prompt.html
index 976737fc6..41a1acac4 100644
--- a/share/tools/web_config/partials/prompt.html
+++ b/share/tools/web_config/partials/prompt.html
@@ -6,11 +6,11 @@
 	    <div ng-bind-html='selectedPrompt.demo | to_trusted' style='flex-grow: 1' class="prompt_demo unbordered"></div>
 	    <div ng-if='selectedPrompt.right' title="right prompt for {{selectedPrompt.name }}" ng-bind-html='selectedPrompt.right | to_trusted' class="prompt_demo unbordered" ng-click="selectPrompt(prompt)"></div>
     </div>
-	<div style="position: absolute; right: 5px; bottom: 5px; color:">
-		<span class="save_button"
+	<div style="position: absolute; right: 5px; bottom: 5px;">
+		<button class="save_button"
 			ng-show="showSaveButton"
 			style="color: #CCC"
-			ng-click="setPrompt()">{{ savePromptButtonTitle }}</span>
+			ng-click="setPrompt()">{{ savePromptButtonTitle }}</button>
 	</div>
 </div>
 <div style="margin: 10px 15px 7px 15px; padding-bottom: 10px; border-bottom: solid 1px #999">Preview a prompt below:</div>