muayjtp/web_design
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

updated code

Browse source
This commit is contained in:
JSriwongsa 2023-07-07 15:13:27 -05:00
parent 04c4c42af4
commit 7787a323cb
3 changed files with 128 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
ecommerce/fashion_website/index.html
View file

@ -63,7 +63,7 @@
<div class="links">
<h3>Clothing</h3>
<ul>
<li><a href="#">Tops</a></li>
<li><a href="pages/page-category.html">Tops</a></li>
<li><a href="#">Buttoms</a></li>
<li><a href="#">Dresses</a></li>
<li><a href="#">Beachwear</a></li>
@ -96,7 +96,7 @@
<div class="product-thumb">
<span class="label">20% OFF</span>
<div class="thumbnail">
<a href="#">
<a href="pages/page.html">
<div class="image">
<img src="images/top/top1.jpg" alt="">
</div>
@ -114,7 +114,7 @@
</div>
</div>
<div class="product-info">
<h2><a href="#">Castleton Green Halterneck Top</a></h2>
<h2><a href="pages/page.html">Castleton Green Halterneck Top</a></h2>
<div class="price">
<span class="before">$279.00</span>
<span class="current">$223.00</span>
@ -225,12 +225,12 @@
</a>
</div>
<div class="list">
<a href="#">
<a href="pages/page-category.html">
<div class="image">
<img src="images/main-5.jpg" alt="">
</div>
<div class="info">
<div class="btn-signUp">Sweater</div>
<div class="btn-signUp">Tops</div>
</div>
</a>
</div>
@ -624,7 +624,7 @@
<a href="#" class="color-11"></a>
<a href="#" class="color-12"></a>
</div>
<h2><a href="#">Onyx Dress with Embroidery</a></h2>
<h2><a href="#">Outerwear Winter Coat</a></h2>
<div class="price">
<span class="before">$599.00</span>
<span class="current">$419.00</span>
@ -657,7 +657,7 @@
<a href="#" class="color-13 active"></a>
<a href="#" class="color-1"></a>
</div>
<h2><a href="#">Sequin-fringe Skirt</a></h2>
<h2><a href="#">Neck Knitted Crop Top</a></h2>
<div class="price">
<span class="before">$109.00</span>
<span class="current">$98.00</span>
@ -735,7 +735,7 @@
<div class="product-thumb">
<span class="label">20% OFF</span>
<div class="thumbnail">
<a href="#">
<a href="pages/page.html">
<div class="image">
<img src="images/top/top1.jpg" alt="">
</div>
@ -757,7 +757,7 @@
<a href="#" class="color-18 active"></a>
<a href="#" class="color-14"></a>
</div>
<h2><a href="#">Castleton Green Halterneck Top</a></h2>
<h2><a href="">Castleton Green Halterneck Top</a></h2>
<div class="price">
<span class="before">$279.00</span>
<span class="current">$223.00</span>

110
ecommerce/fashion_website/pages/page-category.html
View file

