pear and bacon grilled cheese LS

In this example below you will see how to do a pear and bacon grilled cheese LS with some HTML / CSS and Javascript

This awesome code was written by nbinion17, you can see more from this user in the personal repository.
You can find the original code on
Copyright nbinion17 ©
  • HTML
<!DOCTYPE html>
<html lang="en" >

  <meta charset="UTF-8">
  <title>pear and bacon grilled cheese LS</title>


    <title>Grilled Cheese Recipes</title>
      body {
        font-size: 20px;
        color: #666;

      h1 {
        color: cadetblue;

      h2 {
        color: crimson;

      #ingredients {
        color: darkslategray;

      #directions {
        color: maroon;

      .ingredient {
        font-style: italic;

      .direction {
        font-family: sans-serif;

    <h1>Pear and Bacon Grilled Cheese</h1>
    <h2 id="ingredients">Ingredients</h2>
    <p class="ingredient">2 tablespoons unsalted butter</p>
    <p class="ingredient">2 tablespoons currant or fig jam</p>
    <p class="ingredient">2 slices white sandwich bread</p>
    <p class="ingredient">2 slices Cheddar</p>
    <p class="ingredient">2 slices cooked bacon</p>
    <p class="ingredient">1/4 small pear, thinly sliced</p>
    <h2 id="directions">Directions</h2>
    <p class="direction">1. Melt the <strong>butter</strong> in a small skillet over medium-low heat. Spread the <strong>jam</strong> on 1 slice of the <strong>bread</strong> and form a sandwich with the <strong>cheese, bacon, and pear</strong>.</p>
    <p class="direction">2. Cook the sandwich, covered, until the <strong>bread</strong> is toasted and the <strong>cheese</strong> is melted, 2 to 3 minutes per side.</p>