regalijan/car-crushers-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move tools entirely to button popover on top

Browse Source
This commit is contained in:
Regalijan 2023-11-07 13:45:02 -05:00
parent cc3c4afa68
commit dada8af869
Signed by: regalijan
GPG Key ID: 5D4196DA269EF520
2 changed files with 4 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
app/routes/mod-queue.tsx
View File

@ -19,7 +19,6 @@ import {
useToast, useToast,
VStack, VStack,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import stylesheet from "../styles/mod-queue.css";
import { import {
type MutableRefObject, type MutableRefObject,
type ReactNode, type ReactNode,
@ -27,7 +26,6 @@ import {
useRef, useRef,
useState, useState,
} from "react"; } from "react";
import { LinksFunction } from "@remix-run/cloudflare";
import { useLoaderData } from "@remix-run/react"; import { useLoaderData } from "@remix-run/react";
import AppealBans from "../../components/AppealBans.js"; import AppealBans from "../../components/AppealBans.js";
import AppealCard from "../../components/AppealCard.js"; import AppealCard from "../../components/AppealCard.js";
@ -38,10 +36,6 @@ import ReportCard from "../../components/ReportCard.js";
import NewInactivityNotice from "../../components/NewInactivityNotice.js"; import NewInactivityNotice from "../../components/NewInactivityNotice.js";
import InactivityNoticeCard from "../../components/InactivityNoticeCard.js"; import InactivityNoticeCard from "../../components/InactivityNoticeCard.js";
export const links: LinksFunction = () => {
return [{ href: stylesheet, rel: "stylesheet" }];
};
export async function loader({ context }: { context: RequestContext }) { export async function loader({ context }: { context: RequestContext }) {
const { current_user: currentUser } = context.data; const { current_user: currentUser } = context.data;
@ -412,7 +406,10 @@ export default function () {
<Flex> <Flex>
<VStack w={isDesktop ? "container.md" : "container.lg"}> <VStack w={isDesktop ? "container.md" : "container.lg"}>
<Box display={isDesktop ? "none" : undefined} mb="16px" w="90%"> <Box display={isDesktop ? "none" : undefined} mb="16px" w="90%">
<HStack>
{ItemDisplay} {ItemDisplay}
{ToolsContent}
</HStack>
</Box> </Box>
{entries.length ? ( {entries.length ? (
entries.map((entry) => entry.element) entries.map((entry) => entry.element)
@ -459,29 +456,6 @@ export default function () {
</HStack> </HStack>
</Box> </Box>
</Flex> </Flex>
<Popover id="mod-tools" placement="top-end">
<PopoverTrigger>
<Button
borderRadius="50%"
bottom="10vh"
h="16"
position="absolute"
right="10vh"
w="16"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="32"
height="32"
fill="currentColor"
viewBox="0 0 16 16"
>
<path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
</svg>
</Button>
</PopoverTrigger>
{ToolsContent}
</Popover>
</Container> </Container>
); );
} }

5
app/styles/mod-queue.css
View File

@ -1,5 +0,0 @@
@media (max-width: 1280px) {
#mod-tools {
display: none;
}
}