webupdate
This commit is contained in:
Local Server
@@ -8,6 +8,7 @@
|
||||
content="Sky Art Shop - Your one-stop shop for scrapbooking, journaling, cardmaking, and collaging stationery."
|
||||
/>
|
||||
<title>Sky Art Shop - Creative Stationery & Crafting Supplies</title>
|
||||
<link rel="icon" type="image/png" href="/favicon.png" />
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
@@ -24,10 +25,7 @@
|
||||
/>
|
||||
|
||||
<!-- Modern Theme CSS -->
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="/assets/css/modern-theme.css?v=20260118drawer"
|
||||
/>
|
||||
<link rel="stylesheet" href="/assets/css/modern-theme.css?v=fix33" />
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="/assets/css/mobile-fixes.css?v=20260119touch"
|
||||
@@ -170,6 +168,71 @@
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
/* Featured Products - Horizontal Scroll */
|
||||
#featuredProductsGrid.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: 20px;
|
||||
padding: 8px 0 16px 0;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid::-webkit-scrollbar {
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid::-webkit-scrollbar-track {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid::-webkit-scrollbar-thumb {
|
||||
background: var(--primary-pink-dark, #fcb1d8);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid::-webkit-scrollbar-thumb:hover {
|
||||
background: var(--primary-pink, #ffd0d0);
|
||||
}
|
||||
|
||||
/* Product cards in horizontal scroll */
|
||||
#featuredProductsGrid.products-grid .product-card {
|
||||
flex: 0 0 280px;
|
||||
min-width: 280px;
|
||||
max-width: 280px;
|
||||
scroll-snap-align: start;
|
||||
}
|
||||
|
||||
/* Tablet */
|
||||
@media (max-width: 992px) {
|
||||
#featuredProductsGrid.products-grid .product-card {
|
||||
flex: 0 0 220px;
|
||||
min-width: 220px;
|
||||
max-width: 220px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media (max-width: 576px) {
|
||||
#featuredProductsGrid.products-grid .product-card {
|
||||
flex: 0 0 180px;
|
||||
min-width: 180px;
|
||||
max-width: 180px;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid .product-card .product-name {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
#featuredProductsGrid.products-grid .product-card .product-price {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -398,15 +461,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>
|
||||
|
||||
@@ -435,9 +546,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>
|
||||
@@ -536,7 +647,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"></script>
|
||||
<script>
|
||||
// Homepage settings cache
|
||||
@@ -567,7 +678,7 @@
|
||||
SkyArtShop.initSlider();
|
||||
}
|
||||
|
||||
// Load products - only show featured products (max 4)
|
||||
// Load products - show all featured products (horizontal scroll)
|
||||
const featuredProducts = await API.loadFeaturedProducts();
|
||||
const featuredGrid = document.getElementById("featuredProductsGrid");
|
||||
|
||||
@@ -578,8 +689,8 @@
|
||||
titleEl.textContent = homepageSettings.featuredProducts.title;
|
||||
}
|
||||
|
||||
// Store products for detail view - only featured products, max 4
|
||||
const homepageProducts = featuredProducts.slice(0, 4);
|
||||
// Store products for detail view - show all featured products
|
||||
const homepageProducts = featuredProducts;
|
||||
|
||||
if (featuredGrid) {
|
||||
if (homepageProducts.length > 0) {
|
||||
|
||||
Reference in New Issue
Block a user