oadmin/new-api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🔗feat(ui): Standardize link colors and update documentation URL in EditChannel component

Browse Source 
**Changes:**
- Unify link color styling across EditChannel.js by replacing `text-blue-500` with consistent primary color scheme
- Apply `!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors` to all template fill and documentation links
- Update documentation URL from Calcium-Ion repository to QuantumNous repository
- Add smooth hover transitions and consistent visual feedback for all clickable links

**Affected Elements:**
- Model mapping template fill link
- Deployment region template fill link
- Channel settings template fill link
- Channel settings documentation link
- Status code mapping template fill link

**Benefits:**
- Consistent visual design language across the entire application
- Improved user experience with unified link styling
- Better accessibility with clear hover states and transitions
- Correct documentation references pointing to the current project repository

**Technical Details:**
- Maintains existing functionality while improving visual consistency
- Links now match the color scheme used in About page and Footer components
- Smooth color transitions enhance user interaction feedback
This commit is contained in:
Apple\Apple
2025-06-07 23:15:25 +08:00
parent 387721e907
commit 33014e9399
3 changed files with 27 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
web/src/components/layout/Footer.js
View File

@@ -40,36 +40,36 @@ const FooterBar = () => {
<div className="text-left"> <div className="text-left">
<p className="!text-semi-color-text-0 font-semibold mb-5">{t('关于我们')}</p> <p className="!text-semi-color-text-0 font-semibold mb-5">{t('关于我们')}</p>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<a href="https://docs.newapi.pro/wiki/project-introduction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('关于项目')}</a> <a href="https://docs.newapi.pro/wiki/project-introduction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('关于项目')}</a>
<a href="https://docs.newapi.pro/support/community-interaction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('联系我们')}</a> <a href="https://docs.newapi.pro/support/community-interaction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('联系我们')}</a>
<a href="https://docs.newapi.pro/wiki/features-introduction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('功能特性')}</a> <a href="https://docs.newapi.pro/wiki/features-introduction/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('功能特性')}</a>
</div> </div>
</div> </div>
<div className="text-left"> <div className="text-left">
<p className="!text-semi-color-text-0 font-semibold mb-5">{t('文档')}</p> <p className="!text-semi-color-text-0 font-semibold mb-5">{t('文档')}</p>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<a href="https://docs.newapi.pro/getting-started/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('快速开始')}</a> <a href="https://docs.newapi.pro/getting-started/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('快速开始')}</a>
<a href="https://docs.newapi.pro/installation/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('安装指南')}</a> <a href="https://docs.newapi.pro/installation/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('安装指南')}</a>
<a href="https://docs.newapi.pro/api/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">{t('API 文档')}</a> <a href="https://docs.newapi.pro/api/" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">{t('API 文档')}</a>
</div> </div>
</div> </div>
<div className="text-left"> <div className="text-left">
<p className="!text-semi-color-text-0 font-semibold mb-5">{t('相关项目')}</p> <p className="!text-semi-color-text-0 font-semibold mb-5">{t('相关项目')}</p>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<a href="https://github.com/songquanpeng/one-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">One API</a> <a href="https://github.com/songquanpeng/one-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">One API</a>
<a href="https://github.com/novicezk/midjourney-proxy" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">Midjourney-Proxy</a> <a href="https://github.com/novicezk/midjourney-proxy" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">Midjourney-Proxy</a>
<a href="https://github.com/Deeptrain-Community/chatnio" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">chatnio</a> <a href="https://github.com/Deeptrain-Community/chatnio" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">chatnio</a>
<a href="https://github.com/Calcium-Ion/neko-api-key-tool" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">neko-api-key-tool</a> <a href="https://github.com/Calcium-Ion/neko-api-key-tool" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">neko-api-key-tool</a>
</div> </div>
</div> </div>
<div className="text-left"> <div className="text-left">
<p className="!text-semi-color-text-0 font-semibold mb-5">{t('基于New API的项目')}</p> <p className="!text-semi-color-text-0 font-semibold mb-5">{t('基于New API的项目')}</p>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<a href="https://github.com/Calcium-Ion/new-api-horizon" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">new-api-horizon</a> <a href="https://github.com/Calcium-Ion/new-api-horizon" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">new-api-horizon</a>
{/* <a href="https://github.com/VoAPI/VoAPI" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1 hover:!text-semi-color-primary transition-colors">VoAPI</a> */} {/* <a href="https://github.com/VoAPI/VoAPI" target="_blank" rel="noopener noreferrer" className="!text-semi-color-text-1">VoAPI</a> */}
</div> </div>
</div> </div>
</div> </div>
@@ -83,9 +83,9 @@ const FooterBar = () => {
<div className="text-sm"> <div className="text-sm">
<span className="!text-semi-color-text-1">{t('设计与开发由')} </span> <span className="!text-semi-color-text-1">{t('设计与开发由')} </span>
<a href="https://github.com/QuantumNous/new-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors font-medium">New API</a> <a href="https://github.com/QuantumNous/new-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-primary font-medium">New API</a>
<span className="!text-semi-color-text-1"> & </span> <span className="!text-semi-color-text-1"> & </span>
<a href="https://github.com/songquanpeng/one-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors font-medium">One API</a> <a href="https://github.com/songquanpeng/one-api" target="_blank" rel="noopener noreferrer" className="!text-semi-color-primary font-medium">One API</a>
</div> </div>
</div> </div>
</footer> </footer>

14
web/src/pages/About/index.js
View File

@@ -45,7 +45,7 @@ const About = () => {
href='https://github.com/QuantumNous/new-api' href='https://github.com/QuantumNous/new-api'
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
https://github.com/QuantumNous/new-api https://github.com/QuantumNous/new-api
</a> </a>
@@ -54,28 +54,28 @@ const About = () => {
href="https://github.com/QuantumNous/new-api" href="https://github.com/QuantumNous/new-api"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
NewAPI NewAPI
</a> {t('© {{currentYear}}', { currentYear })} <a </a> {t('© {{currentYear}}', { currentYear })} <a
href="https://github.com/QuantumNous" href="https://github.com/QuantumNous"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
QuantumNous QuantumNous
</a> {t('| 基于')} <a </a> {t('| 基于')} <a
href="https://github.com/songquanpeng/one-api/releases/tag/v0.5.4" href="https://github.com/songquanpeng/one-api/releases/tag/v0.5.4"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
One API v0.5.4 One API v0.5.4
</a> © 2023 <a </a> © 2023 <a
href="https://github.com/songquanpeng" href="https://github.com/songquanpeng"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
JustSong JustSong
</a> </a>
@@ -86,7 +86,7 @@ const About = () => {
href="https://github.com/songquanpeng/one-api/blob/v0.5.4/LICENSE" href="https://github.com/songquanpeng/one-api/blob/v0.5.4/LICENSE"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
{t('MIT许可证')} {t('MIT许可证')}
</a> </a>
@@ -95,7 +95,7 @@ const About = () => {
href="https://github.com/QuantumNous/new-api/blob/main/LICENSE" href="https://github.com/QuantumNous/new-api/blob/main/LICENSE"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="!text-semi-color-primary hover:!text-semi-color-primary-hover transition-colors" className="!text-semi-color-primary"
> >
{t('Apache-2.0协议')} {t('Apache-2.0协议')}
</a> </a>

12
web/src/pages/Channel/EditChannel.js
View File

@@ -846,7 +846,7 @@ const EditChannel = (props) => {
className="!rounded-lg font-mono" className="!rounded-lg font-mono"
/> />
<Text <Text
className="text-blue-500 cursor-pointer mt-1 block" className="!text-semi-color-primary cursor-pointer mt-1 block"
onClick={() => handleInputChange('model_mapping', JSON.stringify(MODEL_MAPPING_EXAMPLE, null, 2))} onClick={() => handleInputChange('model_mapping', JSON.stringify(MODEL_MAPPING_EXAMPLE, null, 2))}
> >
{t('填入模板')} {t('填入模板')}
@@ -940,7 +940,7 @@ const EditChannel = (props) => {
className="!rounded-lg font-mono" className="!rounded-lg font-mono"
/> />
<Text <Text
className="text-blue-500 cursor-pointer mt-1 block" className="!text-semi-color-primary cursor-pointer mt-1 block"
onClick={() => handleInputChange('other', JSON.stringify(REGION_EXAMPLE, null, 2))} onClick={() => handleInputChange('other', JSON.stringify(REGION_EXAMPLE, null, 2))}
> >
{t('填入模板')} {t('填入模板')}
@@ -1062,7 +1062,7 @@ const EditChannel = (props) => {
/> />
<div className="flex gap-2 mt-1"> <div className="flex gap-2 mt-1">
<Text <Text
className="text-blue-500 cursor-pointer" className="!text-semi-color-primary cursor-pointer"
onClick={() => { onClick={() => {
handleInputChange( handleInputChange(
'setting', 'setting',
@@ -1073,10 +1073,10 @@ const EditChannel = (props) => {
{t('填入模板')} {t('填入模板')}
</Text> </Text>
<Text <Text
className="text-blue-500 cursor-pointer" className="!text-semi-color-primary cursor-pointer"
onClick={() => { onClick={() => {
window.open( window.open(
'https://github.com/Calcium-Ion/new-api/blob/main/docs/channel/other_setting.md', 'https://github.com/QuantumNous/new-api/blob/main/docs/channel/other_setting.md',
); );
}} }}
> >
@@ -1146,7 +1146,7 @@ const EditChannel = (props) => {
className="!rounded-lg font-mono" className="!rounded-lg font-mono"
/> />
<Text <Text
className="text-blue-500 cursor-pointer mt-1 block" className="!text-semi-color-primary cursor-pointer mt-1 block"
onClick={() => { onClick={() => {
handleInputChange( handleInputChange(
'status_code_mapping', 'status_code_mapping',