smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: Support exporting with dark mode (#3046)

Browse source 
Co-authored-by: Lipis <lipiridis@gmail.com>
Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Arun 2021-02-24 19:52:17 +05:30 • committed by GitHub
parent d213dbb42d
commit 4e421e6e9e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 264 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/DarkModeToggle.tsx
View file

@ -10,13 +10,18 @@ export type Appearence = "light" | "dark";
export const DarkModeToggle = (props: {
value: Appearence;
onChange: (value: Appearence) => void;
title?: string;
}) => {
const title = props.title
? props.title
: props.value === "dark"
? t("buttons.lightMode")
: t("buttons.darkMode");
return (
<label
className={`ToolIcon ToolIcon_type_floating ToolIcon_size_M`}
title={
props.value === "dark" ? t("buttons.lightMode") : t("buttons.darkMode")
}
title={title}
>
<input
className="ToolIcon_type_checkbox ToolIcon_toggle_opaque"
@ -25,11 +30,7 @@ export const DarkModeToggle = (props: {
props.onChange(event.target.checked ? "dark" : "light")
}
checked={props.value === "dark"}
aria-label={
props.value === "dark"
? t("buttons.lightMode")
: t("buttons.darkMode")
}
aria-label={title}
/>
<div className="ToolIcon__icon">
{props.value === "light" ? ICONS.MOON : ICONS.SUN}