Shopboost/main.html at master · stnltd/Shopboost · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Main Bootstrap</title>
    <link rel="stylesheet" href="bootsrap/css/bootstrap.min.css">
    <script src="bootsrap/js/bootstrap.min.js"></script>
</head>
<body>

    <h1 class="text-warning text-center bg-dark">Introduction to Bootstrap</h1>
    <button class="btn btn-primary">Home</button>
<button class="btn btn-warning">About</button>
<button class="btn btn-danger">Gallery</button>
<button class="btn btn-success">Services</button>
<button class="btn btn-outline-warning">List</button>
<button class="btn btn-outline-dark">Register</button>

    <p class="text-secondary">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Soluta, cupiditate? Fugiat dicta molestiae accusantium ut quas et, aut suscipit obcaecati perferendis? Accusantium, maiores quisquam architecto assumenda blanditiis magnam nisi! Deserunt.
    Excepturi officia dolores doloremque at ducimus numquam fuga voluptates necessitatibus iusto, minus velit, esse sunt enim explicabo suscipit laborum eligendi quo architecto nemo, dolor tenetur? Sapiente odit cupiditate iste illum?</p>

     <p class="text-success">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ea et velit corrupti repellat nisi iste, eaque perferendis necessitatibus nulla veritatis quam cupiditate! Ipsa voluptatem corrupti optio, debitis sunt deleniti saepe.
     Vel ex perspiciatis adipisci temporibus id quis assumenda quaerat quam accusantium minus illum fugit, amet alias ducimus aliquid neque facere quia sed deleniti magnam debitis incidunt ipsam, exercitationem est. Rerum?</p>


     <div class="bg-info text-white container">
        <h1>Bootstrap</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quia veniam debitis excepturi, facilis, amet, est voluptas labore aliquid nobis ex unde. Saepe nulla ipsam maxime amet optio sed ex sit!
        Voluptatibus, commodi molestias. Quibusdam aut sapiente facere sit odio ipsum sint, eligendi soluta assumenda nihil cumque veniam temporibus earum nisi harum neque? Quam distinctio modi repellat praesentium nostrum soluta sed.</p>
     </div>

    <div class="bg-warning text-white mt-4 ms-4 me-2 mb-3 p-5">
        <h1>Luxury Watches</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos, reiciendis accusantium nostrum eius quibusdam neque autem porro minus quasi. Voluptas aperiam error ad alias maxime, expedita quisquam aliquam impedit accusamus.
        Amet perspiciatis laborum laboriosam sed tempore quae incidunt repudiandae fugiat facere explicabo necessitatibus, cum rerum eveniet, inventore consectetur assumenda distinctio. Consequatur quos nesciunt natus deleniti ad id qui provident rerum.</p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ex quae illum dolore eius! Autem rerum neque exercitationem ea inventore! Qui id unde ex magnam vel ad? Blanditiis alias dignissimos vitae.
        Impedit incidunt nam quasi veniam in, illum, exercitationem natus quam tempora eius laboriosam veritatis eveniet? Earum fugit sit aut sequi numquam, odio dicta vitae veritatis voluptatum, cumque eaque eius velit!</p>
    </div>

    <div class="bg-secondary text-white d-flex container p-5">
        <img src="Assets/images (3).jpg" alt="" class="rounded-circle me-5">
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos cum exercitationem consequuntur animi at libero, fugiat et numquam, facilis accusantium eligendi officiis minus repudiandae explicabo sequi aspernatur iure rerum eveniet!
        Dolorem at repellendus recusandae est fugiat qui nostrum ipsum, voluptatem quasi dignissimos, itaque perferendis commodi dicta quod culpa eius? Animi et adipisci obcaecati assumenda veniam doloremque, unde voluptatem doloribus cupiditate!</p>
    </div>

    <h1 class="text-center text-primary">Employee Details</h1>

    <table class="table table-bordered table-hover table-stripped">
        <tr class="table-dark">
            <th>id</th>
            <th>Firstname</th>
            <th>Lastname</th>
            <th>Age</th>
            <th>Email Address</th>
        </tr>

        <tr>
            <td>101</td>
            <td>Jane</td>
            <td>Muthoni</td>
            <td>34 yrs old</td>
            <td>jane@gmail.com</td>
        </tr>

        <tr class="table-succes">
            <td>102</td>
            <td>Mark</td>
            <td>Joe</td>
            <td>42 yrs old</td>
            <td>mark@gmail.com</td>
        </tr>

        <tr>
            <td>103</td>
            <td>Ann</td>
            <td>Kamau</td>
            <td>28 yrs old</td>
            <td>ann@gmail.com</td>
        </tr>

        <tr class="table-danger">
            <td>104</td>
            <td>Job</td>
            <td>Harrison</td>
            <td>45 yrs old</td>
            <td>harrison@gmail.com</td>
        </tr>


    </table>


    </body>
</html>