Rewrite Help modal content with updated text and new sections

- Updated intro paragraphs: share-focused copy, local storage + no tracking note
- Renamed settings heading to "Settings Details"
- Updated Split Modifiers, Physical Layout, and Language body copy
- Added Mouse/HOTAS and Cross-Format Conflict Warnings items
- Renamed Reset All to "Return to Defaults" with updated description
- Added credit section with email link and language note

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Author: asimone

src/components/HelpModal.jsx

@@ -10,25 +10,34 @@ export default function HelpModal({ onClose }) {
         <div className="help-body">
           <p className="mobile-only mobile-notice">{t('mobileWarning')}</p>
 
-          <p><strong>Keybindr</strong> {t('helpIntro1')}</p>
           <p>{t('helpIntro2')}</p>
           <p>{t('helpIntro3')}</p>
 
-          <h4>{t('settingsTitle')}</h4>
+          <h4>{t('helpSettingsTitle')}</h4>
           <p>
             <strong>{t('helpSplitLabel')}</strong> {t('helpSplitBody')}
           </p>
           <p>
             <strong>{t('physicalLayout')}</strong> {t('helpPhysBody1')}
           </p>
-          <p>{t('helpPhysBody2')}</p>
           <p>
             <strong>{t('languageRegion')}</strong> {t('helpLangBody')}
           </p>
+          <p>{t('helpMouseHotasBody')}</p>
+          <p>
+            <strong>{t('helpConflictsLabel')}</strong> {t('helpConflictsBody')}
+          </p>
           <p>
             <strong>{t('helpResetLabel')}</strong> {t('helpResetBody')}
           </p>
-          {t('helpOutro') && <p>{t('helpOutro')}</p>}
+
+          <p className="help-credit">
+            Built by Andrew{' — '}
+            <a href="mailto:andrew@keybinds.help">andrew@keybinds.help</a>
+          </p>
+          <p className="help-credit-note">
+            (I speak English and a small amount of French and German, but we both always have computer translation to help our communication if you have questions, feature requests, or bug reports.)
+          </p>
         </div>
         <div className="modal-actions">
           <button className="btn-primary" onClick={onClose}>{t('gotIt')}</button>

src/index.css

@@ -652,6 +652,21 @@ html, body {
   margin-top: 6px;
 }
 .help-body strong { color: var(--accent2); }
+.help-credit {
+  margin-top: 6px;
+  font-size: 12px;
+  color: var(--text-dim);
+}
+.help-credit a {
+  color: var(--accent);
+  text-decoration: none;
+}
+.help-credit a:hover { text-decoration: underline; }
+.help-credit-note {
+  font-size: 11px;
+  color: var(--text-dim);
+  font-style: italic;
+}
 
 /* Settings modal */
 .modal-settings { width: 400px; }

src/translations.js

@@ -72,15 +72,19 @@ const en = {
   mitLicense:         'MIT License',
   mobileWarning:      'This is a desktop focused application and, given the nature of it, will likely never be totally optimized for mobile. - Management',
   helpIntro1:         'is a visual keyboard binding planner.',
-  helpIntro2:         'Map actions to key combinations, customize colors, name your layout, and export it for reference.',
-  helpIntro3:         'All data is stored on your computer, so exporting at the end of a session is recommended.',
+  helpIntro2:         'Map actions to key combinations, customize colors, name your layout, and share it with others.',
+  helpIntro3:         'All data is stored locally in your browser, so exporting at the end of a session is recommended to avoid losing work. There is no user tracking on the site.',
+  helpSettingsTitle:  'Settings Details',
   helpSplitLabel:     'Split Modifiers',
-  helpSplitBody:      'toggles between unified modifier keys (Shift) or separate left/right keys (LShift / RShift).',
-  helpPhysBody1:      'switches between keyboard form factors — ANSI 104, ISO 105, TKL, 75%, 65%, and 60%.',
+  helpSplitBody:      'toggles between unified modifier keys (Shift) and separate left/right keys (LShift / RShift).',
+  helpPhysBody1:      'switches between keyboard form factors: ANSI 104, ISO 105, TKL, 75%, 65%, and 60%.',
   helpPhysBody2:      'If switching would orphan any existing bindings (keys that don\'t exist on the new layout), you\'ll be prompted before anything is deleted.',
-  helpLangBody:       'changes the key labels shown on the keyboard to match your locale — covering QWERTY, QWERTZ, AZERTY, and regional variants across 23 locales.',
-  helpResetLabel:     'Reset All',
-  helpResetBody:      'clears all bindings, colors, and the layout name and returns settings to defaults.',
+  helpLangBody:       'changes key labels to match your locale, supporting QWERTY, QWERTZ, AZERTY, and 30+ regional variants.',
+  helpMouseHotasBody: 'Mouse and HOTAS keybinds can be toggled on or off. Visualization is not currently supported.',
+  helpConflictsLabel: 'Cross-Format Conflict Warnings',
+  helpConflictsBody:  'shows conflicts between format tabs (e.g. "On Foot" and "In Vehicle"). Off by default.',
+  helpResetLabel:     'Return to Defaults',
+  helpResetBody:      'clears all bindings, colors, and layout name, and resets to the example default.',
   modifierConflict:    'This modifier key is bound standalone and also used in a combo — these bindings may conflict',
   crossFormatWarnings: 'Cross-format conflict warnings',
   crossFormatConflict: 'This keybind is also bound in {names}',