refactor: add Linux support for margin adjustments in MinappPopupConainer and McpSettingsNavbar (#5673)

* refactor: add Linux support for margin adjustments in MinappPopupContainer and McpSettingsNavbar

* refactor: adjust margin and padding for Linux support in MinappPopupContainer and McpSettingsNavbar

* refactor: enhance Linux support in MinappPopupContainer by updating button group class condition
This commit is contained in:
beyondkmp 2025-05-05 16:58:14 +08:00 committed by GitHub
parent 470d8710f3
commit 2f4ed1378f
3 changed files with 16 additions and 8 deletions

View File

@ -8,7 +8,7 @@ import {
PushpinOutlined,
ReloadOutlined
} from '@ant-design/icons'
import { isMac, isWindows } from '@renderer/config/constant'
import { isLinux, isMac, isWindows } from '@renderer/config/constant'
import { DEFAULT_MIN_APPS } from '@renderer/config/minapps'
import { useBridge } from '@renderer/hooks/useBridge'
import { useMinappPopup } from '@renderer/hooks/useMinappPopup'
@ -285,7 +285,7 @@ const MinappPopupContainer: React.FC = () => {
</Tooltip>
)}
<Spacer />
<ButtonsGroup className={isWindows ? 'windows' : ''}>
<ButtonsGroup className={isWindows || isLinux ? 'windows' : ''}>
<Tooltip title={t('minapp.popup.refresh')} mouseEnterDelay={0.8} placement="bottom">
<Button onClick={() => handleReload(appInfo.id)}>
<ReloadOutlined />
@ -421,7 +421,7 @@ const ButtonsGroup = styled.div`
gap: 5px;
-webkit-app-region: no-drag;
&.windows {
margin-right: ${isWindows ? '130px' : 0};
margin-right: ${isWindows ? '130px' : isLinux ? '100px' : 0};
background-color: var(--color-background-mute);
border-radius: 50px;
padding: 0 3px;

View File

@ -26,9 +26,17 @@ export const ThemeProvider: React.FC<ThemeProviderProps> = ({ children, defaultT
const toggleTheme = () => {
// 主题顺序是light, dark, auto, 所以需要先判断当前主题,然后取下一个主题
const nextTheme =
theme === ThemeMode.light ? ThemeMode.dark : theme === ThemeMode.dark ? ThemeMode.auto : ThemeMode.light
setTheme(nextTheme)
switch (theme) {
case ThemeMode.light:
setTheme(ThemeMode.dark)
break
case ThemeMode.dark:
setTheme(ThemeMode.auto)
break
case ThemeMode.auto:
setTheme(ThemeMode.light)
break
}
}
useEffect(() => {

View File

@ -1,6 +1,6 @@
import { NavbarRight } from '@renderer/components/app/Navbar'
import { HStack } from '@renderer/components/Layout'
import { isWindows } from '@renderer/config/constant'
import { isLinux, isWindows } from '@renderer/config/constant'
import { Button, Dropdown, Menu, type MenuProps } from 'antd'
import { ChevronDown, Search } from 'lucide-react'
import { useTranslation } from 'react-i18next'
@ -73,7 +73,7 @@ export const McpSettingsNavbar = () => {
}))
return (
<NavbarRight style={{ paddingRight: isWindows ? 150 : 12 }}>
<NavbarRight style={{ paddingRight: isWindows ? 150 : isLinux ? 120 : 12 }}>
<HStack alignItems="center" gap={5}>
<Button
size="small"