renati/music-repo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Remove dark mode

Browse Source
This commit is contained in:
Szymon Nowakowski
2024-12-01 10:21:11 +01:00
parent 2e3f90de19
commit 80e1f50acc
5 changed files with 9 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/frontend/index.html
View File

@@ -1,5 +1,5 @@
<!doctype html>
<html lang="pl" class="w-full h-full overflow-hidden dark:bg-stone-900 dark:text-white">
<html lang="pl" class="w-full h-full overflow-hidden">
<head>
<meta charset="utf-8">
<title>Repozytorium muzyczne</title>

2
packages/frontend/src/routes/Attachment.tsx
View File

@@ -60,7 +60,7 @@ export const Attachment = lazy(async () => {
</div>
}
return <div ref={containerRef} className="w-full h-full overflow-scroll sheet-music-display" />;
return <div ref={containerRef} className="w-full h-full overflow-scroll" />;
},
};
});

14
packages/frontend/src/style.css
View File

@@ -1,17 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
.sheet-music-display * {
color: black;
stroke: black;
fill: black;
}
@media (prefers-color-scheme: dark) {
.sheet-music-display * {
color: white;
stroke: white;
fill: white;
}
}

34
packages/frontend/src/styled/Button.tsx
View File

@@ -1,41 +1,17 @@
import { ButtonHTMLAttributes, DetailedHTMLProps } from "react";
import { ButtonHTMLAttributes, DetailedHTMLProps, forwardRef } from "react";
export namespace Button {
export type Props = Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "className">;
}
export function Button({ children, ...props }: Button.Props) {
export const Button = forwardRef<HTMLButtonElement, Button.Props>(function Button({ children, ...props }, ref) {
return (
<button
{...props}
className="
p-2
bg-stone-300
border-2
border-t-stone-200
border-l-stone-200
border-r-stone-600
border-b-stone-600
active:border-t-stone-600
active:border-l-stone-600
active:border-r-stone-200
active:border-b-stone-200
rounded
focus:outline
focus:outline-2
focus:outline-red-500
dark:bg-stone-700
dark:border-t-stone-600
dark:border-l-stone-600
dark:border-r-stone-900
dark:border-b-stone-900
dark:active:border-t-stone-900
dark:active:border-l-stone-900
dark:active:border-r-stone-600
dark:active:border-b-stone-600
"
ref={ref}
className="p-2 bg-stone-300 border-2 border-t-stone-200 border-l-stone-200 border-r-stone-600 border-b-stone-600 active:border-t-stone-600 active:border-l-stone-600 active:border-r-stone-200 active:border-b-stone-200 rounded focus:outline focus:outline-2 focus:outline-red-500"
>
{children}
</button>
);
}
});

15
packages/frontend/src/styled/Input.tsx
View File

@@ -4,23 +4,12 @@ export namespace Input {
export type Props = Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "className">;
}
export const Input = forwardRef<HTMLInputElement, Input.Props>(function Input({ children, ...props }: Input.Props, ref) {
export const Input = forwardRef<HTMLInputElement, Input.Props>(function Input({ children, ...props }, ref) {
return (
<input
{...props}
ref={ref}
className="
w-[32ch]
p-2
bg-transparent
border
border-black
rounded
focus:outline
focus:outline-2
focus:outline-red-500
dark:border-white
"
className="w-[32ch] p-2 bg-transparent border rounded focus:outline focus:outline-2 focus:outline-red-500"
>
{children}
</input>