Skip to content

Commit 8194613

Browse files
CopilotTechQuery
Copilot
and
TechQuery
committed
Add bounty page with fresh UI and navigation integration
Co-authored-by: TechQuery <[email protected]>
1 parent a24e9b1 commit 8194613

File tree

6 files changed

+257
-0
lines changed

6 files changed

+257
-0
lines changed

‎components/Navigator/MainNavigator.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ const topNavBarMenu = ({ t }: typeof i18n): MenuItem[] => [
4343
href: 'https://github.com/Open-Source-Bazaar/Git-Hackathon-scaffold',
4444
title: t('hackathon'),
4545
},
46+
{ href: '/bounty', title: t('bounty') },
4647
{ href: '/license-filter', title: t('license_filter') },
4748
],
4849
},

‎pages/bounty.tsx‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
import { observer } from 'mobx-react';
2+
import { FC, useContext } from 'react';
3+
import { Card, Col, Container, Row } from 'react-bootstrap';
4+
5+
import { PageHead } from '../components/Layout/PageHead';
6+
import { I18nContext } from '../models/Translation';
7+
import styles from '../styles/Bounty.module.less';
8+
9+
interface BountyViewProps {
10+
title: string;
11+
url: string;
12+
icon: string;
13+
}
14+
15+
const BountyView: FC<BountyViewProps> = ({ title, url, icon }) => (
16+
<Col md={6} lg={4}>
17+
<Card className={styles.bountyCard}>
18+
<Card.Body>
19+
<h5 className={styles.cardTitle}>
20+
{icon} {title}
21+
</h5>
22+
<div className={styles.iframeContainer}>
23+
<iframe
24+
src={url}
25+
className={styles.bountyIframe}
26+
title={title}
27+
allow="clipboard-read; clipboard-write"
28+
/>
29+
</div>
30+
</Card.Body>
31+
</Card>
32+
</Col>
33+
);
34+
35+
const BountyPage: FC = observer(() => {
36+
const { t } = useContext(I18nContext);
37+
38+
const bountyViews: BountyViewProps[] = [
39+
{
40+
title: t('bounty_dashboard'),
41+
url: 'https://open-source-bazaar.feishu.cn/share/base/dashboard/shrcnt4EaAxn3zx9faRarERgEqf',
42+
icon: '📊',
43+
},
44+
{
45+
title: t('bounty_token_leaderboard'),
46+
url: 'https://open-source-bazaar.feishu.cn/share/base/view/shrcn6QBgImHEjFH5qDf5tjmrzb',
47+
icon: '🪙',
48+
},
49+
{
50+
title: t('bounty_task_leaderboard'),
51+
url: 'https://open-source-bazaar.feishu.cn/share/base/view/shrcnUVgb8E73UthaB2Tk4glnSb',
52+
icon: '📋',
53+
},
54+
{
55+
title: t('bounty_task_submission'),
56+
url: 'https://open-source-bazaar.feishu.cn/share/base/form/shrcn2Ss97TSu3XgPi7mbZbrXLe',
57+
icon: '📝',
58+
},
59+
{
60+
title: t('bounty_achievement_leaderboard'),
61+
url: 'https://open-source-bazaar.feishu.cn/share/base/view/shrcne4IY9mYAfoo9a69oxyAdTb',
62+
icon: '🏆',
63+
},
64+
{
65+
title: t('bounty_achievement_submission'),
66+
url: 'https://open-source-bazaar.feishu.cn/share/base/form/shrcn7yHGIOnPNjdZck3eBaiMVc',
67+
icon: '✅',
68+
},
69+
{
70+
title: t('bounty_hero_leaderboard'),
71+
url: 'https://open-source-bazaar.feishu.cn/share/base/view/shrcnyrOkRfqSAjWEjCQ9T4OOwc',
72+
icon: '🦸',
73+
},
74+
{
75+
title: t('bounty_debt_leaderboard'),
76+
url: 'https://open-source-bazaar.feishu.cn/share/base/view/shrcnImOzkBXW3okKp3nLskPMgd',
77+
icon: '💳',
78+
},
79+
];
80+
81+
return (
82+
<>
83+
<PageHead title={t('bounty_page_title')} />
84+
85+
{/* Hero Section */}
86+
<section className={styles.hero}>
87+
<Container>
88+
<h1 className={`text-center ${styles.title}`}>{t('bounty_page_title')}</h1>
89+
<p className={`text-center ${styles.description}`}>{t('bounty_page_description')}</p>
90+
</Container>
91+
</section>
92+
93+
<Container className="my-5">
94+
<Row className="g-4">
95+
{bountyViews.map(view => (
96+
<BountyView key={view.url} {...view} />
97+
))}
98+
</Row>
99+
</Container>
100+
</>
101+
);
102+
});
103+
104+
export default BountyPage;

