System-End/Vencord
1
0
Fork 0
mirror of https://github.com/System-End/Vencord.git synced 2026-04-19 20:55:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix regression that broke some ui spacing

Browse source
This commit is contained in:
Vendicated 2025-11-25 17:37:58 +01:00
parent a824452333
commit 5f1a4db7e1
No known key found for this signature in database
GPG key ID: D66986BAF75ECF18
12 changed files with 16 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/Flex.tsx
View file

@ -23,9 +23,10 @@ export interface FlexProps extends HTMLAttributes<HTMLDivElement> {
gap?: CSSProperties["gap"];
justifyContent?: CSSProperties["justifyContent"];
alignItems?: CSSProperties["alignItems"];
flexWrap?: CSSProperties["flexWrap"];
}
export function Flex({ flexDirection, gap = "1em", justifyContent, alignItems, children, style, ...restProps }: FlexProps) {
export function Flex({ flexDirection, gap = "1em", justifyContent, alignItems, flexWrap, children, style, ...restProps }: FlexProps) {
style ??= {};
Object.assign(style, {
display: "flex",
@ -33,6 +34,7 @@ export function Flex({ flexDirection, gap = "1em", justifyContent, alignItems, c
gap,
justifyContent,
alignItems,
flexWrap
});
return (

2
src/components/settings/tabs/themes/ThemeCard.tsx
View file

@ -35,7 +35,7 @@ export function ThemeCard({ theme, enabled, onChange, onDelete }: ThemeCardProps
)
}
footer={
<Flex flexDirection="row" style={{ gap: "0.2em" }}>
<Flex flexDirection="row" gap="0.2em">
{!!theme.website && <Link href={theme.website}>Website</Link>}
{!!(theme.website && theme.invite) && " • "}
{!!theme.invite && (

4
src/plugins/_api/badges/index.tsx
View file

@ -213,7 +213,7 @@ export default definePlugin({
margin: 0
}}
>
<Flex style={{ justifyContent: "center", alignItems: "center", gap: "0.5em" }}>
<Flex justifyContent="center" alignItems="center" gap="0.5em">
<Heart />
Vencord Donor
</Flex>
@ -244,7 +244,7 @@ export default definePlugin({
</div>
</ModalContent>
<ModalFooter>
<Flex style={{ width: "100%", justifyContent: "center" }}>
<Flex justifyContent="center" style={{ width: "100%" }}>
<DonateButton />
</Flex>
</ModalFooter>

2
src/plugins/customRPC/index.tsx
View file

@ -255,7 +255,7 @@ export default definePlugin({
</ErrorCard>
)}
<Flex flexDirection="column" style={{ gap: ".5em" }} className={Margins.top16}>
<Flex flexDirection="column" gap=".5em" className={Margins.top16}>
<Forms.FormText>
Go to the <Link href="https://discord.com/developers/applications">Discord Developer Portal</Link> to create an application and
get the application ID.

2
src/plugins/decor/ui/components/DecorSection.tsx
View file

@ -35,7 +35,7 @@ export default function DecorSection({ hideTitle = false, hideDivider = false, n
hideDivider={hideDivider}
className={noMargin && cl("section-remove-margin")}
>
<Flex style={{ gap: "4px " }}>
<Flex gap="4px">
<Button
onClick={() => {
if (!authorization.isAuthorized()) {

2
src/plugins/decor/ui/modals/GuidelinesModal.tsx
View file

@ -42,7 +42,7 @@ function GuidelinesModal(props: ModalProps) {
</Forms.FormText>
</ModalContent>
<ModalFooter className={cl("modal-footer")}>
<Flex style={{ gap: "4px" }}>
<Flex gap="4px">
<Button
onClick={() => {
settings.store.agreedToGuidelines = true;

2
src/plugins/permissionsViewer/components/RolesAndUsersPermissions.tsx
View file

@ -164,7 +164,7 @@ function RolesAndUsersPermissionsComponent({ permissions, guild, modalProps, hea
: permission.type === PermissionType.User
? (user != null && getUniqueUsername(user)) ?? "Unknown User"
: (
<Flex style={{ gap: "0.2em", justifyItems: "center" }}>
<Flex gap="0.2em">
@owner
<OwnerCrownIcon height={18} width={18} aria-hidden="true" />
</Flex>

4
src/plugins/reverseImageSearch/index.tsx
View file

@ -51,7 +51,7 @@ function makeSearchItem(src: string) {
key={key}
id={key}
label={
<Flex style={{ alignItems: "center", gap: "0.5em" }}>
<Flex alignItems="center" gap="0.5em">
<img
style={{
borderRadius: "50%",
@ -72,7 +72,7 @@ function makeSearchItem(src: string) {
key="search-image-all"
id="search-image-all"
label={
<Flex style={{ alignItems: "center", gap: "0.5em" }}>
<Flex alignItems="center" gap="0.5em">
<OpenExternalIcon height={16} width={16} />
All
</Flex>

5
src/plugins/showConnections/index.tsx
View file

@ -88,10 +88,7 @@ function ConnectionsComponent({ id, theme }: { id: string, theme: string; }) {
return null;
return (
<Flex style={{
gap: getSpacingPx(settings.store.iconSpacing),
flexWrap: "wrap"
}}>
<Flex gap={getSpacingPx(settings.store.iconSpacing)} flexWrap="wrap">
{connections.map(connection => <CompactConnectionComponent connection={connection} theme={theme} key={connection.id} />)}
</Flex>
);

2
src/plugins/spotifyControls/PlayerComponent.tsx
View file

@ -124,7 +124,7 @@ function Controls() {
// the 1 is using position absolute so it does not make the button jump around
return (
<Flex className={cl("button-row")} style={{ gap: 0 }}>
<Flex className={cl("button-row")} gap="0">
<Button
className={classes(cl("button"), cl("shuffle"), cl(shuffle ? "shuffle-on" : "shuffle-off"))}
onClick={() => SpotifyStore.setShuffle(!shuffle)}

2
src/plugins/startupTimings/StartupTimingPage.tsx
View file

@ -121,7 +121,7 @@ function ServerTrace({ trace }: ServerTraceProps) {
<section>
<Forms.FormTitle tag="h3">Server Trace</Forms.FormTitle>
<code>
<Flex flexDirection="column" style={{ color: "var(--header-primary)", gap: 5, userSelect: "text" }}>
<Flex flexDirection="column" gap="5px" style={{ color: "var(--header-primary)", userSelect: "text" }}>
{lines.map((line, idx) => (
<span key={idx}>{line}</span>
))}

2
src/plugins/textReplace/index.tsx
View file

@ -143,7 +143,7 @@ function TextReplace({ title, rulesArray }: TextReplaceProps) {
{
rulesArray.map((rule, index) =>
<React.Fragment key={`${rule.find}-${index}`}>
<Flex flexDirection="row" style={{ flexGrow: 1, gap: "0.5em" }}>
<Flex gap="0.5em" flexDirection="row" style={{ flexGrow: 1 }}>
<Input
placeholder="Find"
initialValue={rule.find}