Milan-Cakes/index.html at master · MohamedDanis/Milan-Cakes · 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
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Milan Cakes</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link href="https://fonts.googleapis.com/css2?family=Fredoka+One&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css2?family=Caveat&family=Jost:wght@600&display=swap" rel="stylesheet">
    <link rel="shortcut icon" href="cake.svg" type="image/x-icon">
  </head>
<body>
    <style>
        body,h1,h2,h3,h4,h5,h6 {font-family: 'Nunito', sans-serif;
        background-color: #EFF7F6;
    }
        .w3-bar-block .w3-bar-item {padding:20px}
        </style>
        <body>

        <!-- Sidebar (hidden by default) -->

        <!-- Top menu -->
        <header>
        <div class="w3-top">
          <div class=" w3-xlarge" style="width:100%;margin:auto">
            <div class="menu-wrap">
              <input type="checkbox" class="toggler">
              <div class="hamburger"><div></div></div>
              <div class="menu">
                <div>
                  <div>
                    <ul>
                      <li><a href="#">Home</a></li>
                      <li><a href="#booking">Order Now</a></li>
                      <li><a href="#"></a></li>
                      <li><a href="#"></a></li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>

            <div class="w3-center w3-padding-16 main-heading">Milan Cakes</div>
          </div>
        </div>
        </header>

        <!-- !PAGE CONTENT! -->
        <div class="w3-main w3-content w3-padding" style="max-width:1200px;margin-top:100px">

          <!-- First Photo Grid-->
          <div class="w3-row-padding w3-padding-16 w3-center" id="food">
            <div class="w3-quarter">
              <img src="cake-1.jpg" alt="Sandwich" style="width:100%">
              <h3>Red Velvet</h3>

            </div>
            <div class="w3-quarter">
              <img src="cake-2.jpg" alt="Steak" style="width:100%">
              <h3>White Forest</h3>

            </div>
            <div class="w3-quarter">
              <img src="cake-4.jpg" alt="Cherries" style="width:100%">
              <h3>Black Forest</h3>


            </div>
            <div class="w3-quarter">
              <img src="cake-10.jpg" alt="Pasta and Wine" style="width:100%;height:362px;">
              <h3>Chocolate</h3>

            </div>
          </div>

          <!-- Second Photo Grid-->
          <div class="w3-row-padding w3-padding-16 w3-center">
            <div class="w3-quarter">
              <img src="cake-6.jpg" alt="Popsicle" style="width:100%;font-family: 'Nunito', sans-serif;">
              <h3>Vanilla</h3>

            </div>
            <div class="w3-quarter">
              <img src="cake-7.jpg" alt="Salmon" style="width:100%">
              <h3>Mirror Glaze</h3>

            </div>
            <div class="w3-quarter">
              <img src="cake-8.jpg" alt="Sandwich" style="width:100%">
              <h3>Mehandi wedding</h3>

            </div>
            <div class="w3-quarter">
              <img src="cake-9.jpg" alt="Croissant" style="width:100%;height:363.656px">
              <h3>Oreo</h3>

            </div>
          </div>

          <!-- Pagination -->
          <div id="booking">
            <h2 style="text-align: center;color:#E87AB2;font-weight: bold;font-family: 'Jost', sans-serif;">For Ordering...</h2>
            <div class="book-container">
              <div class="left-section">
                <div class="address">
                <h3>Address</h3>
                <p><span><img src="location.svg"></span>Padikkal, Velimukku P.O, Malappuram, Kerala</p>
                <p><span><img src="phone.svg"></span>+91 9895022018, +91 7356281919</p>
                <p style="position: relative;top:100px;font-family: 'Caveat', cursive;font-size: 17px;">Making Beautiful Cakes For Your Sweet Moments..</p>
              </div>
              </div>
          </div>

          </div>
          <footer style="height:10vh;width:100%;margin-top: 73px;">
            <h4>Design and developed By<span><img src="logo-2.svg"></span></h4>
          </footer>


        <!-- End page content -->
        <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</body>
</html>