UpWorkClone.github.io/index.html at main · GitSadiq/UpWorkClone.github.io · 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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
<!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>Document</title>
    <link rel="stylesheet" href="upworkclone.css">
</head>
<body>
    <div id="body">
        <div id="first">
            <div class="first-A">
            <a href="./upworkclone.html" target="_blank"><button style="color: #4b9f2f; background-color: white; border: none; font-size: 25px;" ><b>upwork</b></button></a>
            </div>
            <div class="first-B">
            <select class="first-dropdown" name="" id="">
                <option value="" selected>Find Talent</option>
                <option value="">Post a job and hire a pro</option>
                <option value="">Browse and buy projects</option>
                <option value="">Let us find you the right talent</option>
            </select>
            <select class="first-dropdown" name="" id="">
                <option value="" selected>Find Work</option>
                <option value="">Ways to Learn</option>
                <option value="">Find work for your skills</option>
            </select>
            <Select class="first-dropdown" name="">
                <option value="" selected>Why Upwork</option>
                <option value="">Success Stories</option>
                <option value="">How to hire</option>
                <option value="">Reviews</option>
                <option value="">How to find work</option>
            </Select>
            <a href="https://www.upwork.com/enterprise/" target="_blank"><button style="width: 120px; color: #4e5a46; background-color: white ; border: none;">Enterprise</button></a>
            </div>
            <div class="first-C">
            <input style="font-size: 15px; border-radius: 20px; padding-left: 10px; height: 30px; border: 1px dotted #4e5a46;" type="search" name="" id="" placeholder="search">
            <a href="https://www.upwork.com/ab/account-security/login"><button class="first-button" style="background-color: white; color: #4e5a46;">Login</button></a>
            <a href="https://www.upwork.com/nx/signup/?dest=home&referrer=webflow"><button class="first-button" style="background-color:#4b9f2f ; color: white;"  >Sign Up</button></a>
            </div>
        </div>
        <hr>
        <div id="second">
            <a href="https://www.upwork.com/cat/dev-it" target="_blank"><button class="second-button">Development & IT</button></a>
            <a href="https://www.upwork.com/cat/design-creative" target="_blank"><button class="second-button">Design & Creative</button></a>
            <a href="https://www.upwork.com/cat/sales-and-marketing" target="_blank"><button class="second-button">Sales & Marketing</button></a>
            <a href="https://www.upwork.com/cat/writing-translation" target="_blank"><button class="second-button">Writing & Translation</button></a>
            <a href="https://www.upwork.com/cat/admin-customer-support" target="_blank"><button class="second-button" style="width: 180px;">Admin & Customer Support</button></a>
            <select name="" id="" class="second-button" style="width: 60px;" >
                <option value="" selected>More</option>
                <option value="" >Finance & Accounting</option>
                <option value="" >HR & Training</option>
                <option value="" >Legal</option>
                <option value="" >Engineering & Architecture</option>
            </select>
        </div>
        <div id="third">
            <div id="thirdA" >
                <h1>How Work <br> Should work</h1>
                <p>Forget the old rules. You can have the best people.</p>
                <p>Right now. Right here.</p>
                <br><br><br>
                <a href="https://www.upwork.com/ab/account-security/login"><button class="third-button" style="color: white; background-color: #4b9f2f;" >Find Talent</button></a>
                <a href="https://appleid.apple.com/auth/authorize?client_id=com.upwork.apple.signin&redirect_uri=https%3A%2F%2Fwww.upwork.com%2Fnx%2Fsignup%2F&response_type=code%20id_token&scope=email%20name&response_mode=web_message&frame_id=39c9b68f-1099-4bc8-a456-3145f69c055f&m=11&v=1.5.4"><button class="third-button" style="border: 1px solid #4b9f2f; color: #4b9f2f;" >Find Work</button></a>
                <br><br><br>
                <p style="color: #9aaa97; ">Trusted by</p>
                <img width="400px" height="50px" src="./images/7.JPG" alt="">
            </div>
            <div id="thirdB">
                <img width="600px" height="550px" src="./images/6.JPG" alt="">
            </div>
        </div>
        <h2>Browse talent by category</h2>
        <div id="fourth">
            <P class="A">Looking for work?</P>
            <a href="https://www.upwork.com/nx/jobs/search/?sort=recency"><button class="fourth-button">Browse jobs</button></a>
        </div>
        <div id="fifth">
            <div>
                <a href="https://www.upwork.com/cat/dev-it"><img class="fifthA" src="./images/im1.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/design-creative"><img class="fifthA" src="./images/im2.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/sales-and-marketing"><img class="fifthA" src="./images/im3.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/writing-translation"><img class="fifthA" src="./images/im4.JPG" alt=""></a>
            </div>
            <div>
                <a href="https://www.upwork.com/cat/admin-customer-support"><img class="fifthA" src="./images/im5.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/finance-accounting"><img class="fifthA" src="./images/im6.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/engineering-architecture"><img class="fifthA" src="./images/im7.JPG" alt=""></a>
                <a href="https://www.upwork.com/cat/legal"><img class="fifthA" src="./images/im8.JPG" alt=""></a>
            </div>
        </div>
        <img width="1190px" height="600px" src="./images/im9.JPG" alt="">
        <div id="sixth">
            <div id="sixthA">
                <h3>Why businesses <br>turn to Upwork</h3>
                <table >
                <tr>
                    <td>
                    <img style="margin-top: 50px;" width="20px" height="20px" src="./images/li1.JPG" alt="">
                    </td>
                    <td>
                    <h4>Proof of Quality</h4>
                    </td>
                </tr>
                </table>
                <p class="B">Check any pro’s work samples, client reviews, and <br> identity verification.</p>
                <table >
                    <tr>
                        <td>
                        <img style="margin-top: 50px;" width="20px" height="20px" src="./images/li2.JPG" alt="">
                        </td>
                        <td>
                        <h4>No cost until you hire</h4>
                        </td>
                    </tr>
                    </table>
                    <p class="B">Interview potential fits for your job, negotiate rates, and <br> only pay for work you approve.</p>
                    <table >
                <tr>
                    <td>
                    <img style="margin-top: 50px;" width="20px" height="20px" src="./images/li3.JPG" alt="">
                    </td>
                    <td>
                    <h4>Safe and secure</h4>
                    </td>
                </tr>
                </table>
                <p class="B">Focus on your work knowing we help protect your data <br> and privacy. We’re here with 24/7 support if you need it.</p>
            </div>
            <div id="sixthB">

            </div>
            <div id="sixthC">
                <h5>We’re <br> the world’s  work <br> marketplace</h5>
                <table >
                    <tr>
                        <td>
                        <img style="margin-top: 80px;" width="20px" height="20px" src="./images/li4.JPG" alt="">
                        </td>
                        <td>
                        <h6>4.9/5</h6>
                        </td>
                    </tr>
                    </table>
                    <p class="C">Clients rate professionals on Upwork</p>
                <table >
                <table style="margin-top: -50px;">
                    <tr>
                    <td>
                    <img style="margin-top: 80px;" width="20px" height="20px" src="./images/li5.JPG" alt="">
                    </td>
                    <td>
                    <h6>Award winner</h6>
                    </td>
                    </tr>
                </table>
                    <p class="C" >G2’s 2021 Best Software Awards</p>
            </div>

        </div>
        <img style="margin-top: 40px; margin-left: 10px; " width="1180px" height="600px" src="./images/8.JPG" alt="">

    </div>

</body>
</html>