Skip to content

Added Mac pasting shorcut to legend. #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
PEPOAFONSO wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Added Mac pasting shorcut to legend. #3

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/pages/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const { t } = useI18n()

<div class="px-6">
<p class="text-center">
Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V</code>
Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot Sep 14, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Avoid hard‑coded English; use i18n like the title/subtitle

This string bypasses Vue I18n used elsewhere in the file.

Apply this diff to localize the key labels while keeping the gradient:

-      Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
+      Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">{{ t('index.pasteKeys', { ctrl: 'Ctrl+V', cmd: 'Cmd+V' }) }}</code>

Follow‑up: add index.pasteKeys to your locale files, e.g., "index.pasteKeys": "{ctrl} or {cmd}".

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">{{ t('index.pasteKeys', { ctrl: 'Ctrl+V', cmd: 'Cmd+V' }) }}</code>
🤖 Prompt for AI Agents 
In src/pages/index.vue around line 37, the hard‑coded "CTRL+V or CMD + V" string
bypasses Vue I18n; replace the literal content with a call to
$t('index.pasteKeys', { ctrl: 'CTRL+V', cmd: 'CMD + V' }) (or the component
equivalent) so the gradient-wrapped code element remains but its inner text
comes from i18n, and add an index.pasteKeys entry to your locale files like
"{ctrl} or {cmd}" so translations can substitute the placeholders.

🛠️ Refactor suggestion

Use semantic for keyboard keys and fix spacing/casing

Improves a11y and consistency: “Ctrl+V” / “Cmd+V” (no spaces around +).

Option A (no i18n change):

-      Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
+      Use the <span class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600"><kbd>Ctrl</kbd>+<kbd>V</kbd> or <kbd>Cmd</kbd>+<kbd>V</kbd></span>

Option B (with i18n variable for the keys):

-      Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
+      Use the <span class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">{{ t('index.pasteKeys', { ctrl: 'Ctrl+V', cmd: 'Cmd+V' }) }}</span>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
Use the <code class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600">CTRL+V or CMD + V</code>
Use the <span class="text-transparent bg-clip-text bg-gradient-to-br from-rose-400 to-fuchsia-600"><kbd>Ctrl</kbd>+<kbd>V</kbd> or <kbd>Cmd</kbd>+<kbd>V</kbd></span>
🤖 Prompt for AI Agents 
In src/pages/index.vue around line 37, the inline key hint currently uses a code
element with inconsistent spacing and casing; replace it with semantic <kbd>
elements and normalize to "Ctrl+V" and "Cmd+V" (no spaces around the plus and
capitalized as shown). Wrap each key token in its own <kbd> element (e.g.,
<kbd>Ctrl</kbd>+<kbd>V</kbd> / <kbd>Cmd</kbd>+<kbd>V</kbd>), and optionally move
the key strings into i18n variables if you need localized control over
platform-specific labels.

key combination to paste an image from your clipboard.
</p>
</div>
Expand Down