ulysia/Vencord
1
0
Fork 0
Code Pull requests Activity

PlatformIndicators: Fix layout reflows 2: Electric Boogaloo

Browse source
This commit is contained in:
Vendicated 2023-04-30 01:56:03 +02:00
parent d589d22a0b
commit 06cee75a56
No known key found for this signature in database
GPG key ID: A1DC0CFB5615D905
1 changed files with 8 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/plugins/platformIndicators.tsx
View file

@ -22,12 +22,15 @@ import { addDecoration, removeDecoration } from "@api/MessageDecorations";
import { Settings } from "@api/settings"; import { Settings } from "@api/settings";
import ErrorBoundary from "@components/ErrorBoundary"; import ErrorBoundary from "@components/ErrorBoundary";
import { Devs } from "@utils/constants"; import { Devs } from "@utils/constants";
import { classes } from "@utils/misc";
import definePlugin, { OptionType } from "@utils/types"; import definePlugin, { OptionType } from "@utils/types";
import { findByCodeLazy, findStoreLazy } from "@webpack"; import { findByCodeLazy, findByPropsLazy, findLazy, findStoreLazy } from "@webpack";
import { PresenceStore, Tooltip, UserStore } from "@webpack/common"; import { PresenceStore, Tooltip, UserStore } from "@webpack/common";
import { User } from "discord-types/general"; import { User } from "discord-types/general";
const SessionsStore = findStoreLazy("SessionsStore"); const SessionsStore = findStoreLazy("SessionsStore");
const RoleIconClasses = findLazy(m => m.roleIcon && m.clickable && !m.alt);
const RoleIconClasses2 = findByPropsLazy("roleIcon", "alt");
function Icon(path: string, viewBox = "0 0 24 24") { function Icon(path: string, viewBox = "0 0 24 24") {
return ({ color, tooltip }: { color: string; tooltip: string; }) => ( return ({ color, tooltip }: { color: string; tooltip: string; }) => (
@ -39,6 +42,7 @@ function Icon(path: string, viewBox = "0 0 24 24") {
width="20" width="20"
viewBox={viewBox} viewBox={viewBox}
fill={color} fill={color}
className={classes(RoleIconClasses.roleIcon, RoleIconClasses.clickable, RoleIconClasses2.roleIcon)}
> >
<path d={path} /> <path d={path} />
</svg> </svg>
@ -105,18 +109,15 @@ const PlatformIndicator = ({ user, inline = false, marginLeft = "4px" }: { user:
if (!icons.length) return null; if (!icons.length) return null;
return ( return (
<div <span
className="vc-platform-indicator" className="vc-platform-indicator"
style={{ style={{
marginLeft, marginLeft,
gap: "4px", gap: "4px"
display: inline ? "inline-flex" : "flex",
alignItems: "center",
translate: inline ? "0 3px 0" : undefined
}} }}
> >
{icons} {icons}
</div> </span>
); );
}; };