@ -30,7 +30,7 @@
<div class="header-center">
<nav class="menu">
<ul>
<li><a href=""><span>Home</span></a></li>
<li><a href="../index.html"><span>Home</span></a></li>
<li><a href=""><span>Products</span><i class='bx bx-chevron-down'></i></a>
<ul class="sub-mega">
<li>
@ -41,7 +41,7 @@
<div class="wrapper">
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
<a href="page.html" class="product-link"></a>
<div class="thumbnail">
<img src="images/top1.jpg" alt="">
</div>
@ -62,7 +62,6 @@
<div class="product-price">
<span class="before">$279.00</span>
<span class="current">$223.00</span>
</div>
</div>
</div>
@ -252,6 +251,7 @@
<button class="color3"></button>
<button class="color4"></button>
<button class="color5"></button>
<button class="color6"></button>
</div>
</div>
</div>
@ -452,6 +452,109 @@
</div>
</div>
</div>
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
<div class="thumbnail">
<img src="images/tops2.jpg" alt="">
</div>
<div class="thumbnail hover">
<img src="images/tops2-1.jpg" alt="">
</div>
<div class="actions">
<ul>
<li><a href=""><i class='bx bx-heart'></i></a></li>
<li><a href=""><i class='bx bx-share-alt' ></i></a></li>
<li><a href=""><i class='bx bx-store-alt' ></i></a></li>
</ul>
</div>
</div>
<div class="dot-info">
<h2 class="dot-title"><a href="">Crop Knit Turtleneck Sweater</a></h2>
<div class="product-price">
<span class="current">$89.00</span>
</div>
</div>
</div>
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
<div class="thumbnail">
<img src="images/on2.jpg" alt="">
</div>
<div class="thumbnail hover">
<img src="images/on2-1.jpg" alt="">
</div>
<div class="actions">
<ul>
<li><a href=""><i class='bx bx-heart'></i></a></li>
<li><a href=""><i class='bx bx-share-alt' ></i></a></li>
<li><a href=""><i class='bx bx-store-alt' ></i></a></li>
</ul>
</div>
<div class="label"><span>10% OFF</span></div>
</div>
<div class="dot-info">
<h2 class="dot-title"><a href="">Neck Knitted Crop Top</a></h2>
<div class="product-price">
<span class="before">$109.00</span>
<span class="current">$98.00</span>
</div>
</div>
</div>
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
<div class="thumbnail">
<img src="images/top1.jpg" alt="">
</div>
<div class="thumbnail hover">
<img src="images/top1-1.jpg" alt="">
</div>
<div class="actions">
<ul>
<li><a href=""><i class='bx bx-heart'></i></a></li>
<li><a href=""><i class='bx bx-share-alt' ></i></a></li>
<li><a href=""><i class='bx bx-store-alt' ></i></a></li>
</ul>
</div>
<div class="label"><span>20% OFF</span></div>
</div>
<div class="dot-info">
<h2 class="dot-title"><a href="">Castleton Green Halterneck Top</a></h2>
<div class="product-price">
<span class="before">$279.00</span>
<span class="current">$223.00</span>
</div>
</div>
</div>
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
<div class="thumbnail">
<img src="images/top3.jpg" alt="">
</div>
<div class="thumbnail hover">
<img src="images/top3-1.jpg" alt="">
</div>
<div class="actions">
<ul>
<li><a href=""><i class='bx bx-heart'></i></a></li>
<li><a href=""><i class='bx bx-share-alt' ></i></a></li>
<li><a href=""><i class='bx bx-store-alt' ></i></a></li>
</ul>
</div>
<div class="label"><span>25% OFF</span></div>
</div>
<div class="dot-info">
<h2 class="dot-title"><a href="">Scoop-neck T-shirt</a></h2>
<div class="product-price">
<span class="before">$99.00</span>
<span class="current">$74.00</span>
</div>
</div>
</div>
<div class="item">
<div class="dot-image">
<a href="" class="product-link"></a>
@ -475,7 +578,6 @@
<div class="product-price">
<span class="before">$125.00</span>
<span class="current">$93.00</span>
</div>
</div>
</div>

17
ecommerce/fashion_website/pages/page.css
View file

@ -634,6 +634,18 @@ form :where(input, textarea, select)::placeholder{
.summary .product-color button.color2{
background-color: #13274F;
}
.summary .product-color button.color3{
background-color: black;
}
.summary .product-color button.color4{
background-color: whitesmoke;
}
.summary .product-color button.color5{
background-color: #dac292;
}
.summary .product-color button.color6{
background-color: red;
}
.summary .product-color button.selected, .summary .product-color button:hover:not(.selected){
box-shadow: inset 0 0 0 1px var(--white-color);
}
@ -1071,7 +1083,7 @@ form .button .secondary-btn{
.product-list li{
margin-bottom: 30px;
}
.product-list .grouping{
.product-list li .grouping{
position: relative;
float: left;
padding-left: 45px;
@ -1412,9 +1424,6 @@ input.checking:checked::after{
@media(min-width:481px){
.product.wrapper{
--gutter:60px;