I am on AG 12.3 and IG 12.3.
Some users (and I agree) have complained that the controls are too big and taking up valuable real estate for data viewability and analysis. My suggestion so far has been to use the browser's zoom capability and reload, but there must be a better way.
My assumption is that we can have a series of dropdowns filled with browser scale (or a different set of scaling values) and have that applied to different components (input controls, chart components, spreadsheet components, and data-grid components) based on user selection.
Please let me know how this can be accomplished. I assume it should be relatively easy to apply at an application level.
I am using CSS, not SCSS.
Hello,I have been looking into your question, however, since we do not provide a zoom component out of the box, the required functionality should be handled entirely on the application level.
I have prepared a small sample in order to demonstrate how the browser zoom could be changed on a button's click, however, it is possible to have some differences depending on the browser.
Please keep in mind since this requirement is not related to igniteui-angular library, it could be considered beyond the scope of Infragistics support and as I previously mentioned should be handled on application level.
Also, a discussion that you might consider helpful could be found here.
In addition, depending on your requirement you could use igx-select (or some other component) instead of buttons and handle its selectionChanging event. More about our components and links to API could be found in our Angular documentation here.Let me know if I may be of any further assistance.Sincerely,Teodosia HristodorovaSoftware Developer
I respectfully disagree.
While I appreciate the literal implementation of browser scaling, my request was for scaling of component types separately in the event that a user prefers smaller controls and a larger font size in the data grid or bigger controls and a smaller cell size in a spreadsheet component.
Since IG overrides everything in both Bootstrap and Angular Material (both of which are pulled in), I believe it's your responsibility to furnish how they might be properly scaled as IG components.
I would assume you can provide the CSS attributes (with proper object/class hierarchy) for each of the components previously listed and their starting values and I can figure out proper scaling from that.
Hello,
I have discussed the required behavior with our engineers and the best suggestion is to use the components' display density. It could be changed per component or all igniteui-angular components within the application.
If this is not accurate for your requirement and since we do not expose CSS properties to set the grid size or the font size of its elements, my suggestion is to submit a new feature request in our GitHub repository here.Any concerns or questions that you have can be directly addressed there, which will give you the opportunity to directly communicate with our development team.Let me know if I may be of any further assistance.
Sincerely,Teodosia HristodorovaSoftware Developer