Cannot Apply Custom frappe-theme on Doppio-based Frontend

Hi Frappe team and community,

I’m currently developing a custom frappe-theme app to customize the button colors and general styles in my ERPNext/Frappe project. The theme works well on the standard Frappe frontend pages (like Desk, Login, etc.), and I can see the color changes applied correctly.

However, I’m also working with a frontend that is developed using Doppio, a different frontend UI environment. I cloned this Doppio-based UI from another Git repository. The issue is:

My custom frappe-theme does not affect any styles or buttons in the Doppio frontend.
It only works with the default Frappe UI components.


What I’ve tried:

  • Created and installed the frappe-theme app via bench get-app
  • Added the app in sites/apps.txt and in the main apps.txt
  • Ran bench build, bench restart, bench clear-cache
  • Verified that styles apply to Frappe’s default interface
  • Checked if Doppio uses shadow DOM or isolated CSS

My Questions:

  1. Is there a way to make frappe-theme compatible with frontend apps built using Doppio?
  2. Does Doppio render its UI separately from Frappe’s templating system (thus ignoring theme overrides)?
  3. Are there best practices or hooks to extend/override styles in custom frontend environments like Doppio?
  4. Do I need to inject the theme CSS manually or use a different approach when dealing with custom frontends?

Any suggestions or guidance would be really appreciated. Thanks in advance!

— Yam_FBT