Hello,
I use a custom theme like this example and it works very well.
https://ko.infragistics.com/products/ignite-ui-angular/angular/components/grid/row-editing#import-theme
my css is like this :
Hello Philippe,
I am glad that you find my suggestion helpful.
Thank you for using Infragistics components.
Regards,Riva IvanovaEntry Level Software Developer
Hello Riva,
Thank you for your explanations. I have a better understanding and it works perfectly.
kind regards,
Philippe DUFEIL
Thank you for posting into our community!
I have been looking into you question and after an investigation, I was able to reproduce the described behavior and determined that the reason for the styles not being reflected is due to the igx-grid in the igx-dialog not being descendant of the component host - it is currently displayed in the default overlay outlet, at the end of the document's body.
As mentioned in our Scoped Component Styles topic, when scoping styles for elements that are displayed in the overlay, it is needed to specify the position of the overlay “outlet” in the DOM. CSS rules that are scoped require a specific hierarchical structure of the elements - the overlay content should be displayed in the correct context of the styles.
Having this in mind, what I could suggest is defining custom overlaySettings with defined “outlet” property and providing these settings to the open method of the dialog.
Additionally, in order to demonstrate my suggestion, I have prepared a small sample where I am using the above approach. On my side, everything works as expected and when opening the igx-dialog on button click the igx-grid has custom styles applied.
Please test this approach on your side and let me know if you need any further assistance.
Sincerely,Riva IvanovaEntry Level Software Developer