Edit-program-template updates

[Ramin-Farhadi]

Enhancements:

• I changed the Preview table to save space and help users focus on editing. Now, the logic of Preview table is in xs-small-cards for a neater look.
• To make the cards work better on different screens, I added some special styling called .custom-xs-card in the cards.scss file.
• The layout got a makeover with Bootstrap. The main part now has 8 columns, and the sidebar has 4 columns, making everything look and work better.

[jmbarne3]

Let's see if we can lay these out as block elements within the bootstrap grid and avoid setting widths and specific heights.

Where possible, let's use the built-in bootstrap mixins, e.g. for media queries using media-breakpoint-up or media-breakpoint-down.