[]
ActiveReportsJS download package, CDN distribution and @grapecity/activereports npm package includes the following CSS files that are used to set up the appearance of ActiveReportsJS Designer component:
In order to use the default, "dark yellow", "green", or "light blue" theme of Designer component, the corresponding css styles should be imported to the application. In pure JavaScript application it can be done by using link
tags, for example:
<link
rel="stylesheet"
href="https://cdn.grapecity.com/activereportsjs/2.latest/styles/ar-js-ui.css"
type="text/css"
/>
<link
rel="stylesheet"
href="https://cdn.grapecity.com/activereportsjs/2.latest/styles/ar-js-designer.css"
type="text/css"
/>
In applications that support CSS loaders, you can import these styles can with an import
statement, for example:
import "@grapecity/activereports/styles/light-blue-ui.css";
import "@grapecity/activereports/styles/light-blue-designer.css";
You can also generate a custom color theme for the ActiveReportsJS Report Designer component:
ar-js-ui.css
, ar-js-designer.css
, and ar-js-viewer.css
. You can use the first two files exactly as described above. The third file is the style for the viewer component.