tesfayegari

/**
 * The first commented line is your dabblet’s title
 */

tesfayegari

/* CSS */

tesfayegari

/* selector {property: value;} 
  element selector ex h1,p, a, etc
  id selector if element has id of myID #myId is the selector 
  class selector if element has class of myClass then the selector is gonna be .myClass
 Please do your CSS here
*/

tesfayegari

.TestClass{
  color: blue;
}

tesfayegari

/*Practice your CSS here. By Tesfaye Gari */
/* Your CSS Goes here*/

tesfayegari

//Syntactic Sugar
//1. Default or Optional Parameter
var container = document.getElementById('container');
function countDown(initial, final = 0, interval = 1){
  var current = initial;
  while(current >final){
    container.innerHTML = current;
    current -= interval;
  }
}

tesfayegari

<h2 style="text-align:center">User Profile Card</h2>

<div class="card">
  <img src="/w3images/team2.jpg" alt="John" style="width:100%">
  <h1>John Doe</h1>
  <p class="title">CEO & Founder, Example</p>
  <p>Harvard University</p>
  <div style="margin: 24px 0;">
    <a href="#"><i class="fa fa-dribbble"></i></a> 
    <a href="#"><i class="fa fa-twitter"></i></a>  

tesfayegari

private readItems() {    
    return this.props.spHttpClient.get(`${this.props.siteUrl}/_api/web/lists/getbytitle('${this.props.listName}')/items?$select=Title,Id`,
      SPHttpClient.configurations.v1,
      {
        headers: {
          'Accept': 'application/json;odata=nometadata',
          'odata-version': ''
        }
      })
      .then((response: SPHttpClientResponse): Promise<{ value: IListItem[] }> => {

tesfayegari

Add the following to the config.json Example below is using bootstrap 3.x but you can use any version

"externals": {
    "jquery": {
      "path": "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js",
      "globalName": "jquery"
    },
    "bootstrap": {
      "path": "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js",
      "globalName": "bootstrap",

tesfayegari

/**
 * Start a workflow
 * 
 * @param  {Object} params
 *   @param {String} params.listName The name of the list
 *   @param {Number} params.itemID The item ID
 *   @param {String} params.workflowName The name of the workflow
 *   @param {Array|Object} [params.parameters] An array of object with {Name:"Name of the parameter", Value:"Value of the parameter"}
 *   @param {Function} [params.after] Callback after the request is done
 */