Issue #3187592 by paul121: Style the map to match the Gin theme

modules/ui/theme/css/map.css

@@ -0,0 +1,19 @@
+/* Set text color of map control buttons to match SVG color. */
+.farm-map .ol-control button {
+  color: var(--colorGinPrimary);
+}
+
+/* Move map buttons to the top when focused. Prevents surrounding control
+buttons from covering up the :focus box-shadow. A position is required. */
+.farm-map button:focus {
+  position: relative;
+  z-index: 1000;
+}
+
+/* Override the geocoder input to work with Gin :focus bos-shadow. */
+.farm-map input#gcd-input-query {
+  height: 1.75em;
+  top: 0.5em;
+  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);
+}

modules/ui/theme/farm_ui_theme.libraries.yml

@@ -1,12 +1,16 @@
-toolbar:
-  css:
-    theme:
-      css/toolbar.css: {}
-footer:
-  css:
-    theme:
-      css/footer.css: {}
 flag:
   css:
     theme:
-      css/flag.css: {}
+      css/flag.css: { }
+footer:
+  css:
+    theme:
+      css/footer.css: { }
+map:
+  css:
+    theme:
+      css/map.css: { }
+toolbar:
+  css:
+    theme:
+      css/toolbar.css: { }

modules/ui/theme/farm_ui_theme.module

@@ -7,6 +7,15 @@
 
 use Drupal\Core\Block\BlockPluginInterface;
 
+/**
+ * Implements hook_element_info_alter().
+ */
+function farm_ui_theme_element_info_alter(array &$info) {
+  if (isset($info['farm_map'])) {
+    $info['farm_map']['#attached']['library'][] = 'farm_ui_theme/map';
+  }
+}
+
 /**
  * Implements hook_preprocess_HOOK().
  */