This widget contains:

• A header or top section with a white background where the widget title generally goes.
• A body or main section where most of the content goes.

<div class="card minheight">    
  <div class="card-header">
    <h2 class="card-title c-darkgray">@String("Widget Title Goes Here")</h2>
  </div>    
  
  <div class="card-body">      
    [Widget Content Goes Here]       
  </div>
</div>

System CSS

These CSS classes are a variation of standard Bootstrap styles were in the HTML snippet for this widget:

• .minheight – Applies a minimum height of 100 pixels for the widget.
• .c-darkgray – Used to modify .card-title default white text color to a dark gray (#5e5e5e).

Along with Bootstrap Cards classes.

• .card – Creates the standard white background of the widget along with the default padding, shadowing, border-radius, etc. This is an easy way to make sure your custom widgets look like the other widgets without recreating the look and feel.
• .card-header – Adds the standard padding and positioning for the header (top portion of the widget).
• .card-title – Applies the standard header text size (22), alignment (center), and color (white).
• .card-body – Applies standard padding for the middle/body of the widget.