From 93dfe2be64e8658839bcfe5356adf35f8cde7075 Mon Sep 17 00:00:00 2001
From: Nicolas James <Eele1Ephe7uZahRie@tutanota.com>
Date: Thu, 13 Feb 2025 18:04:18 +1100
Subject: initial commit

---
 src/web/components/darken/Darken.css | 14 ++++++++++++++
 src/web/components/darken/Darken.jsx | 13 +++++++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 src/web/components/darken/Darken.css
 create mode 100644 src/web/components/darken/Darken.jsx

(limited to 'src/web/components/darken')

diff --git a/src/web/components/darken/Darken.css b/src/web/components/darken/Darken.css
new file mode 100644
index 0000000..bd3b151
--- /dev/null
+++ b/src/web/components/darken/Darken.css
@@ -0,0 +1,14 @@
+.darken {
+    visibility: hidden;
+
+    position: fixed;
+    inset: 0;
+
+    background-color: rgba(0, 0, 0, 0.0);
+    cursor: pointer;
+    transition: background-color var(--transition-time) ease-in-out;
+}
+.darkenActive {
+    visibility: initial;
+    background-color: rgba(0, 0, 0, 0.5);
+}
\ No newline at end of file
diff --git a/src/web/components/darken/Darken.jsx b/src/web/components/darken/Darken.jsx
new file mode 100644
index 0000000..7f46365
--- /dev/null
+++ b/src/web/components/darken/Darken.jsx
@@ -0,0 +1,13 @@
+import React from "react";
+import styles from "./Darken.css";
+
+export default function Darken({active, className, ...others}) {
+
+    return (
+        <div 
+            className={styles.darken
+                + (active ? " " + styles.darkenActive : "")
+                + (className ? " " + className : "")}
+            {...others} />
+    );
+}
\ No newline at end of file
-- 
cgit v1.2.3