project_e-commerce-interface/users.html at main · HumiraAlam/project_e-commerce-interface · 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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>E-commerce Application</title>
    <link rel="stylesheet" href="users.css" />
  </head>
  <body>
    <div id="navbar">
      <div id="title">
        <h1>E-commerce Application</h1>
      </div>
      <div id="menus">
        <a href="home.html">Home</a>
        <a href="profile.html">Profile</a>
        <a href="users.html">Users</a>
        <a href="portfolio.html">Portfolio</a>
        <a href="products.html">Product</a>
        <a href="cart.html">My Cart</a>
        <input type="button" value="Logout" />
      </div>
    </div>
    <div id="userdetail">
        <h1 style="color: green;">User Detail</h1><br>
        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Reprehenderit exercitationem quo tenetur nihil? Neque, illum ducimus aspernatur, iusto quas harum eius, nemo saepe cumque voluptate et veniam sequi aliquam at. Ab veniam dolore odio nihil? Rerum ab impedit necessitatibus doloremque rem, autem amet consectetur labore sapiente nam ducimus recusandae sequi molestiae voluptate totam repellat adipisci vitae quisquam et dolorem aut similique. Voluptates, repellat quibusdam officiis inventore quasi laborum sequi dolorum aperiam? Error minus magnam ab aperiam esse inventore deserunt nam quis eligendi repellat obcaecati suscipit, totam ducimus nesciunt molestiae ut voluptas, tempora quaerat molestias? Aut numquam dicta consequuntur aliquam ipsam? Beatae mollitia nihil iste necessitatibus dolorem, minima distinctio cumque? Minima placeat exercitationem est earum, molestias obcaecati esse! Ducimus minima eligendi tenetur, perferendis deleniti, voluptates animi omnis repellendus cum ad nemo voluptatum minus distinctio ea, tempore dolores adipisci. Minima autem dolor ipsam dolorem atque nobis, sed iusto eos corrupti culpa quaerat saepe eligendi beatae perspiciatis facilis? Exercitationem assumenda alias ipsa aperiam. Ratione iste quis unde distinctio doloremque expedita, impedit assumenda illo, laboriosam sint corrupti voluptas enim iusto dolor asperiores explicabo aut quibusdam. Sequi repudiandae fuga dolorem corrupti molestiae? Eaque ullam accusamus fugiat deserunt, possimus officiis quod autem doloribus deleniti magnam, placeat ea aperiam porro exercitationem architecto? Iusto necessitatibus, tempore delectus sequi non repudiandae aut perspiciatis culpa dolorum est possimus temporibus reprehenderit quasi impedit molestiae architecto similique vero doloribus iste laborum et, labore perferendis. Nam nostrum numquam natus non reprehenderit doloribus sequi recusandae molestiae quis blanditiis. Neque veritatis ea ad, a necessitatibus laborum ullam quis at animi alias distinctio error officia est commodi nam facilis voluptatem eius voluptates reiciendis quo atque! Natus incidunt maxime laborum officia ratione, accusantium repellat fugit! Odio placeat est necessitatibus ex, earum assumenda! Numquam maiores nostrum fugiat veniam quo? Repellendus voluptatum deleniti nesciunt minima quidem dolor voluptas sunt?</p>
        <br>
        <button>Get Users</button>
        <div id="gender">
            <input type="radio" name="gender" checked>
            <label>All</label>
            <input type="radio" name="gender">
            <label>Male</label>
            <input type="radio" name="gender">
            <label>Female</label>

        </div>

    </div>
    <div id="userlist">
        <div id="listtitle">
            <div>IMAGE</div>
            <div>NAME</div>
            <div>GENDER</div>
            <div>E-MAIL</div>
            <div>DETAIL</div>
        </div>

        <div id="listdetail">
            <div><img src="https://thepienews.com/wp-content/uploads/2020/01/Profile-Picture-Small.jpg" alt="" height="100px" width="100px"></div>
            <div>Rony</div>
            <div>Male</div>
            <div>rony@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://media.licdn.com/dms/image/C5603AQHCQBrp4sJnHA/profile-displayphoto-shrink_400_400/0/1521867420075?e=1702512000&v=beta&t=2nsiZYtHyeO_SJ99qZj-nwszgvM8P7XnM4D5pFoSpjs" alt="" height="100px" width="100px"></div>
            <div>AAA</div>
            <div>Male</div>
            <div>AAA@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://qph.cf2.quoracdn.net/main-thumb-528686-200-ttdpmsfoeaumkwpheuvnofmnddimsqmq.jpeg" alt="" height="100px" width="100px"></div>
            <div>BBB</div>
            <div>Male</div>
            <div>BBB@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://www.befunky.com/images/wp/wp-2021-01-linkedin-profile-picture-after.jpg?auto=avif,webp&format=jpg&width=944" alt="" height="100px" width="100px"></div>
            <div>CCC</div>
            <div>Female</div>
            <div>CCC@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://thepienews.com/wp-content/uploads/2020/01/Profile-Picture-Small.jpg" alt="" height="100px" width="100px"></div>
            <div>DDD</div>
            <div>Male</div>
            <div>DDD@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://www.perfocal.com/blog/content/images/2021/01/Perfocal_17-11-2019_TYWFAQ_100_standard-3.jpg" alt="" height="100px" width="100px"></div>
            <div>EEE</div>
            <div>Female</div>
            <div>DDD@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://thepienews.com/wp-content/uploads/2020/01/Profile-Picture-Small.jpg" alt="" height="100px" width="100px"></div>
            <div>PPP</div>
            <div>Male</div>
            <div>PPP@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSH-q3WWsLEVdDsXEddGHxpoE00Y2knvcEJ5pAmjsoUM2DFPFxfZO7_Y2GjBunSUmlbJds&usqp=CAU" alt="" height="100px" width="100px"></div>
            <div>YYY</div>
            <div>Female</div>
            <div>YYY@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://i.pinimg.com/736x/55/a5/89/55a589c4c118141188f1396ebada5e9b.jpg" alt="" height="100px" width="100px"></div>
            <div>GGG</div>
            <div>Female</div>
            <div>GGG@gmail.com</div>
            <div><button>Detail</button></div>
            <div><img src="https://thepienews.com/wp-content/uploads/2020/01/Profile-Picture-Small.jpg" alt="" height="100px" width="100px"></div>
            <div>Rony</div>
            <div>Male</div>
            <div>rony@gmail.com</div>
            <div><button>Detail</button></div>
        </div>

    </div>

    <div id="footer">
      <h2>Footer Componant</h2>
      <p>
        Lorem, ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus,
        in. Nihil adipisci quod unde dolor, quaerat nulla doloribus placeat quo
        quam quae dignissimos temporibus, odit earum odio sit repudiandae
        accusamus suscipit illum. Suscipit veniam rerum aperiam est ex id
        tempora voluptas, rem at nihil, ab culpa porro eligendi soluta dolorum
        eius pariatur maiores provident molestiae praesentium aspernatur, magnam
        a? Minus aspernatur cum repellendus. Tenetur reprehenderit corrupti
        voluptatibus minima enim nemo in delectus repudiandae, autem architecto
        tempora, consectetur neque adipisci, nobis culpa obcaecati accusamus
        aliquid officiis ipsam! Doloribus nemo perspiciatis dolore distinctio
        sint, corrupti nihil doloremque ratione, quidem, voluptatibus
        aspernatur. Impedit consequatur at culpa aliquid nostrum soluta, illum
        maxime saepe. Delectus laboriosam doloribus molestiae hic sed harum
        aperiam, illum modi eum ducimus! Debitis aut voluptatum aperiam quod rem
        cumque fuga ab praesentium officiis natus corrupti facere molestiae
        reprehenderit iusto quo id architecto deleniti, numquam excepturi nobis
        rerum harum facilis quos ratione! Facilis esse reiciendis minus iusto,
        ipsum natus, porro doloribus harum quam, temporibus facere. Suscipit
        quae animi atque enim. Odit eius quo eum impedit magnam incidunt
        expedita, reprehenderit exercitationem deserunt consectetur hic, iste
        sit odio cupiditate sunt natus enim repudiandae architecto! Amet
        laboriosam similique laudantium quidem saepe incidunt deleniti.
        Deserunt, doloribus.
      </p>
      <h4>All copy Rights @ Are Reserved by Humira Alam</h4>
    </div>
  </body>
</html>