Set display: none instead of visibility: hidden to reduce wasted space

This commit is contained in:
Regalijan 2023-10-20 23:33:00 -04:00
parent 7df177d75c
commit 53f5b0a3a2
Signed by: regalijan
GPG Key ID: 5D4196DA269EF520

View File

@ -13,7 +13,7 @@ import {
Stack, Stack,
Text, Text,
useToast, useToast,
VStack, VStack
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { useState } from "react"; import { useState } from "react";
@ -26,7 +26,7 @@ export default function (props: ReportCardProps) {
for (let i = 0; i < props.target_ids.length; i++) for (let i = 0; i < props.target_ids.length; i++)
Object.defineProperty(targetMap, props.target_ids[i], { Object.defineProperty(targetMap, props.target_ids[i], {
value: props.target_usernames[i], value: props.target_usernames[i]
}); });
async function submitActions() { async function submitActions() {
@ -34,9 +34,9 @@ export default function (props: ReportCardProps) {
const submitReq = await fetch(`/api/reports/${props.id}/action`, { const submitReq = await fetch(`/api/reports/${props.id}/action`, {
body: JSON.stringify(actionMap), body: JSON.stringify(actionMap),
headers: { headers: {
"content-type": "application/json", "content-type": "application/json"
}, },
method: "POST", method: "POST"
}); });
if (!submitReq.ok) { if (!submitReq.ok) {
@ -44,7 +44,7 @@ export default function (props: ReportCardProps) {
toast({ toast({
description: ((await submitReq.json()) as { error: string }).error, description: ((await submitReq.json()) as { error: string }).error,
status: "error", status: "error",
title: "S̸̯̜̈́o̴̳̅̾̏̽m̴͔͕̈́̋ē̴̙͓̯̍̃ț̸͖̘̀h̶̛̳̝̐i̵̋͘͜ņ̷̙̤͌g̴̭̻̓̈́ ̴̘͍̦̪̆w̸̡̏̑̊é̸̠̖̹̂͜n̴̖̳̤̕t̴͚̊̊̕ ̸̛͙̺̬̎́w̴͈͑̋͊r̷̢̛o̵̱̩̍͋ͅṇ̸̝̰̮́g̵̡̢̦͕͂", title: "S̸̯̜̈́o̴̳̅̾̏̽m̴͔͕̈́̋ē̴̙͓̯̍̃ț̸͖̘̀h̶̛̳̝̐i̵̋͘͜ņ̷̙̤͌g̴̭̻̓̈́ ̴̘͍̦̪̆w̸̡̏̑̊é̸̠̖̹̂͜n̴̖̳̤̕t̴͚̊̊̕ ̸̛͙̺̬̎́w̴͈͑̋͊r̷̢̛o̵̱̩̍͋ͅṇ̸̝̰̮́g̵̡̢̦͕͂"
}); });
return; return;
@ -53,7 +53,7 @@ export default function (props: ReportCardProps) {
toast({ toast({
description: "Actions were successfully applied", description: "Actions were successfully applied",
status: "success", status: "success",
title: "Success", title: "Success"
}); });
setLoading(false); setLoading(false);
location.reload(); location.reload();
@ -130,7 +130,7 @@ export default function (props: ReportCardProps) {
<br /> <br />
<Text my="16px">{props.description}</Text> <Text my="16px">{props.description}</Text>
</CardBody> </CardBody>
<CardFooter visibility={props.open ? "visible" : "hidden"}> <CardFooter display={props.open ? undefined : "none"}>
<Stack direction="column" gap="16px"> <Stack direction="column" gap="16px">
{(function() { {(function() {
const radioGroups = []; const radioGroups = [];
@ -154,7 +154,7 @@ export default function (props: ReportCardProps) {
Ban Ban
</Radio> </Radio>
</VStack> </VStack>
</RadioGroup>, </RadioGroup>
); );
} }