jack0657
-
Posts
4 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by jack0657
-
have to refresh website on phone to display images on summary block
jack0657 replied to jack0657's topic in Images & Videos
Thank you!!!!! Seems to have solved the problem. Do you know how I might create more of a space/gap between the image and the heading on mobile? https://www.itsalllegalbaby.com/alb-library -
have to refresh website on phone to display images on summary block
jack0657 replied to jack0657's topic in Images & Videos
Hi. Thanks for your help. The specific page is https://www.itsalllegalbaby.com/alb-library - but you need to view it via mobile to see the issue. -
Hi, I have to refresh my website on a mobile to display images on summary squarespace - they don't show on first load, any advice to solve this would be great 🙏 (works fine on desktop). I have used CSS to make the image in summary block of a blog larger on mobile display, here is all my summary block code: .summary-header-text { font-size: 25px; font-weight: bold; } .summary-metadata-item--cats a { background-color: black; color: white; text-decoration: none; padding: 5px 10px; margin-right: 5px; border-radius: 0px; display: inline-block; margin-bottom: 5px; } .blog-meta-item--categories a { background-color: black; color: white !important; text-decoration: none; padding: 5px 10px; margin-right: 5px; border-radius: 0px; display: inline-block; margin-bottom: 5px; } @media screen and (max-width:767px) { body#collection-65b0437eb6958532f041c98f .summary-item, body.alb-library .summary-item { display: flex !important; flex-direction: column; justify-content: center !important; align-items: center !important; } body#collection-65b0437eb6958532f041c98f .summary-v2-block .summary-thumbnail-outer-container, body.alb-library .summary-v2-block .summary-thumbnail-outer-container { float: none !important; width: 108% !important; margin: 0 auto; padding: 0; } body#collection-65b0437eb6958532f041c98f .summary-thumbnail-outer-container img, body.alb-library .summary-thumbnail-outer-container img { width: 100% !important; height: auto !important; display: block; margin: 0 auto; } body#collection-65b0437eb6958532f041c98f .sqs-gallery-design-list .sqs-gallery-design-list-slide:not(.no-image) .sqs-gallery-meta-container, body.alb-library .sqs-gallery-design-list .sqs-gallery-design-list-slide:not(.no-image) .sqs-gallery-meta-container { float: none !important; width: 100% !important; } } Thanks in advance.
-
Hi, Can anyone tell me why this custom code isnt working? It is meant to say either open or closed depending on the time of day (business opening hours) but it permantly says closed: <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> body { font-family: Arial, sans-serif; } h3 { color: #636363; } .pill-box { display: inline-block; background-color: #ffaa00; color: white; padding: 4px 8px; margin-left: 10px; border-radius: 20px; font-weight: bold; } .day { color: #ffaa00; } .time { color: #979797; } </style> </head> <body> <p> </p> <h3 style="text-align: center;">Opening Hours<span class="pill-box" id="opening-status">Open</span></h3> <p style="text-align: center;"><strong><span class="day">Monday:</span></strong> <span class="time" id="monday-time">4:00 PM - 12:00 AM</span></p> <p style="text-align: center;"><strong><span class="day">Tuesday:</span></strong> <span class="time" id="tuesday-time">9:00 AM - 7:00 PM</span></p> <p style="text-align: center;"><strong><span class="day">Wednesday:</span></strong> <span class="time" id="wednesday-time">9:00 AM - 11:00 AM</span></p> <p style="text-align: center;"><strong><span class="day">Thursday:</span></strong> <span class="time" id="thursday-time">4:00 PM - 12:00 AM</span></p> <p style="text-align: center;"><strong><span class="day">Friday:</span></strong> <span class="time" id="friday-time">12:00 PM - 12:00 AM</span></p> <p style="text-align: center;"><strong><span class="day">Saturday:</span></strong> <span class="time" id="saturday-time">6:00 PM - 11:00 PM</span></p> <p style="text-align: center;"><strong><span class="day">Sunday:</span></strong> <span class="time" id="sunday-time">12:00 PM - 11:00 PM</span></p> <script type="text/javascript"> // Function to check if the business is open based on the current time function isOpenNow() { const currentTime = new Date().toLocaleTimeString('en-US', { hour: 'numeric', minute: 'numeric' }); const openingHours = { monday: '16:00 - 00:00', tuesday: '9:00 - 19:00', wednesday: '9:00 - 11:00', thursday: '16:00 - 00:00', friday: '12:00 - 00:00', saturday: '18:00 - 23:00', sunday: '12:00 - 23:00', }; const currentDay = new Date().toLocaleDateString('en-US', { weekday: 'long' }).toLowerCase(); const openingTime = openingHours[currentDay].split(' - ')[0]; const closingTime = openingHours[currentDay].split(' - ')[1]; return currentTime >= openingTime && currentTime <= closingTime; } // Function to update the opening status pill based on whether the business isopen or closed function updateOpeningStatus() { const pill = document.getElementById('opening-status'); const isOpen = isOpenNow(); pill.textContent = isOpen ? 'Open' : 'Closed'; pill.style.backgroundColor = isOpen ? '#ffaa00' : '#636363'; } // Call the updateOpeningStatus function initially to set the initial opening status updateOpeningStatus(); // Update the opening status every minute setInterval(updateOpeningStatus, 60000); </script> <p> </p> </body> </html>
