Hi everyone,
I’m building a custom app within the Nextcloud environment and I want to apply my own styles and themes for UI components. The issue I’m facing is that Nextcloud’s global CSS seems to override or interfere with my styles.
For example, when rendering a simple input field, my custom styles are applied, but additional borders and styles from Nextcloud are also showing up. I inspected the source and found that these styles are coming from core/css/inputs.scss in
the Nextcloud core. It seems like the global styles are targeting standard HTML elements like <input>
, which affects everything across all apps.
This isn’t just limited to inputs—many other elements are also picking up unwanted styles from the global CSS. I’m trying to find a way to isolate my app’s styles from the rest of the Nextcloud environment, ideally without having to constantly override or reset everything element by element.
Is there a recommended way to scope or isolate styles in a Nextcloud app so they don’t inherit from the global Nextcloud styles?