From 3d316e5a0ad76aafc151e037347f83edf0221d41 Mon Sep 17 00:00:00 2001
From: Regalijan <r@regalijan.com>
Date: Tue, 3 Dec 2024 00:43:18 -0500
Subject: [PATCH] Force dark styles for calendar
---
app/routes/events-calendar.tsx | 2 ++
app/styles/calendar.css | 17 +++++++++++++++++
2 files changed, 19 insertions(+)
create mode 100644 app/styles/calendar.css
diff --git a/app/routes/events-calendar.tsx b/app/routes/events-calendar.tsx
index dff9efb..74c3431 100644
--- a/app/routes/events-calendar.tsx
+++ b/app/routes/events-calendar.tsx
@@ -1,4 +1,5 @@
import calendarStyles from "react-big-calendar/lib/css/react-big-calendar.css";
+import calendarOverrides from "../styles/calendar.css";
import eventStyles from "../styles/events-team.css";
import { Calendar, dayjsLocalizer } from "react-big-calendar";
import dayjs from "dayjs";
@@ -29,6 +30,7 @@ export const links: LinksFunction = () => {
return [
{ href: calendarStyles, rel: "stylesheet" },
{ href: eventStyles, rel: "stylesheet" },
+ { href: calendarOverrides, rel: "stylesheet" },
];
};
diff --git a/app/styles/calendar.css b/app/styles/calendar.css
new file mode 100644
index 0000000..1123861
--- /dev/null
+++ b/app/styles/calendar.css
@@ -0,0 +1,17 @@
+.rbc-show-more {
+ background-color: unset;
+}
+
+@media (prefers-color-scheme: dark) {
+ .rbc-off-range-bg {
+ background: #12161f;
+ }
+
+ .rbc-overlay-header {
+ color: #2d3748;
+ }
+
+ .rbc-today {
+ background-color: #747bff;
+ }
+}