Add section heading comments (#1179)

ext/bg/settings2.html

@@ -51,6 +51,7 @@
 
     <h1>Yomichan Settings</h1>
 
+    <!-- Beta notice -->
     <h2></h2>
     <div class="settings-group" style="border: 1px solid var(--accent-color);">
         <div class="settings-item"><div class="settings-item-inner">
@@ -73,6 +74,7 @@
         </div></div>
     </div>
 
+    <!-- Profile -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="profile"></span></div>
         <div class="heading-container-left"><h2 id="profile">Profile</h2></div>
@@ -106,6 +108,7 @@
         </div></div>
     </div>
 
+    <!-- Dictionaries -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="book"></span></div>
         <div class="heading-container-left"><h2 id="dictionaries">Dictionaries <span class="heading-sub-text no-wrap" data-modal-action="show,dictionaries">(<span id="dictionary-install-count">#</span> installed)</span></h2></div>
@@ -181,6 +184,7 @@
         </div>
     </div>
 
+    <!-- General -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="cog"></span></div>
         <div class="heading-container-left"><h2 id="general">General</h2></div>
@@ -278,6 +282,7 @@
         </div></div>
     </div>
 
+    <!-- Scanning -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="scanning"></span></div>
         <div class="heading-container-left"><h2 id="scanning">Scanning</h2></div>
@@ -446,6 +451,7 @@
         </div></div>
     </div>
 
+    <!-- Popup -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="popup"></span></div>
         <div class="heading-container-left"><h2 id="popup">Popup</h2></div>
@@ -528,6 +534,7 @@
         </div>
     </div>
 
+    <!-- Popup Appearance -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="palette"></span></div>
         <div class="heading-container-left"><h2 id="popup-appearance">Popup Appearance</h2></div>
@@ -690,6 +697,7 @@
         </div></div>
     </div>
 
+    <!-- Popup Position & Size -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="popup-size"></span></div>
         <div class="heading-container-left"><h2 id="popup-size">Popup Position &amp; Size</h2></div>
@@ -869,6 +877,7 @@
         </div></div>
     </div>
 
+    <!-- Window -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="window"></span></div>
         <div class="heading-container-left"><h2 id="window">Window</h2></div>
@@ -939,6 +948,7 @@
         </div></div>
     </div>
 
+    <!-- Audio -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="speaker"></span></div>
         <div class="heading-container-left"><h2 id="audio">Audio</h2></div>
@@ -981,6 +991,7 @@
         </div></div>
     </div>
 
+    <!-- Text Parsing -->
     <div>
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="text-parsing"></span></div>
@@ -1055,6 +1066,7 @@
         </div></div>
     </div>
 
+    <!-- Translation -->
     <div>
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="translation"></span></div>
@@ -1171,6 +1183,7 @@
         </div></div>
     </div>
 
+    <!-- Anki -->
     <div>
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="note-card"></span></div>
@@ -1342,6 +1355,7 @@
         </div></div>
     </div>
 
+    <!-- Shortcuts -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="keyboard"></span></div>
         <div class="heading-container-left"><h2 id="shortcuts">Shortcuts</h2></div>
@@ -1373,6 +1387,7 @@
         </div></div>
     </div>
 
+    <!-- Backup -->
     <div class="heading-container">
         <div class="heading-container-icon"><span class="icon" data-icon="backup"></span></div>
         <div class="heading-container-left"><h2 id="backup">Backup</h2></div>
@@ -1405,6 +1420,7 @@
         </div></div>
     </div>
 
+    <!-- Security -->
     <div class="heading-container advanced-only">
         <div class="heading-container-icon"><span class="icon" data-icon="lock"></span></div>
         <div class="heading-container-left"><h2 id="security">Security</h2></div>