Integrate Topledger dashboards
Our new React dashboard, With a simple and easy-to-customize user interface to seamlessly blend into your existing layout, can be integrated easily on any platform.
Last updated
Our new React dashboard, With a simple and easy-to-customize user interface to seamlessly blend into your existing layout, can be integrated easily on any platform.
Last updated
tl-dashboards
is a npm package for integrating customized dashboards on front-end.
react (>=16.8.0
)
react-dom (>=16.8.0
)
public/fonts
directoryfontawesome-webfont.woff2:
Material-Design-Iconic-Font.woff2:
The public font directory should look like this:
You can use render the dashboard component anywhere inside react dom.
You can follow the basic example given below:
Below classes refer to different elements in dashboard component. You can add style to change the background, border, etc.
.public-dashboard-page
Refers to the main component container div.
.widget-visualization
Refers to the widget component container div. You can add style to change the background, border, etc.
.query-link > .visualization-name
Refers to the name of widget in bold.
.query-link > :nth-child(2)
Refers to sub-text for widget name.