module3/index.html at master · marv-dev86/module3 · 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
100
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">

    <link rel="stylesheet" href="css/bootstrap-grid.min.css">
    <link rel="stylesheet" href="fontawesome-free-5.14.0-web/css/all.css">

    <link href="https://fonts.googleapis.com/css2?family=Sirin+Stencil&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="css/styles.css">


    <title>Menu Restaurant</title>
</head>
    <body>


        <nav class="navbar navbar-expand-lg navbar-light bg-dark">
          <div class="container-fluid">
            <a class="navbar-brand text-white" href="#">Food, LLC</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <div class=" collapse navbar-collapse bg-dark" id="navbarSupportedContent">
            <ul class="nav navbar-nav mr-auto  d-lg-none text-center">
              <li class="nav-item active" type="button">
                <a class="nav-link" href="#chiken">Chicken <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#beef">Beef</a>
              </li>
              <li class="nav-item ">
                <a class="nav-link " href="#sushi" >
                  Sushi
                </a>

              </li>

            </ul>

          </div>

          </div>
        </nav>


          <h1 class="display1 text-center mt-5"> Our Menu </h1>

  <div class="container contenedor-xs">

      <div class="row justify-content-between">

        <div class="col-md-5 col-lg-3 bg-warning mt-5">
          <h2 class="display2 text-center py-5" id="chicken"> Chicken</h2>

      <p class="text-justify px-3">
         Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, ipsa nulla ullam esse temporibus quo! Quasi omnis aut est mollitia vel, dolores similique illo magni nemo necessitatibus doloremque fugiat ab Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste, non officiis quidem asperiores voluptatem ipsam voluptatibus illo alias? Quas expedita ipsum rerum voluptates cumque distinctio iste et sed molestias debitis.
      </p>
        </div>

        <div class="col-md-5 col-lg-3 bg-primary mt-5 ">
          <h2 class="display2 text-center py-5" id="beef"> Beef</h2>

      <p class="text-justify px-3">
          Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique aspernatur voluptas dolorum placeat sunt, doloremque inventore nam molestiae natus quasi aperiam quod nostrum, quas aliquid molestias magni exercitationem quisquam obcaecati Lorem, ipsum dolor sit amet consectetur adipisicing elit. Maiores, consequatur ad! Quas pariatur ducimus, at, iusto ipsum laborum ad a odit animi tempora ea atque alias sequi iure sunt harum?
      </p>
        </div>


        <div class="col-md-12 col-lg-3 bg-secondary mt-5">
          <h2 class="display2 text-center py-5" id="sushi"> Sushi</h2>

      <p class="text-justify px-3">
          Lorem ipsum dolor sit, amet consectetur adipisicing elit. In nemo ab natus enim voluptatem! Quaerat obcaecati modi sed molestias, porro pariatur facilis, error nobis cum corporis adipisci dignissimos? Maiores, cum! Lorem ipsum dolor, sit amet consectetur adipisicing elit. Corporis commodi odit mollitia earum obcaecati culpa deserunt ducimus beatae minus et voluptas corrupti nostrum fuga consequatur, doloremque itaque ullam vitae maiores?
      </p>
        </div>


      </div>


  </div>


    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
    <script src="js/bootstrap.min.js"></script>
</body>
</html>