2025-08-04 11:44:00 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Product Catalog< / title >
< link rel = "stylesheet" href = "style.css" / >
< / head >
< body >
< div class = "page-wrapper" >
2025-08-05 06:00:54 +00:00
< div class = "nav-1-wrapper" > < nav class = "nav-1-navbar" > < div class = "nav-1-logo" > Radiance Jewels< / div > < ul class = "nav-1-nav-links" > < li > < a href = "index.html" > Home< / a > < / li > < li > < a href = "product_catalog.html" > Product Catalog< / a > < / li > < li > < a href = "shopping_cart.html" > Shopping Cart< / a > < / li > < li > < a href = "checkout.html" > Checkout< / a > < / li > < li > < a href = "login.html" > Login< / a > < / li > < li > < a href = "dashboard.html" > Dashboard< / a > < / li > < li > < a href = "order_history.html" > Order History< / a > < / li > < li > < a href = "user_profile.html" > User Profile< / a > < / li > < li > < a href = "sign_up.html" > Sign Up< / a > < / li > < / ul > < div class = "nav-1-nav-actions" > < button class = "nav-1-btn nav-1-outline" > Sign Up< / button > < button class = "nav-1-btn nav-1-solid" > Login< / button > < / div > < / nav > < / div >
2025-08-04 11:44:00 +00:00
< section class = "category-header" >
< div class = "container" >
< nav aria-label = "Breadcrumb" class = "breadcrumbs" >
< ol >
< li > < a href = "#" > Home< / a > < / li >
< li > < a href = "#" > Jewelry< / a > < / li >
< li > Rings< / li >
< / ol >
< / nav >
< h1 class = "category-title" > Rings Collection< / h1 >
< p class = "category-description" > Explore our exquisite range of rings, from timeless classics to modern statements, crafted with precision and passion. Discover the perfect piece to symbolize your unique story.< / p >
< / div >
< / section >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Product Grid Section< / title >
< link rel = "stylesheet" href = "style.css" / >
< link rel = "stylesheet" href = "style.css" / >
< section class = "product-grid-section" >
< div class = "container" >
< header class = "section-header" >
< h2 > Our Exquisite Collections< / h2 >
< p > Discover a wide range of handcrafted jewelry, from timeless classics to modern designs, perfect for every occasion.< / p >
< / header >
< div class = "product-grid" role = "grid" aria-label = "Jewelry Products" >
<!-- Product Card 1: Ring -->
< a href = "/product/1" class = "product-card" role = "gridcell" aria-labelledby = "product1-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/E0D8CC/555555?text=Elegant+Diamond+Ring" alt = "Elegant Diamond Ring" >
< / div >
< div class = "product-card-content" >
< h3 id = "product1-title" > Classic Diamond Solitaire Ring< / h3 >
< p class = "description" > A timeless piece featuring a brilliant-cut diamond set in 18k white gold.< / p >
< p class = "price" > ₹75,000< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 2: Necklace -->
< a href = "/product/2" class = "product-card" role = "gridcell" aria-labelledby = "product2-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/D1C4E9/555555?text=Sapphire+Necklace" alt = "Enchanted Sapphire Necklace" >
< / div >
< div class = "product-card-content" >
< h3 id = "product2-title" > Enchanted Sapphire Pendant Necklace< / h3 >
< p class = "description" > Dazzling sapphire pendant with delicate chain, perfect for evening wear.< / p >
< p class = "price" > ₹42,500< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 3: Bangle -->
< a href = "/product/3" class = "product-card" role = "gridcell" aria-labelledby = "product3-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/C8E6C9/555555?text=Gold+Filigree+Bangle" alt = "Traditional Gold Filigree Bangle" >
< / div >
< div class = "product-card-content" >
< h3 id = "product3-title" > Traditional Gold Filigree Bangle< / h3 >
< p class = "description" > Intricately designed 22k gold bangle, showcasing artisanal craftsmanship.< / p >
< p class = "price" > ₹98,000< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 4: Earrings -->
< a href = "/product/4" class = "product-card" role = "gridcell" aria-labelledby = "product4-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/FFECB3/555555?text=Pearl+Drop+Earrings" alt = "Baroque Pearl Drop Earrings" >
< / div >
< div class = "product-card-content" >
< h3 id = "product4-title" > Baroque Pearl Drop Earrings< / h3 >
< p class = "description" > Exquisite freshwater pearls suspended from elegant gold settings.< / p >
< p class = "price" > ₹28,750< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 5: Ring -->
< a href = "/product/5" class = "product-card" role = "gridcell" aria-labelledby = "product5-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/FFCCBC/555555?text=Emerald+Ring" alt = "Regal Emerald Cut Ring" >
< / div >
< div class = "product-card-content" >
< h3 id = "product5-title" > Regal Emerald Cut Ring< / h3 >
< p class = "description" > Stunning emerald-cut gemstone surrounded by pavé diamonds.< / p >
< p class = "price" > ₹62,000< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 6: Necklace -->
< a href = "/product/6" class = "product-card" role = "gridcell" aria-labelledby = "product6-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/BBDEFB/555555?text=Rose+Gold+Necklace" alt = "Delicate Rose Gold Chain" >
< / div >
< div class = "product-card-content" >
< h3 id = "product6-title" > Delicate Rose Gold Chain with Charm< / h3 >
< p class = "description" > Subtle and elegant rose gold chain with a dainty charm.< / p >
< p class = "price" > ₹18,500< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 7: Bangle -->
< a href = "/product/7" class = "product-card" role = "gridcell" aria-labelledby = "product7-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/DCEDC8/555555?text=Diamond+Tennis+Bracelet" alt = "Sparkling Diamond Tennis Bracelet" >
< / div >
< div class = "product-card-content" >
< h3 id = "product7-title" > Sparkling Diamond Tennis Bracelet< / h3 >
< p class = "description" > A continuous line of brilliant diamonds, timeless and luxurious.< / p >
< p class = "price" > ₹1,20,000< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
<!-- Product Card 8: Earrings -->
< a href = "/product/8" class = "product-card" role = "gridcell" aria-labelledby = "product8-title" >
< div class = "product-card-image" >
< img src = "https://via.placeholder.com/300x250/FFE0B2/555555?text=Hoop+Earrings" alt = "Contemporary Hoop Earrings" >
< / div >
< div class = "product-card-content" >
< h3 id = "product8-title" > Contemporary Gold Hoop Earrings< / h3 >
< p class = "description" > Modern design gold hoops, lightweight and stylish for daily wear.< / p >
< p class = "price" > ₹15,000< / p >
< div class = "product-card-actions" >
< button class = "btn btn-primary" > Add to Cart< / button >
< button class = "btn btn-secondary" > View Details< / button >
< / div >
< / div >
< / a >
< / div >
< / div >
< / section >
< div class = "filter-sort-section" >
< div class = "filter-sort-header" >
< h2 class = "filter-sort-title" > Filter & Sort< / h2 >
< button class = "filter-sort-toggle-button" aria-expanded = "false" aria-controls = "filterSortControls" >
< span class = "sr-only" > Toggle Filters< / span >
⋮
< / button >
< / div >
< div id = "filterSortControls" class = "filter-sort-controls" >
< div class = "filter-group" >
< fieldset class = "filter-fieldset" >
< legend class = "filter-legend" > Category< / legend >
< ul class = "filter-options-list" >
< li class = "filter-option-item" >
< input type = "checkbox" id = "categoryRings" name = "category" value = "rings" >
< label for = "categoryRings" > Rings< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "categoryNecklaces" name = "category" value = "necklaces" >
< label for = "categoryNecklaces" > Necklaces< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "categoryBangles" name = "category" value = "bangles" >
< label for = "categoryBangles" > Bangles< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "categoryEarrings" name = "category" value = "earrings" >
< label for = "categoryEarrings" > Earrings< / label >
< / li >
< / ul >
< / fieldset >
< fieldset class = "filter-fieldset" >
< legend class = "filter-legend" > Price Range< / legend >
< div class = "price-range-inputs" >
< input type = "number" id = "priceMin" name = "priceMin" placeholder = "Min" min = "0" value = "0" class = "price-input" >
< span class = "price-separator" > -< / span >
< input type = "number" id = "priceMax" name = "priceMax" placeholder = "Max" min = "0" value = "50000" class = "price-input" >
< / div >
< / fieldset >
< fieldset class = "filter-fieldset" >
< legend class = "filter-legend" > Material< / legend >
< ul class = "filter-options-list" >
< li class = "filter-option-item" >
< input type = "checkbox" id = "materialGold" name = "material" value = "gold" >
< label for = "materialGold" > Gold< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "materialSilver" name = "material" value = "silver" >
< label for = "materialSilver" > Silver< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "materialPlatinum" name = "material" value = "platinum" >
< label for = "materialPlatinum" > Platinum< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "materialDiamond" name = "material" value = "diamond" >
< label for = "materialDiamond" > Diamond< / label >
< / li >
< / ul >
< / fieldset >
< fieldset class = "filter-fieldset" >
< legend class = "filter-legend" > Gemstone< / legend >
< ul class = "filter-options-list" >
< li class = "filter-option-item" >
< input type = "checkbox" id = "gemstoneRuby" name = "gemstone" value = "ruby" >
< label for = "gemstoneRuby" > Ruby< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "gemstoneEmerald" name = "gemstone" value = "emerald" >
< label for = "gemstoneEmerald" > Emerald< / label >
< / li >
< li class = "filter-option-item" >
< input type = "checkbox" id = "gemstoneSapphire" name = "gemstone" value = "sapphire" >
< label for = "gemstoneSapphire" > Sapphire< / label >
< / li >
< / ul >
< / fieldset >
< / div >
< div class = "sort-group" >
< fieldset class = "sort-fieldset" >
< legend class = "sort-legend" > Sort By< / legend >
< div class = "sort-options-select" >
< select id = "sortBy" name = "sortBy" >
< option value = "popularity" > Popularity< / option >
< option value = "price-asc" > Price: Low to High< / option >
< option value = "price-desc" > Price: High to Low< / option >
< option value = "new-arrivals" > New Arrivals< / option >
< / select >
< / div >
< / fieldset >
< / div >
< div class = "filter-sort-actions" >
< button type = "button" class = "apply-filters-button" > Apply Filters< / button >
< button type = "button" class = "reset-filters-button" > Reset< / button >
< / div >
< / div >
< / div >
< nav aria-label = "Pagination Controls" class = "pagination-controls" >
< ul class = "pagination-list" >
< li class = "pagination-item disabled" >
< a href = "#" class = "pagination-link" aria-label = "Previous Page" >
< span class = "pagination-arrow" > «< / span > Previous
< / a >
< / li >
< li class = "pagination-item" >
< a href = "#" class = "pagination-link" aria-label = "Page 1" > 1< / a >
< / li >
< li class = "pagination-item active" >
< span class = "pagination-link current-page" aria-current = "page" aria-label = "Current Page, Page 2" > 2< / span >
< / li >
< li class = "pagination-item" >
< a href = "#" class = "pagination-link" aria-label = "Page 3" > 3< / a >
< / li >
< li class = "pagination-item ellipsis" >
< span class = "pagination-link" aria-hidden = "true" > ...< / span >
< / li >
< li class = "pagination-item" >
< a href = "#" class = "pagination-link" aria-label = "Page 10" > 10< / a >
< / li >
< li class = "pagination-item" >
< a href = "#" class = "pagination-link" aria-label = "Next Page" >
Next < span class = "pagination-arrow" > »< / span >
< / a >
< / li >
< / ul >
< / nav >
< section class = "promotion-banner" >
< div class = "container" >
< div class = "promotion-content" >
< h2 class = "promotion-title" > Unlock Radiance: Up to 30% Off Diamonds!< / h2 >
< p class = "promotion-description" > Discover breathtaking diamond collections for a limited time. Elevate your style with exquisite brilliance.< / p >
< a href = "#shop-diamonds" class = "btn btn-primary promotion-cta" > Shop Diamond Collection< / a >
< / div >
< div class = "promotion-image" >
< img src = "https://via.placeholder.com/600x400/F8F8F8/333333?text=Exquisite+Jewelry+Promotion" alt = "Elegant diamond necklace and earrings on display, part of the promotion." >
< / div >
< / div >
< / section >
< div class = "footer-1-wrapper" > < section class = "footer-1-section" > < div class = "footer-1-top" > < div class = "footer-1-brand" > < h3 class = "footer-1-logo" > Gleam Jewels< / h3 > < p class = "footer-1-newsletter-text" > Unlock exclusive sparkle! Join our newsletter for dazzling new arrivals, special offers, and styling tips.< / p > < div class = "footer-1-newsletter-form" > < input type = "email" placeholder = "Your email address" > < button class = "footer-1-subscribe-btn" > Shine With Us< / button > < / div > < p class = "footer-1-privacy-note" > < span > By subscribing you agree to with our < / span > < a href = "#" > Privacy Policy< / a > < span > and provide consent to receive updates from our company.< / span > < / p > < / div > < div class = "footer-1-columns" > < div class = "footer-1-column" > < h4 > Explore< / h4 > < ul > < li > < a href = "rings.html" > Rings< / a > < / li > < li > < a href = "necklaces.html" > Necklaces< / a > < / li > < li > < a href = "bangles.html" > Bangles< / a > < / li > < li > < a href = "earrings.html" > Earrings< / a > < / li > < li > < a href = "new_arrivals.html" > New Arrivals< / a > < / li > < / ul > < / div > < div class = "footer-1-column" > < h4 > Support< / h4 > < ul > < li > < a href = "about_us.html" > About Us< / a > < / li > < li > < a href = "contact_us.html" > Contact Us< / a > < / li > < li > < a href = "faq.html" > FAQ< / a > < / li > < li > < a href = "shipping_returns.html" > Shipping & Returns< / a > < / li > < li > < a href = "customer_dashboard.html" > Customer Dashboard< / a > < / li > < / ul > < / div > < div class = "footer-1-column footer-1-social" > < h4 > Follow us< / h4 > < ul > < li > < i class = "fab fa-facebook" > < / i > < span > Facebook< / span > < / li > < li > < i class = "fab fa-instagram" > < / i > < span > Instagram< / span > < / li > < li > < i class = "fab fa-x-twitter" > < / i > < span > X< / span > < / li > < li > < i class = "fab fa-linkedin" > < / i > < span > LinkedIn< / span > < / li > < li > < i class = "fab fa-youtube" > < / i > < span > Youtube< / span > < / li > < / ul > < / div > < / div > < / div > < div class = "footer-1-bottom" > < p > © 2025 Gleam Jewels. All rights reserved.< / p > < ul class = "footer-1-links" > < li > < a href = "product_detail.html" > Product Detail< / a > < / li > < li > < a href = "order_confirmation.html" > Order Confirmation< / a > < / li > < li > < a href = "admin_login.html" > Admin Login< / a > < / li > < li > < a href = "admin_dashboard.html" > Admin Dashboard< / a > < / li > < li > < a href = "admin_product_management.html" > Admin Product Management< / a > < / li > < li > < a href = "admin_add_product.html" > Admin Add Product< / a > < / li > < li > < a href = "admin_edit_product.html" > Admin Edit Product< / a > < / li > < li > < a href = "admin_order_management.html" > Admin Order Management< / a > < / li > < li > < a href = "admin_user_management.html" > Admin User Management< / a > < / li > < / ul > < / div > < / section > < / div >
2025-08-05 06:00:54 +00:00
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Product Grid Section< / title >
< link rel = "stylesheet" href = "style.css" / >
< link rel = "stylesheet" href = "style.css" / >
2025-08-04 11:44:00 +00:00
< / div >
< script >
document.addEventListener('DOMContentLoaded', function() {
document.body.style.display = 'none';
setTimeout(function() { document.body.style.display = ''; }, 10);
});
< / script >
< / body >
< / html >
