Restaurant-Menu-Page/index.html at main · Muhammad-Ali-Software-Engineer/Restaurant-Menu-Page · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Little Lemon</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <div>
            <img src="icons/Asset 14@4x.png" alt="Little Lemon" width="400">
        </div>
    </header>
    <nav>
        <ul>
            <li><a href="#home">Home</a></li>
            <li><a href="#menu">Menu</a></li>
            <li><a href="#book">Book</a></li>
            <li><a href="#about">About</a></li>
        </ul>
    </nav>
    <main>
        <section class="banner">
            <header>
                <h1>30% Off This Weekend</h1>
                <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid non soluta voluptatum voluptate sequi amet, aut dolores iure voluptas, voluptatem itaque ipsa tempore aspernatur, exercitationem fugiat veritatis aliquam odio magni consectetur facere facilis eaque asperiores repudiandae praesentium? Unde itaque labore cumque officia cum, natus minus ipsa sed pariatur non repudiandae.</p>
            </header>
        </section>
        <section class="features">
            <article>
                <header>
                    <h2>Our New Menu</h2>
                </header>
                <img src="icons/p1.webp" alt="" width="200">
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nisi aspernatur maxime, magnam pariatur aliquam doloribus adipisci saepe reiciendis ea laboriosam illo magni totam officiis, veritatis repellendus ex in quaerat voluptatem!</p>
                <a href="#menu">See our new menu</a>
            </article>
            <article>
                <header>
                    <h2>Book a table</h2>
                </header>
                <img src="icons/p2.webp" alt="">
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Enim culpa recusandae corporis incidunt distinctio quibusdam, natus, laudantium odit commodi consectetur, harum fugit sed pariatur aspernatur vero placeat facere itaque. Praesentium.</p>
                <a href="#book">Book your table now</a>
            </article>
            <article>
                <header>
                    <h2>Opening Hours</h2>
                </header>
                <img src="icons/p3.jpeg" alt="">
                <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste sunt similique fugit est, ducimus dignissimos. Nam aut dignissimos qui amet.</p>
                <ul class="time">
                    <li>Mon - Fri: 2pm - 10pm</li>
                    <li>Sat: 2pm - 11pm</li>
                    <li>Sun: 2pm - 9pm</li>
                </ul>
            </article>
        </section>
        <footer>
            <div class="footer-logo">
                <img src="icons/Asset 18@4x.png" alt="small-logo" class="small-logo"> <!-- width="40px" -->
            </div>
            <div class="footer-copy">
                <p>&copy; Copyright Little Lemon</p>
            </div>
        </footer>
    </main>
</body>
</html>