fix: windows frame background color

This commit is contained in:
kangfenmao 2024-08-16 17:41:14 +08:00
parent 1866b00265
commit b8960ef02c
4 changed files with 13 additions and 9 deletions

View File

@ -39,8 +39,8 @@
--color-scrollbar-thumb: rgba(255, 255, 255, 0.15);
--color-scrollbar-thumb-hover: rgba(255, 255, 255, 0.3);
--navbar-background: rgba(30, 30, 30, 0.75);
--sidebar-background: rgba(30, 30, 30, 0.75);
--navbar-background-mac: rgba(30, 30, 30, 0.8);
--navbar-background: rgba(30, 30, 30);
--input-bar-background: rgba(255, 255, 255, 0.02);
--navbar-height: 42px;
@ -88,8 +88,8 @@ body[theme-mode='light'] {
--color-scrollbar-thumb: rgba(0, 0, 0, 0.15);
--color-scrollbar-thumb-hover: rgba(0, 0, 0, 0.3);
--navbar-background: rgba(255, 255, 255, 0.8);
--sidebar-background: rgba(255, 255, 255, 0.8);
--navbar-background-mac: rgba(255, 255, 255, 0.75);
--navbar-background: rgba(255, 255, 255);
--input-bar-background: rgba(0, 0, 0, 0.02);
}

View File

@ -5,9 +5,11 @@ import styled from 'styled-components'
type Props = PropsWithChildren & JSX.IntrinsicElements['div']
const navbarBackgroundColor = isMac ? 'var(--navbar-background-mac)' : 'var(--navbar-background)'
export const Navbar: FC<Props> = ({ children, ...props }) => {
const { minappShow } = useRuntime()
const backgroundColor = minappShow ? 'var(--color-background)' : 'var(--navbar-background)'
const backgroundColor = minappShow ? 'var(--color-background)' : navbarBackgroundColor
return (
<NavbarContainer {...props} style={{ backgroundColor }}>
@ -37,7 +39,7 @@ const NavbarContainer = styled.div`
margin-left: ${isMac ? 'calc(var(--sidebar-width) * -1)' : 0};
padding-left: ${isMac ? 'var(--sidebar-width)' : 0};
border-bottom: 0.5px solid var(--color-border);
background-color: var(--navbar-background);
background-color: ${navbarBackgroundColor};
transition: background-color 0.3s ease;
-webkit-app-region: drag;
`

View File

@ -10,6 +10,8 @@ import styled from 'styled-components'
import UserPopup from '../Popups/UserPopup'
const sidebarBackgroundColor = isMac ? 'var(--navbar-background-mac)' : 'var(--navbar-background)'
const Sidebar: FC = () => {
const { pathname } = useLocation()
const avatar = useAvatar()
@ -22,7 +24,7 @@ const Sidebar: FC = () => {
}
return (
<Container style={{ backgroundColor: minappShow ? 'var(--color-background)' : 'var(--sidebar-background)' }}>
<Container style={{ backgroundColor: minappShow ? 'var(--color-background)' : sidebarBackgroundColor }}>
<AvatarImg src={avatar || Logo} draggable={false} className="dragdisable" onClick={onEditUser} />
<MainMenus>
<Menus>
@ -64,7 +66,7 @@ const Container = styled.div`
-webkit-app-region: drag !important;
border-right: 0.5px solid var(--color-border);
margin-top: ${isMac ? 'var(--navbar-height)' : 0};
background-color: var(--sidebar-background);
background-color: ${sidebarBackgroundColor};
transition: background-color 0.3s ease;
`

View File

@ -43,7 +43,7 @@ const Container = styled.div`
`
const Text = styled.div`
color: var(--color-text-3);
color: var(--color-text-2);
font-size: 12px;
display: -webkit-box;
-webkit-line-clamp: 2;