Skip to content

Commit a2a792d

Browse files
zhaooleezhaoolee
committed
Polish GARSS Studio controls
1 parent 55ded92 commit a2a792d

3 files changed

Lines changed: 72 additions & 9 deletions

File tree

‎garss-studio/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="icon" type="image/png" href="/logo.png" />
67
<title>GARSS Studio</title>
78
</head>
89
<body>

‎garss-studio/src/App.tsx‎

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2714,20 +2714,32 @@ function RsshubPanel() {
27142714
}
27152715

27162716
function SettingsAiConnectionSection() {
2717+
const aiPromptText =
2718+
"请安装Skill https://clawhub.ai/zhaoolee/garss-studio-rss-api 按照skill要求，在本地启动项目，获取今天的摄影类型的信息更新，把前十张图片放到我桌面的 RSS摄影图 文件夹里，并使用markdown给出图片来源";
2719+
const [copiedPrompt, setCopiedPrompt] = useState(false);
2720+
2721+
async function handleCopyAiPrompt() {
2722+
try {
2723+
await navigator.clipboard.writeText(aiPromptText);
2724+
setCopiedPrompt(true);
2725+
window.setTimeout(() => setCopiedPrompt(false), 1400);
2726+
} catch {
2727+
setCopiedPrompt(false);
2728+
window.alert("复制失败，请手动选中文字复制。");
2729+
}
2730+
}
2731+
27172732
return (
27182733
<section className="editor-sheet settings-sheet settings-page-sheet">
27192734
<div className="sheet-head">
2720-
<h3>连接AI</h3>
2721-
<p>把下面这段提示词交给 AI，让它优先读取项目内置 skill，再使用后端接口读取订阅 RSS 新闻。</p>
2735+
<p>把下面这段提示词交给AI</p>
27222736
</div>
27232737

27242738
<div className="settings-doc-card settings-ai-guide">
2725-
<p>
2726-
这是 GARSS 项目，仓库地址是 <code>https://github.com/zhaoolee/garss</code>。如果你需要读取这个项目订阅的
2727-
RSS 新闻，请先查看仓库中的 <code>skills/garss-studio-rss-api</code> skill，并按该 skill 的说明连接
2728-
GARSS Studio 后端。它会告诉你如何启动本地服务、通过提取码换取 Bearer Token、读取聚合新闻、读取单个订阅源，
2729-
以及在用户明确要求时执行强制刷新。
2730-
</p>
2739+
<button type="button" className="settings-ai-copy-button" onClick={() => void handleCopyAiPrompt()}>
2740+
{copiedPrompt ? "已复制" : "复制"}
2741+
</button>
2742+
<p>{aiPromptText}</p>
27312743
</div>
27322744
</section>
27332745
);

‎garss-studio/src/styles.css‎

Lines changed: 51 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1295,8 +1295,10 @@ a {
12951295
}
12961296

12971297
.settings-ai-guide {
1298+
position: relative;
12981299
display: grid;
12991300
gap: 14px;
1301+
padding-right: 86px;
13001302
color: #5e4e40;
13011303
line-height: 1.9;
13021304
}
@@ -1305,6 +1307,34 @@ a {
13051307
margin: 0;
13061308
}
13071309

1310+
.settings-ai-copy-button {
1311+
position: absolute;
1312+
top: 14px;
1313+
right: 14px;
1314+
display: inline-flex;
1315+
align-items: center;
1316+
justify-content: center;
1317+
min-width: 58px;
1318+
height: 32px;
1319+
padding: 0 12px;
1320+
border: 1px solid rgba(82, 63, 47, 0.55);
1321+
border-radius: 7px;
1322+
background: linear-gradient(180deg, rgb(129, 111, 97) 0%, rgb(115, 99, 87) 100%);
1323+
color: #fbf6ef;
1324+
font-size: 13px;
1325+
font-weight: 600;
1326+
line-height: 1;
1327+
box-shadow:
1328+
inset 0 1px 0 rgba(255, 255, 255, 0.16),
1329+
0 1px 0 rgba(58, 42, 29, 0.22);
1330+
}
1331+
1332+
.settings-ai-copy-button:hover,
1333+
.settings-ai-copy-button:focus-visible {
1334+
background: linear-gradient(180deg, rgb(138, 119, 105) 0%, rgb(121, 104, 91) 100%);
1335+
outline: 0;
1336+
}
1337+
13081338
.settings-ai-guide code,
13091339
.settings-api-item code {
13101340
padding: 1px 5px;
@@ -1656,11 +1686,31 @@ a {
16561686
}
16571687

16581688
.source-backup-button {
1689+
display: inline-flex;
1690+
align-items: center;
1691+
justify-content: center;
16591692
height: 40px;
16601693
min-height: 40px;
1661-
padding: 0 16px;
1694+
padding: 0 18px;
1695+
border: 1px solid rgba(82, 63, 47, 0.6);
16621696
border-radius: 7px;
1697+
font-size: 14px;
1698+
font-weight: 600;
1699+
line-height: 1;
16631700
white-space: nowrap;
1701+
box-shadow:
1702+
inset 0 1px 0 rgba(255, 255, 255, 0.16),
1703+
0 1px 0 rgba(58, 42, 29, 0.22);
1704+
}
1705+
1706+
.source-backup-button.secondary-button {
1707+
background: rgba(255, 249, 241, 0.9);
1708+
color: var(--accent-strong);
1709+
}
1710+
1711+
.source-backup-button.primary-button {
1712+
background: linear-gradient(180deg, rgb(129, 111, 97) 0%, rgb(115, 99, 87) 100%);
1713+
color: #fbf6ef;
16641714
}
16651715

16661716
.source-card {

0 commit comments

Comments
 (0)