Add files via upload

Author: Nat30

background.js

@@ -0,0 +1,51 @@
+/**
+ * 拖拽即走 Chrome 插件 - 背景脚本
+ * 处理标签页操作和消息传递
+ */
+
+/**
+ * 监听来自内容脚本的消息
+ */
+chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
+  if (request.action === 'openTab') {
+    openNewTab(request.url);
+    sendResponse({ success: true });
+  }
+  return true; // 保持消息通道开放
+});
+
+/**
+ * 在新标签页中打开URL
+ * @param {string} url - 要打开的URL
+ */
+async function openNewTab(url) {
+  try {
+    // 创建新标签页并激活
+    await chrome.tabs.create({
+      url: url,
+      active: true // 在前台打开并激活
+    });
+  } catch (error) {
+    // 错误处理已移除调试信息
+  }
+}
+
+/**
+ * 插件安装时的初始化
+ */
+chrome.runtime.onInstalled.addListener((details) => {
+  if (details.reason === 'install') {
+    // 首次安装时设置默认配置
+    chrome.storage.sync.set({
+      blacklist: [
+        '*.trello.com/*',
+        '*.figma.com/*',
+        '*.miro.com/*',
+        '*.draw.io/*'
+      ]
+    });
+
+    // 打开选项页面
+    chrome.runtime.openOptionsPage();
+  }
+});

content.css