‎styles/Bounty.module.less‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
// Fresh and lively bounty page styling inspired by hackathon page
2+
3+
.hero {
4+
position: relative;
5+
background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
6+
padding: 4rem 0;
7+
overflow: hidden;
8+
color: #fff;
9+
10+
&::before {
11+
position: absolute;
12+
top: -50%;
13+
left: -50%;
14+
animation: grid-animation 20s linear infinite;
15+
background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
16+
background-size: 50px 50px;
17+
width: 200%;
18+
height: 200%;
19+
pointer-events: none;
20+
content: '';
21+
}
22+
}
23+
24+
@keyframes grid-animation {
25+
0% {
26+
transform: translate(0, 0);
27+
}
28+
100% {
29+
transform: translate(50px, 50px);
30+
}
31+
}
32+
33+
.title {
34+
margin-bottom: 1rem;
35+
font-weight: 700;
36+
font-size: 3rem;
37+
text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
38+
}
39+
40+
.description {
41+
opacity: 0.9;
42+
margin: 0 auto;
43+
max-width: 800px;
44+
font-size: 1.2rem;
45+
}
46+
47+
.bountyCard {
48+
transition: all 0.3s ease;
49+
border: 2px solid transparent;
50+
border-radius: 16px;
51+
background: linear-gradient(135deg, rgba(102, 126, 234, 0.1), rgba(240, 147, 251, 0.1));
52+
box-shadow: 0 4px 15px rgba(102, 126, 234, 0.2);
53+
height: 100%;
54+
overflow: hidden;
55+
56+
&:hover {
57+
transform: translateY(-8px) scale(1.02);
58+
box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4);
59+
background: linear-gradient(135deg, rgba(102, 126, 234, 0.15), rgba(240, 147, 251, 0.15));
60+
}
61+
}
62+
63+
.cardTitle {
64+
display: inline-block;
65+
margin-bottom: 1.5rem;
66+
border-bottom: 3px solid;
67+
border-image: linear-gradient(90deg, #f093fb, #f5576c, #ffd140) 1;
68+
background: linear-gradient(90deg, #f093fb, #f5576c, #ffd140);
69+
-webkit-background-clip: text;
70+
padding-bottom: 0.5rem;
71+
font-weight: 700;
72+
font-size: 1.3rem;
73+
-webkit-text-fill-color: transparent;
74+
background-clip: text;
75+
}
76+
77+
.iframeContainer {
78+
position: relative;
79+
width: 100%;
80+
padding-bottom: 75%; // 4:3 aspect ratio
81+
overflow: hidden;
82+
border-radius: 12px;
83+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
84+
}
85+
86+
.bountyIframe {
87+
position: absolute;
88+
top: 0;
89+
left: 0;
90+
border: none;
91+
border-radius: 12px;
92+
width: 100%;
93+
height: 100%;
94+
}
95+
96+
// Responsive adjustments
97+
@media (max-width: 768px) {
98+
.title {
99+
font-size: 2rem;
100+
}
101+
102+
.description {
103+
font-size: 1rem;
104+
}
105+
106+
.cardTitle {
107+
font-size: 1.1rem;
108+
}
109+
110+
.iframeContainer {
111+
padding-bottom: 100%; // More square on mobile
112+
}
113+
}

‎translation/en-US.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ export default {
77
open_collaborator_award: 'Open Collaborator Award',
88
activity: 'Activity',
99
hackathon: 'Hackathon',
10+
bounty: 'Open Source Bounty',
1011
open_source_projects: 'Open Source projects',
1112
open_source_bazaar: 'Open Source Bazaar',
1213
home_page: 'Home Page',
@@ -34,6 +35,18 @@ export default {
3435
volunteer: 'Volunteer',
3536
online_volunteer: 'Online Volunteer',
3637

38+
// Bounty page
39+
bounty_page_title: 'Open Source Bounty',
40+
bounty_page_description: 'Participate in open source projects and earn bounty rewards',
41+
bounty_dashboard: 'Dashboard',
42+
bounty_token_leaderboard: 'Token Leaderboard',
43+
bounty_task_leaderboard: 'Task Leaderboard',
44+
bounty_task_submission: 'Task Submission Form',
45+
bounty_achievement_leaderboard: 'Achievement Leaderboard',
46+
bounty_achievement_submission: 'Achievement Submission Form',
47+
bounty_hero_leaderboard: 'Hero Leaderboard',
48+
bounty_debt_leaderboard: 'Debt Leaderboard',
49+
3750
//License-tool Page
3851
license_filter: 'Open Source License Selector',
3952
feature_attitude_undefined: "I don't care",

‎translation/zh-CN.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export default {
99
open_source_projects: '开源项目',
1010
activity: '活动',
1111
hackathon: '黑客马拉松',
12+
bounty: '开源悬赏',
1213
home_page: '主页',
1314
wiki: '知识库',
1415

@@ -33,6 +34,18 @@ export default {
3334
volunteer: '志愿者',
3435
online_volunteer: '线上志愿者',
3536

37+
// Bounty page
38+
bounty_page_title: '开源悬赏',
39+
bounty_page_description: '参与开源项目，获得悬赏奖励',
40+
bounty_dashboard: '仪表盘',
41+
bounty_token_leaderboard: '代币榜',
42+
bounty_task_leaderboard: '任务榜',
43+
bounty_task_submission: '任务发布表单',
44+
bounty_achievement_leaderboard: '成果榜',
45+
bounty_achievement_submission: '成果提交表单',
46+
bounty_hero_leaderboard: '英雄榜',
47+
bounty_debt_leaderboard: '欠条榜',
48+
3649
//License-tool Page
3750
license_filter: '开源协议选择器',
3851
feature_attitude_undefined: '我不在乎',

‎translation/zh-TW.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export default {
99
open_source_projects: '開源項目',
1010
activity: '活動',
1111
hackathon: '黑客馬拉松',
12+
bounty: '開源懸賞',
1213
home_page: '主頁',
1314
wiki: '知識庫',
1415

@@ -33,6 +34,18 @@ export default {
3334
volunteer: '志工',
3435
online_volunteer: '線上志工',
3536

37+
// Bounty page
38+
bounty_page_title: '開源懸賞',
39+
bounty_page_description: '參與開源項目，獲得懸賞獎勵',
40+
bounty_dashboard: '儀表板',
41+
bounty_token_leaderboard: '代幣榜',
42+
bounty_task_leaderboard: '任務榜',
43+
bounty_task_submission: '任務發布表單',
44+
bounty_achievement_leaderboard: '成果榜',
45+
bounty_achievement_submission: '成果提交表單',
46+
bounty_hero_leaderboard: '英雄榜',
47+
bounty_debt_leaderboard: '欠條榜',
48+
3649
//License-tool Page
3750
license_filter: '開源許可證選擇器',
3851
feature_attitude_undefined: '我不在乎',

0 commit comments

Comments
 (0)