Removed blocked files from gitignore
This commit is contained in:
parent
a6f66fe1a5
commit
086e2c7b45
15
.gitignore
vendored
15
.gitignore
vendored
@ -278,19 +278,4 @@ pyrightconfig.json
|
|||||||
.history
|
.history
|
||||||
.ionide
|
.ionide
|
||||||
|
|
||||||
### Web ###
|
|
||||||
*.asp
|
|
||||||
*.cer
|
|
||||||
*.csr
|
|
||||||
*.css
|
|
||||||
*.htm
|
|
||||||
*.html
|
|
||||||
*.js
|
|
||||||
*.jsp
|
|
||||||
*.php
|
|
||||||
*.rss
|
|
||||||
*.wasm
|
|
||||||
*.wat
|
|
||||||
*.xhtml
|
|
||||||
|
|
||||||
# End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,python,flask,web
|
# End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,python,flask,web
|
||||||
|
|||||||
197
static/css/style.css
Normal file
197
static/css/style.css
Normal file
@ -0,0 +1,197 @@
|
|||||||
|
:root {
|
||||||
|
--bg: #282c34;
|
||||||
|
--bg-secondary: #474d57;
|
||||||
|
--bg-grad-1: #484e58;
|
||||||
|
--bg-grad-2: #4e5560;
|
||||||
|
--bg-grad-3: #59616d;
|
||||||
|
--bg-grad-4: #606a7b;
|
||||||
|
--bg-grad-5: #606978;
|
||||||
|
--input: #4e5560;
|
||||||
|
--fg: #ABB2BF;
|
||||||
|
--header: #E06C75;
|
||||||
|
--link: #98C379;
|
||||||
|
--hover: #56B6C2;
|
||||||
|
--glow: #C678DD;
|
||||||
|
|
||||||
|
--green: #98C379;
|
||||||
|
--red: #E06C75;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
background-color: var(--bg);
|
||||||
|
color: var(--fg);
|
||||||
|
padding:2%;
|
||||||
|
font-size: 160%;
|
||||||
|
font-family: 'Courier New', Courier, monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 120%;
|
||||||
|
}
|
||||||
|
|
||||||
|
form {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sticky {
|
||||||
|
position: -webkit-sticky;
|
||||||
|
position: sticky;
|
||||||
|
top: -2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logo {
|
||||||
|
width: 15%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
*::-webkit-scrollbar,
|
||||||
|
*::-webkit-scrollbar-thumb {
|
||||||
|
width: 26px;
|
||||||
|
border-radius: 13px;
|
||||||
|
background-clip: padding-box;
|
||||||
|
border: 10px solid transparent;
|
||||||
|
color: var(--fg);
|
||||||
|
}
|
||||||
|
*::-webkit-scrollbar-thumb:hover{
|
||||||
|
color: var(--link);
|
||||||
|
}
|
||||||
|
|
||||||
|
*::-webkit-scrollbar-thumb {
|
||||||
|
box-shadow: inset 0 0 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width:600px) {
|
||||||
|
.not-required {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
position: relative;
|
||||||
|
color: var(--link);
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 0%;
|
||||||
|
border-bottom: 2px solid var(--fg);
|
||||||
|
transition: 0.4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover:after {
|
||||||
|
width: 100%;
|
||||||
|
color: var(--glow);
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
color: var(--glow);
|
||||||
|
}
|
||||||
|
|
||||||
|
a:active {
|
||||||
|
color: var(--header);
|
||||||
|
}
|
||||||
|
|
||||||
|
.categories {
|
||||||
|
background-color: var(--bg);
|
||||||
|
padding-top: 3rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category {
|
||||||
|
margin: .5rem 0rem;
|
||||||
|
padding: 0rem 1rem;
|
||||||
|
border-left: .125rem solid var(--fg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.category:first-child {
|
||||||
|
border-left: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
font-size: 1rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
font-family: consolas;
|
||||||
|
}
|
||||||
|
input, label, button {
|
||||||
|
font-size: inherit;
|
||||||
|
padding: .125rem .5rem;
|
||||||
|
/* the following ensures they're all using the same box-model for rendering */
|
||||||
|
-moz-box-sizing: content-box; /* or `border-box` */
|
||||||
|
-webkit-box-sizing: content-box;
|
||||||
|
box-sizing: content-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textbox {
|
||||||
|
width: 70%;
|
||||||
|
font-size: inherit;
|
||||||
|
background-color: var(--fg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
background-color: orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-pane {
|
||||||
|
width: 100%;
|
||||||
|
margin: .5rem 0rem;
|
||||||
|
background-color: var(--bg-grad-3);
|
||||||
|
border-radius: 1rem;
|
||||||
|
min-height: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-container {
|
||||||
|
width: 90%;
|
||||||
|
margin: .5rem 0rem;
|
||||||
|
background-color: var(--bg-grad-3);
|
||||||
|
border-radius: 1rem;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
flex-direction: row;
|
||||||
|
gap: 3rem 1.5rem;
|
||||||
|
padding: 2rem 1rem 2rem 1rem;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
flex: 4 0 1rem;
|
||||||
|
padding: .5rem 2.5rem 2rem;
|
||||||
|
background: var(--bg-secondary);
|
||||||
|
border-radius: .5rem;
|
||||||
|
transition: all 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-information {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
gap: 1rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-details {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1rem 1rem;
|
||||||
|
}
|
||||||
88
static/index.html
Normal file
88
static/index.html
Normal file
@ -0,0 +1,88 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> -->
|
||||||
|
<link rel="stylesheet" href="css/style.css" />
|
||||||
|
<title>WMGZON</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<nav class="navbar">
|
||||||
|
<img src="assets/img/WMGZON.png" id="logo" class="not-required" alt="WMGZON Logo">
|
||||||
|
<form action="test.html" method="get">
|
||||||
|
<input type="text" name="search" class="textbox">
|
||||||
|
<input type="submit" class="button">
|
||||||
|
</form>
|
||||||
|
<a href="login.html">Login/Signup</a>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<div class="sticky">
|
||||||
|
|
||||||
|
<div class="categories">
|
||||||
|
<a href="Car Parts" class="category">Car Parts</a>
|
||||||
|
<a href="Animals" class="category">Animals</a>
|
||||||
|
<a href="Sports" class="category">Sports</a>
|
||||||
|
<a href="Books" class="category">Books</a>
|
||||||
|
<a href="Phones" class="category">Phones</a>
|
||||||
|
<a href="Music" class="category">Music</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="filter-pane">
|
||||||
|
<div class="number-plate-filter"></div>
|
||||||
|
<div class="product-ordering not-required"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="product-container">
|
||||||
|
<div class="product">
|
||||||
|
<div class="product-title">12" Brake Disks</div>
|
||||||
|
<div class="product-information">
|
||||||
|
<div class="product-image">
|
||||||
|
<img src="assets/img/products/brake-disks.png" alt="Brake Disks"/>
|
||||||
|
</div>
|
||||||
|
<div class="product-details">
|
||||||
|
<div class="product-price">£64.50</div>
|
||||||
|
<div class="product-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="product-add-to-cart"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="product">
|
||||||
|
<div class="product-title">12" Brake Disks</div>
|
||||||
|
<div class="product-information">
|
||||||
|
<div class="product-image">
|
||||||
|
<img src="assets/img/products/brake-disks.png" alt="Brake Disks"/>
|
||||||
|
</div>
|
||||||
|
<div class="product-details">
|
||||||
|
<div class="product-price">£64.50</div>
|
||||||
|
<div class="product-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="product-add-to-cart"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="product">
|
||||||
|
<div class="product-title">12" Brake Disks</div>
|
||||||
|
<div class="product-information">
|
||||||
|
<div class="product-image">
|
||||||
|
<img src="assets/img/products/brake-disks.png" alt="Brake Disks"/>
|
||||||
|
</div>
|
||||||
|
<div class="product-details">
|
||||||
|
<div class="product-price">£64.50</div>
|
||||||
|
<div class="product-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="product-add-to-cart"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div style="height: 100rem;"></div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue
Block a user