PTS/SkyArtShop
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

webupdate

Browse Source
This commit is contained in:
Local Server
2026-01-19 01:17:43 -06:00
parent 5b86f796d6
commit f8068ba54c
65 changed files with 2165 additions and 520 deletions
Download Patch File Download Diff File Expand all files Collapse all files

163
website/public/product.html
View File

@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Product Details - Sky Art Shop" />
<title>Product - Sky Art Shop</title>
<link rel="icon" type="image/png" href="/favicon.png" />
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -21,14 +22,8 @@
/>
<!-- Modern Theme CSS -->
<link
rel="stylesheet"
href="/assets/css/modern-theme.css?v=20260118drawer"
/>
<link
rel="stylesheet"
href="/assets/css/mobile-fixes.css?v=20260119touch"
/>
<link rel="stylesheet" href="/assets/css/modern-theme.css?v=fix34" />
<link rel="stylesheet" href="/assets/css/mobile-fixes.css?v=20260119fix3" />
<style>
/* Product page breadcrumb - force single line */
@@ -66,6 +61,64 @@
gap: 3px !important;
margin-bottom: 12px !important;
}
/* Product detail mobile fixes */
.product-detail {
display: block !important;
width: 100% !important;
max-width: 100% !important;
padding: var(--spacing-md) 0 !important;
box-sizing: border-box !important;
}
.product-gallery {
position: static !important;
width: 100% !important;
max-width: 100% !important;
margin-bottom: var(--spacing-lg) !important;
}
.main-image {
position: relative !important;
width: 100% !important;
max-width: 100% !important;
height: 0 !important;
padding-bottom: 100% !important;
overflow: hidden !important;
border-radius: var(--radius-lg) !important;
}
.main-image img {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
.thumbnail-gallery {
width: 100% !important;
max-width: 100% !important;
}
.product-details {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
}
.product-details h1,
#productName {
font-size: 1.3rem !important;
word-break: break-word !important;
overflow-wrap: break-word !important;
}
.container {
max-width: 100% !important;
overflow-x: hidden !important;
}
}
.product-detail {
@@ -529,6 +582,34 @@
.product-gallery {
position: static;
}
/* Related Products - Horizontal Scroll on Mobile/Tablet */
#relatedProducts.products-grid {
display: flex !important;
flex-wrap: nowrap !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x mandatory;
gap: 12px;
padding-bottom: 12px;
}
#relatedProducts.products-grid .product-card {
flex: 0 0 160px;
min-width: 160px;
max-width: 160px;
scroll-snap-align: start;
}
}
@media (max-width: 480px) {
#relatedProducts.products-grid .product-card {
flex: 0 0 140px;
min-width: 140px;
max-width: 140px;
}
}
</style>
</head>
@@ -765,15 +846,63 @@
collaging stationery. Quality products for all your creative
needs.
</p>
<div class="footer-social">
<a href="#" class="social-link"><i class="bi bi-facebook"></i></a>
<a href="#" class="social-link"
<div class="footer-social" id="footerSocialLinks">
<a
href="#"
class="social-link"
id="footerFacebook"
style="display: none"
><i class="bi bi-facebook"></i
></a>
<a
href="#"
class="social-link"
id="footerInstagram"
style="display: none"
><i class="bi bi-instagram"></i
></a>
<a href="#" class="social-link"
<a
href="#"
class="social-link"
id="footerTwitter"
style="display: none"
><i class="bi bi-twitter-x"></i
></a>
<a
href="#"
class="social-link"
id="footerYoutube"
style="display: none"
><i class="bi bi-youtube"></i
></a>
<a
href="#"
class="social-link"
id="footerPinterest"
style="display: none"
><i class="bi bi-pinterest"></i
></a>
<a href="#" class="social-link"><i class="bi bi-youtube"></i></a>
<a
href="#"
class="social-link"
id="footerTiktok"
style="display: none"
><i class="bi bi-tiktok"></i
></a>
<a
href="#"
class="social-link"
id="footerWhatsapp"
style="display: none"
><i class="bi bi-whatsapp"></i
></a>
<a
href="#"
class="social-link"
id="footerLinkedin"
style="display: none"
><i class="bi bi-linkedin"></i
></a>
</div>
</div>
@@ -802,9 +931,9 @@
<div class="footer-column">
<h4>Contact Us</h4>
<ul class="footer-links">
<li><i class="bi bi-envelope"></i> hello@skyartshop.com</li>
<li><i class="bi bi-telephone"></i> (555) 123-4567</li>
<li><i class="bi bi-geo-alt"></i> 123 Creative Lane</li>
<li><i class="bi bi-envelope"></i> skyartshop12.11@gmail.com</li>
<li><i class="bi bi-telephone"></i> (501) 608-0409</li>
<li><i class="bi bi-geo-alt"></i> Belmopan, Cayo District</li>
</ul>
</div>
</div>
@@ -854,7 +983,7 @@
<!-- Scripts -->
<script src="/assets/js/mobile-touch-fix.js"></script>
<script src="/assets/js/modern-theme.js?v=20260119touch"></script>
<script src="/assets/js/modern-theme.js?v=20260118g"></script>
<script src="/assets/js/customer-auth.js?v=20260116c"></script>
<script>
let currentProduct = null;