Cravings_Hub_website/Bsingle-recipe4.html at main · shirinshaik/Cravings_Hub_website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Single Recipe || Final</title>
    <!-- favicon -->
    <link rel="shortcut icon" href="./assets/favicon.ico" type="image/x-icon" />
    <!-- normalize -->
    <link rel="stylesheet" href="./css/normalize.css" />
    <!-- font-awesome -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"
    />
    <!-- main css -->
    <link rel="stylesheet" href="./css/main.css" />
  </head>
  <body>
    <body style="background-color:peachpuff;"></body>
    <!-- nav  -->
    <nav class="navbar">
      <div class="nav-center">
        <div class="nav-header">
          <a href="index.html" class="nav-logo">
            <img src="./assets/logo.svg" alt="simply recipes" />
          </a>
          <button class="nav-btn btn">
            <i class="fas fa-align-justify"></i>
          </button>
        </div>
        <div class="nav-links">
          <a href="index.html" class="nav-link"> Home </a>
          <a href="about.html" class="nav-link"> About </a>
          <a href="tags.html" class="nav-link"> Filters </a>
          <a href="recipes.html" class="nav-link"> CookBook </a>

          <div class="nav-link contact-link">
            <a href="contact.html" class="btn"> contact </a>
          </div>
        </div>
      </div>
    </nav>
    <!-- end of nav -->
    <main class="page">
      <div class="recipe-page">
        <section class="recipe-hero">
          <img
            src="./assets/recipes/image-29.jpg"
            class="img recipe-hero-img"
          />
          <article class="recipe-info">
            <h2>Original Bircher Muesli</h2>
            <p>
                The original Bircher Muesli – an old classic that should not be missed on the breakfast table! The muesli lovers among you know what we mean. The Bircher muesli is not only extremely healthy, but also super delicious. It is very easy to prepare, and you will certainly succeed even if you are not a professional chef. We prefer to start making Bircher muesli the day
            </p>
            <div class="recipe-icons">
              <article>
                <i class="fas fa-clock"></i>
                <h5>Cook time</h5>
                <p>10 min.</p>
              </article>
              <article>
                <i class="fas fa-heartbeat"></i>
                <h5>Calorie Count</h5>
                <p>227 cal</p>
              </article>
              <article>
                <i class="fas fa-user-friends"></i>
                <h5>serving</h5>
                <p>2 servings</p>
              </section>
              <!-- content -->
        <section class="recipe-content">
          <article>
            <!-- single instruction -->
            <div class="single-instruction">
              <header>
                <p>Link to the Recipe:</p>
              </header>
                <p><a href="https://www.verival.co.uk/blog/breakfast/original-bircher-muesli-recipe/">Visit www.verival.co.uk </a></p>

                <div></div>
              </header>

        </section>
      </div>
    </main>
    <!-- footer -->
    <footer class="page-footer">
      <p>
        &copy; <span id="date"></span>
        <span class="footer-logo">CravingsHut</span>
      </p>
    </footer>
    <script src="./js/app.js"></script>
  </body>
</html>