mirror of
https://github.com/revoltchat/revite.git
synced 2024-12-25 07:02:10 -05:00
Added hamburger and member sidebar icons
This commit is contained in:
parent
eb7b915edb
commit
76f43a4b98
5 changed files with 16 additions and 13 deletions
|
@ -25,6 +25,11 @@ export default styled.div<Props>`
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.menu {
|
||||||
|
margin-inline-end: 8px;
|
||||||
|
color: var(--secondary-foreground);
|
||||||
|
}
|
||||||
|
|
||||||
/*@media only screen and (max-width: 768px) {
|
/*@media only screen and (max-width: 768px) {
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
}*/
|
}*/
|
||||||
|
|
|
@ -335,13 +335,7 @@ function Theme({ children, options }: Props) {
|
||||||
return (
|
return (
|
||||||
<ThemeContext.Provider value={theme}>
|
<ThemeContext.Provider value={theme}>
|
||||||
<Helmet>
|
<Helmet>
|
||||||
<meta
|
<meta name="theme-color" content={theme["background"]}
|
||||||
name="theme-color"
|
|
||||||
content={
|
|
||||||
isTouchscreenDevice
|
|
||||||
? theme["primary-header"]
|
|
||||||
: theme["background"]
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<GlobalTheme theme={theme} />
|
<GlobalTheme theme={theme} />
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { At, Hash } from "@styled-icons/boxicons-regular";
|
import { At, Hash, Menu } from "@styled-icons/boxicons-regular";
|
||||||
import { Notepad, Group } from "@styled-icons/boxicons-solid";
|
import { Notepad, Group } from "@styled-icons/boxicons-solid";
|
||||||
import { Channel, User } from "revolt.js";
|
import { Channel, User } from "revolt.js";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
|
@ -89,6 +89,11 @@ export default function ChannelHeader({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Header placement="primary">
|
<Header placement="primary">
|
||||||
|
{isTouchscreenDevice &&
|
||||||
|
<div className="menu">
|
||||||
|
<Menu size={27} />
|
||||||
|
</div>
|
||||||
|
}
|
||||||
{icon}
|
{icon}
|
||||||
<Info>
|
<Info>
|
||||||
<span className="name">{name}</span>
|
<span className="name">{name}</span>
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
import { Sidebar as SidebarIcon } from "@styled-icons/boxicons-regular";
|
|
||||||
import {
|
import {
|
||||||
UserPlus,
|
UserPlus,
|
||||||
Cog,
|
Cog,
|
||||||
PhoneCall,
|
PhoneCall,
|
||||||
PhoneOutgoing,
|
PhoneOutgoing,
|
||||||
|
Group
|
||||||
} from "@styled-icons/boxicons-solid";
|
} from "@styled-icons/boxicons-solid";
|
||||||
import { useHistory } from "react-router-dom";
|
import { useHistory } from "react-router-dom";
|
||||||
|
|
||||||
|
@ -65,11 +65,10 @@ export default function HeaderActions({
|
||||||
<VoiceActions channel={channel} />
|
<VoiceActions channel={channel} />
|
||||||
{(channel.channel_type === "Group" ||
|
{(channel.channel_type === "Group" ||
|
||||||
channel.channel_type === "TextChannel") &&
|
channel.channel_type === "TextChannel") &&
|
||||||
!isTouchscreenDevice && (
|
|
||||||
<IconButton onClick={toggleSidebar}>
|
<IconButton onClick={toggleSidebar}>
|
||||||
<SidebarIcon size={22} />
|
<Group size={25} />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
)}
|
}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -75,7 +75,7 @@ export function GenericSettings({
|
||||||
content={
|
content={
|
||||||
isTouchscreenDevice
|
isTouchscreenDevice
|
||||||
? theme["primary-header"]
|
? theme["primary-header"]
|
||||||
: theme["secondary-background"]
|
: theme["background"]
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
|
|
Loading…
Reference in a new issue