cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-12-24 06:32:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Fix: small fixes to friends menu

Browse source
This commit is contained in:
nizune 2021-07-02 11:13:54 +02:00
parent 6aa8c5c0ba
commit 9c2a769bbd
3 changed files with 30 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/pages/friends/Friend.module.scss
View file

@ -1,10 +1,15 @@
.list { .list {
padding: 16px; padding: 0 20px 20px 20px;
user-select: none; user-select: none;
overflow-y: scroll; overflow-y: scroll;
.overline { .overline {
display: flex; display: flex;
position: sticky;
top: 0;
background: var(--primary-background);
padding: 8px 0;
z-index: 10;
} }
&[data-empty="true"] { &[data-empty="true"] {
@ -67,7 +72,7 @@
display: flex; display: flex;
gap: 12px; gap: 12px;
> div { > a {
height: 40px; height: 40px;
width: 40px; width: 40px;

20
src/pages/friends/Friend.tsx
View file

@ -29,18 +29,18 @@ export function Friend({ user }: Props) {
subtext = <UserStatus user={user} /> subtext = <UserStatus user={user} />
actions.push( actions.push(
<> <>
<IconButton type="circle" <Link to={'/open/' + user._id}>
onClick={stopPropagation}> <IconButton type="circle"
<Link to={'/open/' + user._id}> onClick={stopPropagation}>
<PhoneCall size={20} /> <PhoneCall size={20} />
</Link> </IconButton>
</IconButton> </Link>
<IconButton type="circle" <Link to={'/open/' + user._id}>
onClick={stopPropagation}> <IconButton type="circle"
<Link to={'/open/' + user._id}> onClick={stopPropagation}>
<Envelope size={20} /> <Envelope size={20} />
</Link> </IconButton>
</IconButton> </Link>
</> </>
); );
} }

25
src/pages/friends/Friends.tsx
View file

@ -1,5 +1,5 @@
import styles from "./Friend.module.scss"; import styles from "./Friend.module.scss";
import { UserPlus } from "@styled-icons/boxicons-regular"; import { Conversation, UserPlus } from "@styled-icons/boxicons-solid";
import { Friend } from "./Friend"; import { Friend } from "./Friend";
import { Text } from "preact-i18n"; import { Text } from "preact-i18n";
@ -34,11 +34,12 @@ export default function Friends() {
<div className={styles.title}> <div className={styles.title}>
<Text id="app.navigation.tabs.friends" /> <Text id="app.navigation.tabs.friends" />
</div> </div>
<div className="actions"> <IconButton onClick={() => openScreen({ id: 'special_input', type: 'add_friend' })}> {/* TOFIX: Make sure this opens the "Start Group DM" window on click */}
<IconButton onClick={() => openScreen({ id: 'special_input', type: 'add_friend' })}> <Conversation size={24} />
<UserPlus size={24} /> </IconButton>
</IconButton> <IconButton onClick={() => openScreen({ id: 'special_input', type: 'add_friend' })}>
</div> <UserPlus size={24} />
</IconButton>
</Header> </Header>
<div <div
className={styles.list} className={styles.list}
@ -53,8 +54,8 @@ export default function Friends() {
</> </>
)} )}
{pending.length > 0 && ( {pending.length > 0 && (
<Overline type="subtle"> <Overline className={styles.overline} type="subtle">
<Text id="app.special.friends.pending" /> –{" "} <Text id="app.special.friends.pending" /> —{" "}
{pending.length} {pending.length}
</Overline> </Overline>
)} )}
@ -62,8 +63,8 @@ export default function Friends() {
<Friend key={y._id} user={y} /> <Friend key={y._id} user={y} />
))} ))}
{friends.length > 0 && ( {friends.length > 0 && (
<Overline type="subtle"> <Overline className={styles.overline} type="subtle">
<Text id="app.navigation.tabs.friends" /> –{" "} <Text id="app.navigation.tabs.friends" /> —{" "}
{friends.length} {friends.length}
</Overline> </Overline>
)} )}
@ -71,8 +72,8 @@ export default function Friends() {
<Friend key={y._id} user={y} /> <Friend key={y._id} user={y} />
))} ))}
{blocked.length > 0 && ( {blocked.length > 0 && (
<Overline type="subtle"> <Overline className={styles.overline} type="subtle">
<Text id="app.special.friends.blocked" /> –{" "} <Text id="app.special.friends.blocked" /> —{" "}
{blocked.length} {blocked.length}
</Overline> </Overline>
)} )}