Submodule 4.2: Displaying Content - Media - Alerting Users

Alerting Users

In this short lesson, we will examine the use of badges as a way of alerting users.

We will continue to edit the index.html file. In this file, we will add a badge HOT next to the name of the dish 85% DARK CHOCOLATE in the first content row. To do this, add the following code inside the <h2> containing the name of the dish: 

<span class="badge badge-danger">HOT</span>

Next, we will add a badge as a badge-pill right next to the earlier tag in the web page. Add the following code to the <h2> tag: 

<span class="badge badge-pill badge-success">$0.99</span>

The above code will create a page displayed as:

Do commit the changes to the Git repository with the message "Alerting Users".