yuukiii/hermes-mcp
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

style(a11y): add aria-labels and title tooltips to all buttons and form inputs

Browse Source 
Addresses claude.ai accessibility flagging: all 11 platform Connect buttons now
have aria-label="Connect [Platform]" and title="Connect [Platform]"; all form
inputs have aria-label; modal close button has aria-label="Close".

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Garfield
2026-06-12 13:40:56 -04:00
parent 45cf9cafe6
commit 7e32dca0d8
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
product/app/index.html
View File

@@ -17,7 +17,7 @@
<p>Enter your email to receive a reset link</p>
</div>
<form id="reset-request-form" class="auth-form">
<input type="email" name="email" placeholder="Email" required>
<input type="email" name="email" placeholder="Email" aria-label="Email address" required>
<button type="submit" class="btn btn-primary">Send Reset Link</button>
<p class="error-msg" id="reset-request-error"></p>
<p class="success-msg" id="reset-request-success"></p>
@@ -35,7 +35,7 @@
<p>Enter your new password below</p>
</div>
<form id="reset-confirm-form" class="auth-form">
<input type="password" name="password" placeholder="New password (min 8 chars)" required minlength="8">
<input type="password" name="password" placeholder="New password (min 8 chars)" aria-label="New password" required minlength="8">
<button type="submit" class="btn btn-primary">Update Password</button>
<p class="error-msg" id="reset-confirm-error"></p>
<p class="success-msg" id="reset-confirm-success"></p>
@@ -56,14 +56,14 @@
<button class="tab-btn" data-tab="signup">Create Account</button>
</div>
<form id="login-form" class="auth-form">
<input type="email" name="email" placeholder="Email" required>
<input type="password" name="password" placeholder="Password" required minlength="8">
<input type="email" name="email" placeholder="Email" aria-label="Email address" required>
<input type="password" name="password" placeholder="Password" aria-label="Password" required minlength="8">
<button type="submit" class="btn btn-primary">Sign In</button>
<p class="error-msg" id="login-error"></p>
</form>
<form id="signup-form" class="auth-form hidden">
<input type="email" name="email" placeholder="Email" required>
<input type="password" name="password" placeholder="Password (min 8 chars)" required minlength="8">
<input type="email" name="email" placeholder="Email" aria-label="Email address" required>
<input type="password" name="password" placeholder="Password (min 8 chars)" aria-label="Password" required minlength="8">
<button type="submit" class="btn btn-primary">Create Account</button>
<p class="error-msg" id="signup-error"></p>
</form>
@@ -118,7 +118,7 @@
<p class="platform-desc">Search and edit your notes vault</p>
<span class="status-badge disconnected" id="status-obsidian">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="obsidian">Connect</button>
<button class="btn btn-connect" data-platform="obsidian" aria-label="Connect Obsidian" title="Connect Obsidian">Connect</button>
</div>
<div class="platform-card v1-platform" data-platform="email">
@@ -128,7 +128,7 @@
<p class="platform-desc">Gmail, Yahoo, and IMAP accounts</p>
<span class="status-badge disconnected" id="status-email">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="email">Connect</button>
<button class="btn btn-connect" data-platform="email" aria-label="Connect Email" title="Connect Email">Connect</button>
</div>
<div class="platform-card v1-platform" data-platform="facebook">
@@ -138,7 +138,7 @@
<p class="platform-desc">Post to pages and manage content</p>
<span class="status-badge disconnected" id="status-facebook">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="facebook">Connect</button>
<button class="btn btn-connect" data-platform="facebook" aria-label="Connect Facebook" title="Connect Facebook">Connect</button>
</div>
<div class="platform-card v1-platform" data-platform="instagram">
@@ -148,7 +148,7 @@
<p class="platform-desc">Publish reels and images</p>
<span class="status-badge disconnected" id="status-instagram">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="instagram">Connect</button>
<button class="btn btn-connect" data-platform="instagram" aria-label="Connect Instagram" title="Connect Instagram">Connect</button>
</div>
<div class="platform-divider">
@@ -163,7 +163,7 @@
<p class="platform-desc">Share posts, images, and videos</p>
<span class="status-badge disconnected" id="status-linkedin">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="linkedin">Connect</button>
<button class="btn btn-connect" data-platform="linkedin" aria-label="Connect LinkedIn" title="Connect LinkedIn">Connect</button>
</div>
<div class="platform-card" data-platform="twitter">
@@ -173,7 +173,7 @@
<p class="platform-desc">Tweet with media support</p>
<span class="status-badge disconnected" id="status-twitter">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="twitter">Connect</button>
<button class="btn btn-connect" data-platform="twitter" aria-label="Connect Twitter / X" title="Connect Twitter / X">Connect</button>
</div>
<div class="platform-card" data-platform="whatsapp">
@@ -183,7 +183,7 @@
<p class="platform-desc">Business messaging</p>
<span class="status-badge disconnected" id="status-whatsapp">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="whatsapp">Connect</button>
<button class="btn btn-connect" data-platform="whatsapp" aria-label="Connect WhatsApp" title="Connect WhatsApp">Connect</button>
</div>
<div class="platform-card" data-platform="telegram">
@@ -193,7 +193,7 @@
<p class="platform-desc">Send messages via bot</p>
<span class="status-badge disconnected" id="status-telegram">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="telegram">Connect</button>
<button class="btn btn-connect" data-platform="telegram" aria-label="Connect Telegram" title="Connect Telegram">Connect</button>
</div>
<div class="platform-card" data-platform="discord">
@@ -203,7 +203,7 @@
<p class="platform-desc">Send messages to channels</p>
<span class="status-badge disconnected" id="status-discord">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="discord">Connect</button>
<button class="btn btn-connect" data-platform="discord" aria-label="Connect Discord" title="Connect Discord">Connect</button>
</div>
<div class="platform-card" data-platform="slack">
@@ -213,7 +213,7 @@
<p class="platform-desc">Send messages to channels</p>
<span class="status-badge disconnected" id="status-slack">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="slack">Connect</button>
<button class="btn btn-connect" data-platform="slack" aria-label="Connect Slack" title="Connect Slack">Connect</button>
</div>
<div class="platform-card" data-platform="tiktok">
@@ -223,7 +223,7 @@
<p class="platform-desc">Publish videos and view analytics</p>
<span class="status-badge disconnected" id="status-tiktok">Not connected</span>
</div>
<button class="btn btn-connect" data-platform="tiktok">Connect</button>
<button class="btn btn-connect" data-platform="tiktok" aria-label="Connect TikTok" title="Connect TikTok">Connect</button>
</div>
</section>
@@ -261,10 +261,10 @@
<div class="webhook-card" id="webhook-card">
<div id="webhook-status-row" class="webhook-status-row">
<span id="webhook-url-display" class="webhook-url-display">No webhook configured</span>
<button id="webhook-delete-btn" class="btn btn-ghost hidden">Remove</button>
<button id="webhook-delete-btn" class="btn btn-ghost hidden" aria-label="Remove webhook URL" title="Remove webhook URL">Remove</button>
</div>
<form id="webhook-form" class="webhook-form">
<input type="url" id="webhook-url-input" placeholder="https://your-server.com/webhook" required>
<input type="url" id="webhook-url-input" placeholder="https://your-server.com/webhook" aria-label="Webhook URL" required>
<button type="submit" class="btn btn-primary">Save &amp; generate secret</button>
</form>
<div id="webhook-secret-box" class="webhook-secret-box hidden">
@@ -284,7 +284,7 @@
<div id="connect-modal" class="modal hidden">
<div class="modal-backdrop"></div>
<div class="modal-content">
<button class="modal-close">&times;</button>
<button class="modal-close" aria-label="Close" title="Close">&times;</button>
<div id="modal-body"></div>
</div>
</div>