Turn a dashboard into a card view - Spaces between widgets

[Community_Admin]

If you wish to turn this dashboard :

into this:

Please copy & paste this dashboard script:

dashboard.on('widgetready',function(d) {
   //Card view
   $('.dashboard-layout-column').css('background-color', '#F0F0F0');
   $('.dashboard-layout').css('background-color', '#F0F0F0');
   $('.dashboard-layout-cell-horizontal-divider').remove();
   $('.dashboard-layout-subcell-vertical').css('background-color', 'white').css('box-shadow', '4px 5px 12px #00000078')//.css('border-radius', '0px 0px 30px 30px').
   $('.dashboard-layout-subcell-host').css('padding', '10');
   $('.dashboard-layout').css('padding-right', '20px');
   $('.dashboard-layout').css('padding-left', '20px');
});

[KristyGraves]

There are few of our dashboards that don't look better with cards. Cards are like punctuation in text. They make you pause, like a comma subconsciously tells your brain to consider this information on its own, separate, but related to the whole. They focus the eyes, which focuses the brain.

[Will]

Hello o/

Is there any recommended solution for customizing the dashboards using CSS files?

[MikeGre]

Looks amazing!!

Just a question, if the above script is added in a custom plugin, it should then be applicable to all dashboards?

[Chris_AECC]

This looks great on our dashboards! Is there any way to make the formatting show up when exporting to PDF? This would make reports look so much better if so. 

-Chris

[gwolfe]

Thanks @Community_Admin ! How can I adjust individual cards. For example, what if I didn't want any space between the top 4 widgets so it looks like one white card?