scriptoriumadmin/skillhub
1
0
Fork 0
mirror of https://github.com/iflytek/skillhub.git synced 2026-10-09 03:17:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

fix(theme): polish dark notification states

Browse source 
Signed-off-by: XiaoSeS <87064762+XiaoSeS@users.noreply.github.com>
This commit is contained in:
XiaoSeS 2026-09-01 14:14:38 +08:00
parent 7995c00683
commit b8b0fba3d4
3 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
web/e2e/theme-toggle.spec.ts
View file

@ -34,6 +34,16 @@ test.describe('Light and dark theme', () => {
await expect(page.getByRole('heading', { name: 'SkillHub', exact: true })).toBeVisible()
await page.screenshot({ path: testInfo.outputPath('dark-desktop.png'), fullPage: true })
const notificationButton = page.getByRole('button', { name: 'Notifications' })
await notificationButton.click()
await expect(page.getByText('Notifications', { exact: true })).toBeVisible()
const firstNotification = notificationButton.locator('..').locator('a').first()
if (await firstNotification.count()) {
await firstNotification.hover()
}
await page.screenshot({ path: testInfo.outputPath('dark-notifications.png'), fullPage: true })
await notificationButton.click()
await page.setViewportSize({ width: 390, height: 844 })
await expect(page.getByRole('button', { name: 'Switch to light theme' })).toBeVisible()
await expect.poll(() => page.evaluate(() => document.documentElement.scrollWidth <= window.innerWidth)).toBe(true)

2
web/src/features/notification/notification-bell.tsx
View file

@ -45,7 +45,7 @@ export function NotificationBell() {
type="button"
aria-label={t('notification.title')}
onClick={() => setOpen((v) => !v)}
className="relative flex items-center justify-center w-8 h-8 rounded-full hover:bg-gray-100 transition-colors"
className="relative flex h-8 w-8 items-center justify-center rounded-full transition-colors hover:bg-muted"
>
{/* Bell SVG */}
<svg

2
web/src/features/notification/notification-dropdown.tsx
View file

@ -75,7 +75,7 @@ export function NotificationDropdown({ onClose }: Props) {
<Link
to={resolveNotificationTarget(item)}
onClick={() => handleItemClick(item)}
className="flex items-start gap-3 px-4 py-3 hover:bg-gray-50 transition-colors"
className="flex items-start gap-3 px-4 py-3 transition-colors hover:bg-muted"
>
{/* Unread dot */}
<span className={`mt-1.5 flex-shrink-0 w-2 h-2 rounded-full ${item.status === 'UNREAD' ? 'bg-red-500' : 'bg-transparent'}`} />