diff --git a/popup.html b/popup.html
index 66fa1e4..361607e 100644
--- a/popup.html
+++ b/popup.html
@@ -84,7 +84,6 @@
display: flex;
align-items: center;
justify-content: space-between;
- margin-bottom: 20px;
}
.toggle-label {
@@ -151,69 +150,6 @@
line-height: 1.3;
}
- .tooltip {
- position: relative;
- display: inline-block;
- margin-left: 6px;
- cursor: help;
- }
-
- .tooltip-icon {
- width: 14px;
- height: 14px;
- border-radius: 50%;
- background: #6c757d;
- color: white;
- font-size: 10px;
- font-weight: bold;
- display: inline-flex;
- align-items: center;
- justify-content: center;
- user-select: none;
- }
-
- .tooltip-content {
- visibility: hidden;
- width: 280px;
- background-color: #333;
- color: #fff;
- text-align: left;
- border-radius: 6px;
- padding: 12px;
- position: absolute;
- z-index: 1000;
- bottom: 125%;
- left: 50%;
- margin-left: -140px;
- opacity: 0;
- transition: opacity 0.3s, visibility 0.3s;
- font-size: 12px;
- line-height: 1.4;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
- }
-
- .tooltip-content::after {
- content: "";
- position: absolute;
- top: 100%;
- left: 50%;
- margin-left: -5px;
- border-width: 5px;
- border-style: solid;
- border-color: #333 transparent transparent transparent;
- }
-
- .tooltip:hover .tooltip-content,
- .tooltip:focus-within .tooltip-content {
- visibility: visible;
- opacity: 1;
- }
-
- .tooltip-icon:focus {
- outline: 2px solid #007bff;
- outline-offset: 2px;
- }
-
.shortcut-info {
font-size: 11px;
color: #666;
@@ -277,21 +213,7 @@
- Automatically download screenshots as PNG files to your computer. Hover over the "?" for more details.
+ Automatically download screenshots as PNG files to your default downloads folder.
- Automatically copy screenshots to clipboard for quick pasting. Hover over the "?" for more details.
+ Automatically copy screenshots to your clipboard for quick pasting.
diff --git a/popup.js b/popup.js
index 5c6a712..529b7e0 100644
--- a/popup.js
+++ b/popup.js
@@ -145,8 +145,7 @@ document.addEventListener('DOMContentLoaded', async () => {
// Check current state
checkSelectorState();
- // Handle tooltip keyboard navigation
- setupTooltipAccessibility();
+ // Tooltips removed
function toggleButtons(isActive) {
if (isActive) {
@@ -191,50 +190,7 @@ document.addEventListener('DOMContentLoaded', async () => {
}
}
- function setupTooltipAccessibility() {
- const tooltips = document.querySelectorAll('.tooltip');
-
- tooltips.forEach(tooltip => {
- const tooltipIcon = tooltip.querySelector('.tooltip-icon');
- const tooltipContent = tooltip.querySelector('.tooltip-content');
-
- if (!tooltipIcon || !tooltipContent) return;
-
- // Handle keyboard events for tooltip
- tooltipIcon.addEventListener('keydown', (e) => {
- if (e.key === 'Enter' || e.key === ' ') {
- e.preventDefault();
- // Toggle tooltip visibility on Enter/Space
- const isVisible = tooltipContent.style.visibility === 'visible';
- tooltipContent.style.visibility = isVisible ? 'hidden' : 'visible';
- tooltipContent.style.opacity = isVisible ? '0' : '1';
- } else if (e.key === 'Escape') {
- // Hide tooltip on Escape
- tooltipContent.style.visibility = 'hidden';
- tooltipContent.style.opacity = '0';
- }
- });
-
- // Hide tooltip when clicking outside
- document.addEventListener('click', (e) => {
- if (!tooltip.contains(e.target)) {
- tooltipContent.style.visibility = 'hidden';
- tooltipContent.style.opacity = '0';
- }
- });
-
- // Handle focus loss
- tooltipIcon.addEventListener('blur', (e) => {
- // Small delay to allow for focus to move to tooltip content if needed
- setTimeout(() => {
- if (!tooltipIcon.matches(':focus-within')) {
- tooltipContent.style.visibility = 'hidden';
- tooltipContent.style.opacity = '0';
- }
- }, 100);
- });
- });
- }
+ // Tooltips removed: no setup needed
});
// Listen for messages from content script