HMC/handmade-revolt
2
0
Fork 0
forked from abner/for-legacy-web
Code Pull Requests Actions Activity

Add i18n to incoming requests.

Browse Source 
Add icon stacking mask.
This commit is contained in:
Paul
2021-07-02 18:56:00 +01:00
parent c15a2f1968
commit 73c61cd7f8
6 changed files with 34 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/common/user/UserIcon.tsx
View File

@@ -9,6 +9,7 @@ import { AppContext } from "../../../context/revoltjs/RevoltClient";
type VoiceStatus = "muted";
interface Props extends IconBaseProps<User> {
mask?: string;
status?: boolean;
voice?: VoiceStatus;
}
@@ -52,7 +53,7 @@ import fallback from '../assets/user.png';
export default function UserIcon(props: Props & Omit<JSX.SVGAttributes<SVGSVGElement>, keyof Props>) {
const client = useContext(AppContext);
const { target, attachment, size, voice, status, animate, children, as, ...svgProps } = props;
const { target, attachment, size, voice, status, animate, mask, children, as, ...svgProps } = props;
const iconURL = client.generateFileURL(target?.avatar ?? attachment, { max_side: 256 }, animate)
?? (target ? client.users.getDefaultAvatarURL(target._id) : fallback);
@@ -62,7 +63,7 @@ export default function UserIcon(props: Props & Omit<JSX.SVGAttributes<SVGSVGEle
height={size}
aria-hidden="true"
viewBox="0 0 32 32">
<foreignObject x="0" y="0" width="32" height="32" mask={props.status ? "url(#user)" : undefined}>
<foreignObject x="0" y="0" width="32" height="32" mask={mask ?? (status ? "url(#user)" : undefined)}>
{
<img src={iconURL}
draggable={false} />

4
src/components/ui/Masks.tsx
View File

@@ -12,6 +12,10 @@ export default function Masks() {
<rect x="0" y="0" width="32" height="32" fill="white" />
<circle cx="27" cy="27" r="7" fill={"black"} />
</mask>
<mask id="overlap">
<rect x="0" y="0" width="32" height="32" fill="white" />
<circle cx="32" cy="16" r="18" fill={"black"} />
</mask>
</defs>
</svg>
)