1 line
33 KiB
JSON
1 line
33 KiB
JSON
|
{"ast":null,"code":"var _jsxFileName = \"D:\\\\aiproject\\\\goAgent\\\\todo\\\\client\\\\src\\\\components\\\\TodoItem.js\",\n _s = $RefreshSig$();\nimport React, { useState } from 'react';\nimport styled, { keyframes } from 'styled-components';\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst slideIn = keyframes`\n from {\n opacity: 0;\n transform: translateX(-10px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n`;\nconst fadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`;\nconst scaleIn = keyframes`\n from {\n transform: scale(0.95);\n }\n to {\n transform: scale(1);\n }\n`;\nconst ItemContainer = styled.div`\n background: ${({\n theme\n}) => theme.colors.glass.light};\n backdrop-filter: blur(10px);\n -webkit-backdrop-filter: blur(10px);\n border-radius: ${({\n theme\n}) => theme.borderRadius.lg};\n padding: ${({\n theme\n}) => theme.spacing.lg};\n display: flex;\n align-items: center;\n gap: ${({\n theme\n}) => theme.spacing.md};\n transition: all ${({\n theme\n}) => theme.transitions.default};\n border: 1px solid ${({\n theme\n}) => theme.colors.glass.light};\n animation: ${slideIn} 0.3s ease-out;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n\n &:hover {\n transform: translateY(-2px);\n box-shadow: ${({\n theme\n}) => theme.shadows.md};\n }\n\n &:active {\n transform: translateY(0);\n box-shadow: ${({\n theme\n}) => theme.shadows.sm};\n }\n\n @media (prefers-color-scheme: dark) {\n background: ${({\n theme\n}) => theme.colors.glass.dark};\n border-color: ${({\n theme\n}) => theme.colors.glass.dark};\n }\n\n @media (max-width: ${({\n theme\n}) => theme.breakpoints.md}) {\n padding: ${({\n theme\n}) => theme.spacing.md};\n }\n`;\n_c = ItemContainer;\nconst Checkbox = styled.input`\n appearance: none;\n width: 24px;\n height: 24px;\n border: 2px solid ${({\n theme\n}) => theme.colors.primary};\n border-radius: ${({\n theme\n}) => theme.borderRadius.md};\n cursor: pointer;\n position: relative;\n transition: all ${({\n theme\n}) => theme.transitions.default};\n flex-shrink: 0;\n\n &:checked {\n background: ${({\n theme\n}) => theme.colors.primary};\n border-color: ${({\n theme\n}) => theme.colors.primary};\n }\n\n &:checked::after {\n content: '✓';\n position: absolute;\n color: white;\n font-size: 16px;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n animation: ${fadeIn} 0.2s ease-out;\n }\n\n &:hover {\n transform: scale(1.1);\n }\n\n &:focus {\n outline: none;\n box-shadow: 0 0 0 3px ${({\n theme\n}) => theme.colors.primary}40;\n }\n`;\n_c2 = Checkbox;\nconst Content = styled.div`\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: ${({\n theme\n}) => theme.spacing.xs};\n min-width: 0; // 防止内容溢出\n`;\n_c3 = Content;\nconst Title = styled.span`\n color: ${({\n theme,\n completed\n}) => completed ? theme.colors.text.secondary : theme.colors.text.primary};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.base};\n font-weight: ${({\n theme\n}) => theme.typography.fontWeight.medium};\n text-decoration: ${({\n completed\n}) => completed ? 'line-through' : 'none'};\n transition: all ${({\n theme\n}) => theme.transitions.default};\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n_c4 = Title;\nconst Description = styled.p`\n color: ${({\n theme\n}) => theme.colors.text.secondary};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.sm};\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n line-height: 1.4;\n`;\n_c5 = Description;\nconst PriorityBadge = styled.span`\n padding: ${({\n theme\n}) => `${theme.spacing.xs} ${theme.spacing.sm}`};\n border-radius: ${({\n theme\n}) => theme.borderRadius.full};\n font-size: ${({\n theme\n}) => theme.typography.fontSize.xs};\n font-weight: ${({\n theme\n}) => theme.typography.fontWeight.
|