feat(Darkmode): add Darkmode

This commit is contained in:
0ry5 2024-09-13 21:28:03 +02:00
parent 04d9b86419
commit 2016a8619d
11 changed files with 216 additions and 159 deletions
frontend/src/pages/Library/components

View file

@ -2,7 +2,8 @@ import { Badge, Dropdown } from "react-bootstrap";
import { Book } from "../../../types/Book";
import { ImBin, ImBook, ImBoxAdd, ImBoxRemove, ImMenu } from "react-icons/im";
import { useMutation } from "@tanstack/react-query";
import { secondary } from "../../../colors";
import * as colors from "../../../colors";
import * as dark from "../../../darkmodeColors";
import { ModalContextType } from "../../../App";
import { modalTypes } from "../../../shared/components/modals/types";
import { useCallback } from "react";
@ -44,11 +45,7 @@ export const Actions = ({
return (
<>
<Dropdown>
<Dropdown.Toggle
variant='success'
id='dropdown-basic'
style={{ backgroundColor: secondary, border: "2px solid black" }}
>
<Dropdown.Toggle variant='success' id='dropdown-basic'>
<ImMenu size={25} color='black' />
</Dropdown.Toggle>
@ -59,14 +56,7 @@ export const Actions = ({
className='d-flex'
onClick={() => setActiveModal({ type: bookModal, book, onClose })}
>
<Badge
pill
className='ml-2 d-flex mr-2'
style={{
border: "2px solid black",
backgroundColor: "transparent",
}}
>
<Badge pill className='ml-2 d-flex mr-2'>
<ImBook size={25} color='black' className='m-auto' />
</Badge>
<p className='m-auto' style={{ paddingLeft: "10px" }}>
@ -87,13 +77,7 @@ export const Actions = ({
})
}
>
<Badge
pill
className='ml-2 d-flex mr-2'
style={{
border: "2px solid black",
}}
>
<Badge pill className='ml-2 d-flex mr-2'>
<ImBoxRemove size={25} color='black' className='m-auto' />
</Badge>{" "}
<p className='m-auto' style={{ paddingLeft: "10px" }}>
@ -130,13 +114,7 @@ export const Actions = ({
setActiveModal({ type: del, uuid: book.uuid, onClose })
}
>
<Badge
pill
className='ml-2 d-flex danger mr-2'
style={{
border: "2px solid black",
}}
>
<Badge pill className='ml-2 d-flex danger mr-2'>
<ImBin size={25} color='black' className='m-auto' />
</Badge>{" "}
<p className='m-auto' style={{ paddingLeft: "10px" }}>