CSS to work on SP Widget Angular ng-template

[xiaix]

So I have an SP Widget, and have some CSS in the dedicated CSS area.

This widget also has an Angular ng-template.

The template can't see the CSS code.  Is this by design?

[Tommy Jensen]

Have you tried to add the css on the page level instead of widget level ?

[xiaix]

I think that this is what I *may* need to do.

It appears that widget CSS only applies to the HTML Template field of a widget, not $uibModal pulled in templates... which I guess makes sense.

[ChrisBurks]

It supposed to be possible by defining a windowClass when defining the uibModal.

...

scope: $scope,
windowClasss: 'my-window-class'

....

[Martin Pavlov]

I have the exact same issue. I have a ng-repeat on an array of images, then when clicking on some image it should open a modal. That modal is an ngTemplate. However the code in the CSS area referred to the modal does not apply to it. Actually, if I write some class referred to the modal, the classes referred to the code in the HTML area (to the ng-repeat) also stop working... @xiaix do you have and progress with that? 

[xiaix]

Nah, all I do now is just add a <style></style> tag at the top of all my ngTemplates:

Anything that's on in the "HTML Template" of the actual widget, then I'll put stuff in the "CSS-SCSS" area. Yeah, it most likely means I'm duplicating CSS elements, but I've gotten so used to it now it's not a big deal (for me).