Knowledge Base Article

Card View Customization

Before:

After:

Dashboard script for creating card view:

dashboard.on('widgetready',function(d) {
   $('.dashboard-layout-column').css('background-color', '#f0f0f0');
   $('.dashboard-layout').css('background-color', '#f0f0f0');
   $('.dashboard-layout-cell-horizontal-divider').remove();
   
   //For Edit Mode
   //$('.ui-resizable-handle.ui-resizable-e').css('width','0.5px'); //to make the vertical dividers invisible but still accessible - same row between widgets
   //$('.ui-resizable-handle.ui-resizable-s').css('height','0.5px'); //to make the vertical dividers invisible but still accessible- between rows    

   $('.dashboard-layout-subcell-vertical').css('background-color', 'white').css('box-shadow', '4px 5px 12px #00000078')

   $('.dashboard-layout-subcell-host').css('padding', '10');
   $('.dashboard-layout').css('padding-right', '20px');
   $('.dashboard-layout').css('padding-left', '20px');
});

Widget script for rounding corners:

widget.on('ready', ()=> {
   $(element).parent().css('border-radius', '20px');
   $(element).parent().parent().css('border-radius', '20px');
})

Updated 03-02-2023

Developers: Plugins and scripts

intapiuser

Admin

Joined December 15, 2022

View Profile

5 Comments

Wantti
Cloud Apps
08-15-2023
Hi there,

how does the script look like to use it in the Linux environment?

Would be great to receive some assistance 🙂

Thank you
mguidone
Data Storage
08-31-2023
The script will work in any environment. This is javascript and runs in the browser. What's running on the server doesn't matter in this case.
rvickersevotix
Cloud Apps
04-10-2025
Does anyone have the code to apply this corner radius to all widgets at once?
DRay
Admin
04-14-2025
Hi rvickersevotix ,

Yes, that is possible, if a widget script can add the functionality it is possible to nest the widget script within a dashboard script to run within every widget.
An example of running a widget script for every widget in a dashboard is:

dashboard.on('initialized', function (dash_ev,dash_se) {
dashboard.widgets.$$widgets.forEach((widget, index) => {
console.log(widget.title);
widget.on('ready', function (ev, se) {
console.log(ev.title, ' in event function');
})

})
})

dashboard.on('widgetinitialized', function (dash_se, dash_ev) {
dash_ev.widget.on('ready', function (ev, se) {
console.log(ev.title);
})
})

If it only applies to a certain widget type, a conditional can be used based on the widget.type value to only run on that widget type.
HQ_Dev_Prod
Cloud Apps
05-30-2025
Is there a way to exclude a widget from this? I am trying to exclude this from the heard title.