2021-09-12 17:20:03 +02:00
< html >
< head >
< title > Product List< / title >
< link rel = "shortcut icon" type = "image/png" href = "assets/favicon.png" / >
< link rel = "stylesheet" href = "https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"
integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
< link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" >
< style >
.bg-color {
background-color: #1b1c1e;
}
.comp-color {
background-color: #212226;
}
.nav-radius {
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
< / style >
< / head >
< body class = "bg-color" >
< nav class = "navbar navbar-expand-lg navbar-dark comp-color ml-5 mr-5 nav-radius" >
2021-09-13 11:19:54 +02:00
< a href = "/" > < img class = "navbar-brand" src = "assets/logo_transparent.png" alt = "Banner" style = "margin-top: 0%;" width = "80" height = "80" > < / a >
2021-09-12 17:20:03 +02:00
< button class = "navbar-toggler" type = "button" data-toggle = "collapse" data-target = "#navbarTogglerDemo01"
aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
< span class = "navbar-toggler-icon" > < / span >
< / button >
< div class = "collapse navbar-collapse" id = "navbarTogglerDemo01" >
< ul class = "navbar-nav mx-auto" >
< li class = "nav-item active" >
< a class = "nav-link" href = "/" > Home< / a >
< / li >
< li class = "nav-item" >
2021-09-12 18:03:17 +02:00
< a class = "nav-link disabled" href = "product-list.html" aria-disabled = "true" > Products< / a >
2021-09-12 17:20:03 +02:00
< / li >
< li class = "nav-item" >
2021-09-12 18:03:17 +02:00
< a class = "nav-link" href = "about-us.html" > About Us< / a >
< / li >
< li class = "nav-item" >
< a class = "nav-link" href = "faq.html" > FAQ< / a >
2021-09-12 17:20:03 +02:00
< / li >
< / ul >
< span class = "navbar-nav my-2 my-lg-0 text-white" >
2021-09-13 11:33:46 +02:00
< a href = "login.html" > < button type = "button"
2021-09-12 17:20:03 +02:00
class="btn btn-outline-success mt-auto mb-auto mr-3">Login< / button > < / a >
< i class = "fas fa-shopping-cart mt-auto mb-auto" > < span class = "ml-2 mt-auto mb-auto" > $999< / span > < / i >
< / span >
< / div >
< / nav >
< div class = "container-fluid mt-3" >
< div class = "row justify-content-around" >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 1< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 2< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 3< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 4< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 5< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 6< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 7< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 8< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< div class = "card mb-3" style = "max-width: 480px;" >
< div class = "row no-gutters" >
< div class = "col-md-4" >
< img src = "https://telegra.ph/file/10c14ef12cc8f16ab0960.png" alt = "Item Image" class = "img-fluid" >
< / div >
< div class = "col-md-8" >
< div class = "card-body" >
< h5 class = "card-title" > Item 9< / h5 >
< p class = "card-text" > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas porttitor tempus scelerisque. Nunc sed bibendum ante, eget imperdiet purus. Curabitur.< / p >
2021-09-13 07:25:49 +02:00
< a href = "product.html" > < button type = "button" class = "btn btn-info" > View Detail< / button > < / a >
2021-09-12 17:20:03 +02:00
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< script src = "https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous">
< / script >
< script src = "https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous">
< / script >
< / body >
< / html >