@@ -0,0 +1,221 @@
+/**
+ * 拖拽即走 Chrome 插件 - 样式文件
+ * 为拖拽提示和视觉反馈提供样式
+ */
+
+/* 通用变量定义 */
+:root {
+  --primary-gradient: linear-gradient(135deg, #667eea, #764ba2);
+  --primary-shadow: 0 8px 32px rgba(102, 126, 234, 0.4), 0 2px 8px rgba(0, 0, 0, 0.2);
+  --primary-color: rgba(102, 126, 234, 0.95);
+  --secondary-color: rgba(118, 75, 162, 0.95);
+  --border-radius-sm: 8px;
+  --border-radius-md: 12px;
+  --border-radius-lg: 16px;
+  --transition-smooth: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  --font-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
+}
+
+.drag-to-go-tooltip {
+  position: fixed !important;
+  background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)) !important;
+  color: white !important;
+  padding: 8px 16px !important;
+  border-radius: var(--border-radius-md) !important;
+  font: 600 13px/1.3 var(--font-system) !important;
+  z-index: 2147483647 !important;
+  pointer-events: none !important;
+  display: none !important;
+  box-shadow: var(--primary-shadow) !important;
+  border: 1px solid rgba(255, 255, 255, 0.2) !important;
+  backdrop-filter: blur(12px) !important;
+  -webkit-backdrop-filter: blur(12px) !important;
+  white-space: nowrap !important;
+  max-width: 320px !important;
+  overflow: hidden !important;
+  text-overflow: ellipsis !important;
+  letter-spacing: 0.5px !important;
+  transform: translateY(-2px) !important;
+  transition: var(--transition-smooth) !important;
+}
+
+/* 拖拽时的鼠标样式 */
+body.drag-to-go-dragging {
+  cursor: grabbing !important;
+  user-select: none !important;
+  -webkit-user-select: none !important;
+}
+
+/* 拖拽预览元素 */
+.drag-to-go-preview {
+  position: fixed !important;
+  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.95)) !important;
+  border: 2px solid transparent !important;
+  background-clip: padding-box !important;
+  border-radius: var(--border-radius-lg) !important;
+  padding: 12px 16px !important;
+  font: 600 13px var(--font-system) !important;
+  z-index: 2147483647 !important;
+  pointer-events: none !important;
+  display: flex !important;
+  align-items: center !important;
+  gap: 12px !important;
+  box-shadow: 0 12px 40px rgba(102, 126, 234, 0.25), 0 4px 16px rgba(0, 0, 0, 0.1) !important;
+  backdrop-filter: blur(16px) !important;
+  -webkit-backdrop-filter: blur(16px) !important;
+  max-width: 320px !important;
+  transform: rotate(-1deg) scale(1.02) !important;
+  transition: var(--transition-smooth) !important;
+}
+
+/* 为预览元素添加渐变边框效果 */
+.drag-to-go-preview::before {
+  content: '' !important;
+  position: absolute !important;
+  top: -2px !important;
+  left: -2px !important;
+  right: -2px !important;
+  bottom: -2px !important;
+  background: linear-gradient(135deg, #667eea, #764ba2, #667eea) !important;
+  border-radius: 18px !important;
+  z-index: -1 !important;
+  opacity: 0.6 !important;
+}
+
+.drag-to-go-preview:hover {
+  transform: rotate(0deg) scale(1.08) !important;
+  box-shadow: 0 16px 48px rgba(102, 126, 234, 0.35), 0 6px 20px rgba(0, 0, 0, 0.15) !important;
+}
+
+/* 预览图标 */
+.drag-to-go-preview .preview-icon {
+  font-size: 20px !important;
+  flex-shrink: 0 !important;
+  line-height: 1 !important;
+  background: linear-gradient(135deg, #667eea, #764ba2) !important;
+  -webkit-background-clip: text !important;
+  -webkit-text-fill-color: transparent !important;
+  background-clip: text !important;
+  filter: drop-shadow(0 1px 2px rgba(102, 126, 234, 0.3)) !important;
+}
+
+/* 预览文本 */
+.drag-to-go-preview .preview-text {
+  color: #1a202c !important;
+  white-space: nowrap !important;
+  overflow: hidden !important;
+  text-overflow: ellipsis !important;
+  max-width: 260px !important;
+  line-height: 1.4 !important;
+  font-weight: 600 !important;
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
+}
+
+/* 预览图片 */
+.drag-to-go-preview .preview-image {
+  width: 36px !important;
+  height: 36px !important;
+  object-fit: cover !important;
+  border-radius: 8px !important;
+  border: 2px solid rgba(255, 255, 255, 0.8) !important;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
+  transition: all 0.2s ease !important;
+}
+
+.drag-to-go-preview .preview-image:hover {
+  transform: scale(1.05) !important;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
+}
+
+/* 拖拽时预览元素的动画 */
+@keyframes drag-preview-appear {
+  0% {
+    opacity: 0;
+    transform: scale(0.6) rotate(-8deg) translateY(20px);
+    filter: blur(4px);
+  }
+  50% {
+    opacity: 0.8;
+    transform: scale(1.1) rotate(-2deg) translateY(-5px);
+    filter: blur(1px);
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1.02) rotate(-1deg) translateY(0);
+    filter: blur(0);
+  }
+}
+
+.drag-to-go-preview {
+  animation: drag-preview-appear 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
+}
+
+/* 拖拽时选中文本的样式 */
+.drag-to-go-selected-text {
+  background: linear-gradient(135deg, rgba(102, 126, 234, 0.25), rgba(118, 75, 162, 0.25)) !important;
+  border-radius: 4px !important;
+  box-shadow: 0 0 0 1px rgba(102, 126, 234, 0.3) !important;
+  animation: text-selection-pulse 1.5s ease-in-out infinite !important;
+}
+
+/* 拖拽时图片的样式 */
+img.drag-to-go-dragging {
+  opacity: 0.8 !important;
+  transform: scale(0.98) rotate(-1deg) !important;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
+  filter: brightness(1.1) saturate(1.2) !important;
+  box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3) !important;
+  border-radius: 1px !important;
+}
+
+/* 拖拽时链接的样式 */
+a.drag-to-go-dragging {
+  opacity: 0.9 !important;
+  text-decoration: none !important;
+  background: linear-gradient(135deg, rgba(102, 126, 234, 0.15), rgba(118, 75, 162, 0.15)) !important;
+  border-radius: 6px !important;
+  padding: 2px 4px !important;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
+  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2) !important;
+  transform: translateY(-1px) !important;
+}
+
+/* 动画效果 */
+@keyframes drag-to-go-pulse {
+  0% { 
+    transform: scale(1) translateY(-2px);
+    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4), 0 2px 8px rgba(0, 0, 0, 0.2);
+  }
+  50% { 
+    transform: scale(1.08) translateY(-4px);
+    box-shadow: 0 12px 40px rgba(102, 126, 234, 0.5), 0 4px 12px rgba(0, 0, 0, 0.25);
+  }
+  100% { 
+    transform: scale(1) translateY(-2px);
+    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4), 0 2px 8px rgba(0, 0, 0, 0.2);
+  }
+}
+
+/* 文本选中脉冲动画 */
+@keyframes text-selection-pulse {
+  0%, 100% {
+    box-shadow: 0 0 0 1px rgba(102, 126, 234, 0.3);
+  }
+  50% {
+    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.5), 0 0 8px rgba(102, 126, 234, 0.3);
+  }
+}
+
+/* 拖拽状态下的全局动画 */
+@keyframes drag-glow {
+  0%, 100% {
+    filter: drop-shadow(0 0 4px rgba(102, 126, 234, 0.3));
+  }
+  50% {
+    filter: drop-shadow(0 0 8px rgba(102, 126, 234, 0.6));
+  }
+}
+
+.drag-to-go-tooltip.show {
+  animation: drag-to-go-pulse 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
+}