fix: window navbar layout
This commit is contained in:
parent
7271a86677
commit
f9f5befc59
@ -66,6 +66,9 @@ const Container = styled.div`
|
|||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
margin-right: 3px;
|
margin-right: 3px;
|
||||||
}
|
}
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
const Text = styled.div`
|
const Text = styled.div`
|
||||||
|
|||||||
@ -50,8 +50,8 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant }) => {
|
|||||||
return (
|
return (
|
||||||
<Navbar className="home-navbar">
|
<Navbar className="home-navbar">
|
||||||
{showAssistants && (
|
{showAssistants && (
|
||||||
<NavbarLeft style={{ justifyContent: 'space-between', borderRight: 'none', padding: '0 8px' }}>
|
<NavbarLeft style={{ justifyContent: 'space-between', borderRight: 'none', padding: 0 }}>
|
||||||
<NavbarIcon onClick={toggleShowAssistants} style={{ marginLeft: isMac ? 8 : 0 }}>
|
<NavbarIcon onClick={toggleShowAssistants} style={{ marginLeft: isMac ? 16 : 0 }}>
|
||||||
<i className="iconfont icon-hide-sidebar" />
|
<i className="iconfont icon-hide-sidebar" />
|
||||||
</NavbarIcon>
|
</NavbarIcon>
|
||||||
<NavbarIcon onClick={() => EventEmitter.emit(EVENT_NAMES.ADD_NEW_TOPIC)}>
|
<NavbarIcon onClick={() => EventEmitter.emit(EVENT_NAMES.ADD_NEW_TOPIC)}>
|
||||||
@ -64,9 +64,7 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant }) => {
|
|||||||
className="home-navbar-right">
|
className="home-navbar-right">
|
||||||
<HStack alignItems="center">
|
<HStack alignItems="center">
|
||||||
{!showAssistants && (
|
{!showAssistants && (
|
||||||
<NavbarIcon
|
<NavbarIcon onClick={() => toggleShowAssistants()} style={{ marginRight: 8, marginLeft: isMac ? 4 : -12 }}>
|
||||||
onClick={() => toggleShowAssistants()}
|
|
||||||
style={{ marginRight: isMac ? 8 : 25, marginLeft: isMac ? 4 : 0 }}>
|
|
||||||
<i className="iconfont icon-show-sidebar" />
|
<i className="iconfont icon-show-sidebar" />
|
||||||
</NavbarIcon>
|
</NavbarIcon>
|
||||||
)}
|
)}
|
||||||
@ -79,23 +77,23 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant }) => {
|
|||||||
<SelectModelButton assistant={assistant} />
|
<SelectModelButton assistant={assistant} />
|
||||||
</HStack>
|
</HStack>
|
||||||
<HStack alignItems="center" gap={8}>
|
<HStack alignItems="center" gap={8}>
|
||||||
<NavbarIcon onClick={() => SearchPopup.show()}>
|
<NarrowIcon onClick={() => SearchPopup.show()}>
|
||||||
<SearchOutlined />
|
<SearchOutlined />
|
||||||
</NavbarIcon>
|
</NarrowIcon>
|
||||||
<NarrowIcon onClick={() => dispatch(setNarrowMode(!narrowMode))}>
|
<NarrowIcon onClick={() => dispatch(setNarrowMode(!narrowMode))}>
|
||||||
<i className="iconfont icon-icon-adaptive-width"></i>
|
<i className="iconfont icon-icon-adaptive-width"></i>
|
||||||
</NarrowIcon>
|
</NarrowIcon>
|
||||||
{sidebarIcons.visible.includes('minapp') && (
|
{sidebarIcons.visible.includes('minapp') && (
|
||||||
<AppStorePopover>
|
<AppStorePopover>
|
||||||
<NavbarIcon>
|
<NarrowIcon>
|
||||||
<i className="iconfont icon-appstore" />
|
<i className="iconfont icon-appstore" />
|
||||||
</NavbarIcon>
|
</NarrowIcon>
|
||||||
</AppStorePopover>
|
</AppStorePopover>
|
||||||
)}
|
)}
|
||||||
{topicPosition === 'right' && (
|
{topicPosition === 'right' && (
|
||||||
<NavbarIcon onClick={toggleShowTopics}>
|
<NarrowIcon onClick={toggleShowTopics}>
|
||||||
<i className={`iconfont icon-${showTopics ? 'show' : 'hide'}-sidebar`} />
|
<i className={`iconfont icon-${showTopics ? 'show' : 'hide'}-sidebar`} />
|
||||||
</NavbarIcon>
|
</NarrowIcon>
|
||||||
)}
|
)}
|
||||||
</HStack>
|
</HStack>
|
||||||
</NavbarRight>
|
</NavbarRight>
|
||||||
@ -140,15 +138,15 @@ export const NavbarIcon = styled.div`
|
|||||||
const TitleText = styled.span`
|
const TitleText = styled.span`
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
font-family: Ubuntu;
|
font-family: Ubuntu;
|
||||||
font-size: 13px;
|
font-size: 12px;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 1080px) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
const NarrowIcon = styled(NavbarIcon)`
|
const NarrowIcon = styled(NavbarIcon)`
|
||||||
@media (max-width: 800px) {
|
@media (max-width: 1000px) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user