Wordpress CSS destroy layout from Angular Application-CodePudding

I use a Wordpress website in combination with an Angular application. Unfortunately, the CSS of Wordpress destroys the application. This also affects the material components, for example. My solution so far is to break the CSS files in function.php when retrieving the permalink.

if(is_page('AngularApp')) {

    } else {
        wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css');

    }

Unfortunately, the problem here is that the header and footer say goodbye in style without wordpress CSS ;)

Is there an elegant way to make Angular applications immune to external CSS from websites?

CodePudding user response：

Couple ideas.

You could try and tweak specifity of the rules in your main style.css and/or in stylesheets of the Angular project, ensuring that the Angular ones have higher specificity.

Putting Angular in an iframe should shield it from influence of any foreign stylesheet, though it would probably open several different problems by itself.