3rd option to override css in a component with Shadow Dom

camptocamp · Nov 16, 2021 · 54e03bc · 54e03bc
1 parent c301cee
commit 54e03bc
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/geoportal/geomapfish_geoportal/static-ngeo/js/apps/Controllerdesktop_alt.js b/geoportal/geomapfish_geoportal/static-ngeo/js/apps/Controllerdesktop_alt.js
@@ -67,6 +67,12 @@ class Controller extends AbstractDesktopController {
 
     const drawLidarprofilePanelActive = new ngeoMiscToolActivate(this, 'drawLidarprofilePanelActive');
     this.ngeoToolActivateMgr.registerTool('mapTools', drawLidarprofilePanelActive, false);
+
+    // CUSTOM Override style in the Shadow DOM scope.
+    const style = document.createElement( 'style' )
+    style.innerHTML = 'strong { color: darkblue; }'
+    const demoAuthPanel = document.querySelector('demo-auth-panel').shadowRoot;
+    demoAuthPanel.querySelector('gmf-auth-form').shadowRoot.appendChild(style);
   }
 
   /**