AJZ Posted July 28, 2023 Posted July 28, 2023 I've been really struggling to get the mobile view of Squarespace's calendar to look right. Here are some possible solutions in order of preference. 1. Keep it simple and find a way for the calendar to format properly in mobile. Most importantly, this includes having the underline of the flyout on vertical mobile not behave like strike-through of the title. This also includes improving the functionality of the flyout on horizontal mobile to eliminate the poor user-experience of having hover effects on a click-through item on a cell phone screen. And in a perfect world, this would also include retaining the thumbnail for the calendar in all locations. One compromise on thumbnails in the vertical mobile view is changing the color of the event dates. Not ideal, but I can work with it. 2. Remove the flyout completely while still enabling the viewer to click on event days. This is a compromise. If the flyout doesn't work properly on mobile, perhaps I can just get rid of the flyout while still permitting for clickthrough when someone clicks an event date. I've found a way to get rid of the flyouts, but it also disables clickthrough for the event dates. So, that doesn't help. 3. Find a calendar plugin that is professional in quality but doesn't charge a monthly fee. I'd rather not go this route, but I'm looking to see what options are available. If anyone recommends another calendar product (that doesn't charge a large monthly fee), I'm open to it. If anyone could help, I'd be appreciative. I've spent an embarrassing amount of time spinning my wheels on this one and have nothing to show for it.
tuanphan Posted July 29, 2023 Posted July 29, 2023 Hi, Can you share link to page where you use calendar? We can check easier AJZ 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
AJZ Posted July 29, 2023 Author Posted July 29, 2023 Site is: dream.industries. There are test dates in August. Thank you!!! - even just for looking into it!
Solution creedon Posted July 29, 2023 Solution Posted July 29, 2023 I don't have any solutions but some observations. Quote Most importantly, this includes having the underline of the flyout on vertical mobile not behave like strike-through of the title. Note for other helpers, it is not a strike through. It is a CSS background-image property, part of the Flex animation. It appears the issue is related to the beloved-sans font having a large descender height causing the background-image to overlap when things get tight. Here is the descender when I force the font-family to sans-serif, This is how it looks when cramped. A solution to this issue might be to not use the beloved-sans for the calendar or not use the font. I'm not a font expert so I don't know if my terminology is right. AJZ 1 Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.
AJZ Posted July 30, 2023 Author Posted July 30, 2023 Thank you! I can see how an obscure font might be treated differently - much appreciated.
AJZ Posted July 30, 2023 Author Posted July 30, 2023 Just wanted to say thanks for your help. You guys have helped me plenty of times over the last couple years ((a few times directly, many times indirectly). For this one, I think the solution for now is simply to not make the calendar the focal point of the website. The site is still in the inception stage, so this is an easy shift. Thanks always
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment