Watch.ml/index.html at main · git-patel/Watch.ml · 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
130
131
132
133
134
135
136
<!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>Watch collation.com</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" media="screen and (max-width:1525px)" href="phone.css">
    <script>

        /* When the user clicks on the button,
        toggle between hiding and showing the dropdown content */
    function myFunction() {
        document.getElementById("myDropdown").classList.toggle("show");
    }

    // Close the dropdown menu if the user clicks outside of it
    window.onclick = function(event) {
        if (!event.target.matches('.dropbtn')) {
            var dropdowns = document.getElementsByClassName("dropdown-content");
            var i;
            for (i = 0; i < dropdowns.length; i++) {
                var openDropdown = dropdowns[i];
                if (openDropdown.classList.contains('show')) {
                    openDropdown.classList.remove('show');
                }
            }
        }
    }
    </script>

</head>
<body>
    <nav id="navbar">
        <div id="logo">
            <img src="img/logo.jpg" alt="watch logo" >
        </div>

        <ul> <div class="dropdown">
            <li class="item"><a href="#" onclick="myFunction()" class="dropbtn">Home</a></li>
            <div id="myDropdown" class="dropdown-content">
                <a href="www.google.com">Link 1</a>
                <a href="www.facebook.com">Link 2</a>
                <a href="www.google.com">Link 3</a>
              </div>
            </div>
            <li class="item"><a href="#">Service</a></li>
            <li class="item"><a href="#">About Us</a></li>
            <li class="item"><a href="#">Contact Us</a></li>
           <!-- <div class="SEARCH">
               <input class = "input-search"type="search" placeholder="WRIGHT HERE">
            <button class="label-search">SEARCH</button>
        </div> -->
        </ul>

    </nav>
    <section id="home">
       <div class="font">
           <h1 class="h-primry">Welcome to Watch Collection</h1>
           <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptas nam veritatis, praesentium cum libero deserunt, omnis at ducimus minus neque</p>
           <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Vitae necessitatibus optio ab officiis fuga illo ipsa</p>
           <button class="btn"> Order Now</button>
        </div>
    </section>
    <section class="services">
        <h1 class="our-service center"> Our Services</h1>
        <div id="service">
            <div class="box">
                <img src="img/rich watch.jpeg" alt="rich">
                <h2 class="h-secondary center">
                    Watch Order
                </h2>
                <p class="center">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis ratione atque aliquam mollitia, iusto neque eaque, officiis reprehenderit beatae rerum ut qui optio. Eveniet, doloremque sequi error aut facere tempora.</p>

            </div>
            <div class="box">
                <img src="img/Watch in hand.jpeg" alt="rich">
                <h2 class="h-secondary center">Made in INDIA</h2>
                <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Deserunt vitae iste iure a impedit voluptate unde pariatur, soluta laudantium maxime, fugit, earum dolorum. Ratione accusamus minus fugiat, amet alias fugit!</p>
            </div>
            <div class="box">
                <img src="img/black watch.jpeg" alt="rich">
                <h2 class="h-secondary center">Design</h2>
                <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Deserunt vitae iste iure a impedit voluptate unde pariatur, soluta laudantium maxime, fugit, earum dolorum. Ratione accusamus minus fugiat, amet alias fugit!</p>
            </div>
        </div>
    </section>
    <section class="clint-section">
        <h1 class="our center">OUR CLIANTS</h1>
        <div class="clint">
        <div class="clint-img">

            <img src="img/fastrack1.jpg" alt="">

        </div>
        <div class="clint-img">
            <img src="/img/Hublot-Company-Logo1.png" alt="">

        </div>
    </div>
    </section>
    <section id="contact">
        <h1 class="m-primry center">CONTACT US</h1>
        <div class="contact-box">
            <form action="">

                <div class="contact-grp">
                    <label for="name">Name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                    <input type="text" name="name" id="name" placeholder ="Enter Your Name">
                </div>
                    <div class="contact-grp">
                        <label for="Phone ">Phone No:&nbsp;</label>
                        <input type="phone" name="phone number" id="name" placeholder ="Enter Your Name">
                    </div>
                    <div class="contact-grp">
                        <label for="name">Email:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </label>
                        <input type="email" name="name" id="name" placeholder ="Enter Your Name">
                    </div>
                    <div class="contact-grp">
                        <label for="password">City:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                        <input type="text" name="name" id="name" placeholder ="Enter Your Name">
                    </div>
                    <div class="contact-grp">
                        <button class="btn-submit">SUBMIT</button>
                    </div>
                </div>
             </form>
         </section>
    <footer>
        <div class=" copy center">
            copyright &copy; www.watchcollation.com All right receved
        </div>
    </footer>
</body>
</html>