feat(web): ui upgrade

This commit is contained in:
zhaoying
2026-03-24 17:04:38 +08:00
parent c7275dccac
commit fb6ce839d2
8 changed files with 40 additions and 38 deletions

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-03 16:29:41
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-19 21:10:38
* @Last Modified time: 2026-03-24 16:43:10
*/
import { type FC, useState, useEffect, useRef } from 'react';
import { useTranslation } from 'react-i18next';
@@ -163,20 +163,19 @@ const ReleasePage: FC<{data: Application; refresh: () => void}> = ({data, refres
title={t('application.changeLog')}
headerType="borderless"
>
<Flex gap={16} vertical>
{selectedVersion && (
<RbCard
headerType="borderless"
title={<div className="rb:text-[14px]">{formatDateTime(selectedVersion.published_at, 'YYYY-MM-DD HH:mm:ss')}</div>}
extra={<span className="rb:text-[12px] rb:text-[#5B6167] rb:leading-4">{selectedVersion.publisher_name}</span>}
bodyClassName="rb:pt-0! rb:pb-3! rb:px-4!"
variant="outlined"
>
<div className="rb:font-regular rb:text-[#5B6167] rb:leading-4">
<Markdown content={selectedVersion.release_notes} />
</div>
</RbCard>
)}
</Flex>
</RbCard>
</Flex>
}

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-05 10:45:08
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-04 10:41:35
* @Last Modified time: 2026-03-24 16:59:57
*/
import { forwardRef, useEffect, useImperativeHandle, useState } from 'react';
import { List, Flex, Tooltip, Form } from 'antd';
@@ -185,19 +185,19 @@ const SkillListModal = forwardRef<SkillModalRef, SkillModalProps>(({
"rb:bg-[rgba(21,94,239,0.06)] rb:border-[#155EEF] rb:text-[#155EEF]": selectedIds.includes(item.id),
"rb:border-[#DFE4ED] rb:text-[#212332]": !selectedIds.includes(item.id),
})} onClick={() => handleSelect(item)}>
<Flex>
{/* Skill avatar showing first letter of name */}
<Flex align="center" justify="center" className="rb:size-12 rb:rounded-lg rb:mr-3.25! rb:bg-[#155eef] rb:text-[28px] rb:text-white">
{item.name[0]}
</Flex>
{/* Skill name and description */}
<div className="rb:flex-1 rb:max-w-[calc(100%-60px)]">
<div className="rb:font-medium rb:wrap-break-word rb:line-clamp-1">{item.name}</div>
<Tooltip title={item.description}>
<div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4.25 rb:font-regular rb:-mt-1 rb:wrap-break-word rb:line-clamp-1">{item.description}</div>
</Tooltip>
</div>
</Flex>
{/* Skill name and description */}
<div className="rb:flex-1 rb:max-w-[calc(100%-60px)]">
<Tooltip title={item.name}>
<div className="rb:flex-1 rb:leading-5.5 rb:min-w-0 rb:whitespace-break-spaces rb:wrap-break-word rb:line-clamp-1 rb:font-medium rb:text-[16px] rb:mb-4">
{item.name}
</div>
</Tooltip>
{/* Skill description with tooltip */}
<Tooltip title={item.description}>
<div className="rb:h-10 rb:leading-5 rb:wrap-break-word rb:line-clamp-2">{item.description}</div>
</Tooltip>
</div>
</div>
</List.Item>
)}