Fix map ui being unreadable on dark mode farmOS#642

paul121 · Feb 20, 2023 · b304bff · b304bff
1 parent 18599f8
commit b304bff
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - [Convert geometry values to WKT in GeofieldWidget #640](https://github.com/farmOS/farmOS/pull/640)
+- [Fix map ui being unreadable on dark mode #642](https://github.com/farmOS/farmOS/pull/642)
 
 ## [2.0.1] 2023-02-08
 

diff --git a/modules/core/ui/theme/css/map.css b/modules/core/ui/theme/css/map.css
@@ -17,3 +17,15 @@ buttons from covering up the :focus box-shadow. A position is required. */
   box-shadow: 0 0 0 2px var(--colorGinLayerBackground), 0 0 0 4px var(--colorGinFocus);
   -webkit-box-shadow: 0 0 0 2px var(--colorGinLayerBackground), 0 0 0 4px var(--colorGinFocus);
 }
+
+/* Adjust map ui elements background colors for the Gin theme dark mode. */
+.gin--dark-mode .farm-map .ol-control,
+.gin--dark-mode .farm-map .ol-scale-line {
+  background-color: rgba(var(--gin-bg-app-rgb), .25);
+}
+.gin--dark-mode .farm-map .ol-control:hover {
+  background-color: rgba(var(--gin-bg-app-rgb), .6);
+}
+.gin--dark-mode .farm-map .ol-control button {
+  background-color: rgba(var(--gin-bg-app-rgb), .8);
+}