添加GitHub徽标到页面右上角

- 创建GitHubIcon组件，使用GitHub官方SVG图标
- 在CurlFilter组件header区域添加GitHub徽标按钮
- 点击徽标在新页面打开仓库地址 https://github.com/JSREI/curl-filter
- 添加相应的CSS样式，包括hover效果和定位
- 修复TypeScript类型导入问题
- 通过Playwright测试验证界面效果

Author: CC11001100

src/components/CurlFilter.css

@@ -20,10 +20,34 @@
 
 /* 标题区域 */
 .header-section {
-  text-align: center;
   margin-bottom: 24px;
 }
 
+.header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  position: relative;
+}
+
+.header-text {
+  flex: 1;
+  text-align: center;
+}
+
+.github-button {
+  position: absolute;
+  top: 0;
+  right: 0;
+  color: #00a86b !important;
+  transition: all 0.3s ease;
+}
+
+.github-button:hover {
+  background-color: rgba(0, 168, 107, 0.08) !important;
+  transform: scale(1.1);
+}
+
 .header-actions {
   display: flex;
   gap: 12px;

src/components/CurlFilter.tsx

@@ -26,6 +26,7 @@ import {
   Preview as PreviewIcon,
   History as HistoryIcon
 } from '@mui/icons-material';
+import GitHubIcon from './GitHubIcon';
 import { parseCurl } from '../utils/curlParser';
 import { FilterEngine } from '../utils/filterEngine';
 import type { FilterRule, FilterContext, FilterResult } from '../types/filterRules';
@@ -286,13 +287,27 @@ const CurlFilter: React.FC = () => {
     <Box className="curl-filter-container">
       <Paper elevation={3} className="curl-filter-paper">
         <Box className="header-section">
-          <Typography variant="h4" component="h1" className="title">
-            <FilterList className="title-icon" />
-            cURL 过滤器
-          </Typography>
-          <Typography variant="body1" color="text.secondary" className="subtitle">
-            使用可配置的规则过滤cURL命令，支持请求头、查询参数、表单数据和JSON请求体
-          </Typography>
+          <Box className="header-content">
+            <Box className="header-text">
+              <Typography variant="h4" component="h1" className="title">
+                <FilterList className="title-icon" />
+                cURL 过滤器
+              </Typography>
+              <Typography variant="body1" color="text.secondary" className="subtitle">
+                使用可配置的规则过滤cURL命令，支持请求头、查询参数、表单数据和JSON请求体
+              </Typography>
+            </Box>
+            <Tooltip title="查看源代码">
+              <IconButton
+                onClick={() => window.open('https://github.com/JSREI/curl-filter', '_blank')}
+                color="primary"
+                className="github-button"
+                size="large"
+              >
+                <GitHubIcon />
+              </IconButton>
+            </Tooltip>
+          </Box>
 
           <Box className="header-actions">
             <Button

src/components/GitHubIcon.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { SvgIcon } from '@mui/material';
+import type { SvgIconProps } from '@mui/material';
+
+/**
+ * GitHub图标组件
+ * 使用GitHub官方的SVG图标
+ */
+const GitHubIcon: React.FC<SvgIconProps> = (props) => {
+  return (
+    <SvgIcon {...props} viewBox="0 0 24 24">
+      <path d="M12 0C5.374 0 0 5.373 0 12 0 17.302 3.438 21.8 8.207 23.387c.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0112 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z"/>
+    </SvgIcon>
+  );
+};
+
+export default GitHubIcon;