brandi_sqspace Posted August 26, 2020 Posted August 26, 2020 Site URL: https://www.brandingofficehours.com I'm in SQSP 7.1. My site isn't able to view live right now (I have some MX records messed up; it's not just pw protected), so I can't send you there for reference. But, attaching a couple of images. The deal is: The site title appears white on some pages, and it's overlaying a background image that's black. But, because I need the user to see the text next to the images to the left, I have to position the focal point to over the light beige area instead. In doing so, it means that the site title is white over beige (unreadable) when on mobile. It only happens on some pages, so I'd love to be able to: Change the site title color while user is on mobile AND, only have that happen on specific pages (not site-wide). Is this possible with page-specific coding?
tuanphan Posted August 28, 2020 Posted August 28, 2020 What is access password? 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!)
IXStudio Posted August 28, 2020 Posted August 28, 2020 Hi Use this code in Design -> Custom CSS It works only for this page. @media screen and (max-width:640px){ #collection-5f3fd0df46b52a672c2e6bd2 .header-announcement-bar-wrapper .header-title-text a { color: black !important; } } Please use the like button if it helps you! Best, Leopold Ninja Kit Extension: Upgrade your Squarespace website without coding.YouTube Preview - FREE DOWNLOAD
brandi_sqspace Posted August 31, 2020 Author Posted August 31, 2020 @tuanphan Site pw is "branding". @IXStudio Amazing! That seems to work on some pages: Home Blog And, basically any other page where the title was already black over a beige background. But not others: Contact About Consulting Data Deletion Request I thought it might have something to do with the Section Theme colors applied at the top of each of those pages, but—for instance—Home and About both have "White Minimal" section color themes applied and yet, somehow, the site title appears black on mobile on Home and white on mobile on About. Edit: Also—now my mobile nav site title is Black over the #3b3b3b background and it needs to be white, as well. Any help is appreciated!
IXStudio Posted September 1, 2020 Posted September 1, 2020 Hi, In my code you see this #collection-5f3fd0df46b52a672c2e6bd2 This is the ID of your body. Just need to replace it or add another pages like that completed CSS code to use it for other pages. Please use the like button if it helps you! Best, Leopold Ninja Kit Extension: Upgrade your Squarespace website without coding.YouTube Preview - FREE DOWNLOAD
brandi_sqspace Posted September 1, 2020 Author Posted September 1, 2020 My sincere apologies, @IXStudio! I somehow missed that you'd said it only applied to a single page. I've made the fix for all pages now! The only thing I could use some final help with is the site title on mobile nav. It has the opposite issue—I always need it to appear white on mobile when the nav is clicked, because it's currently black on black. Any insight there? I tried to piece together some separate custom css I already have to create this: /* Change dropdown menu site title color */ @media screen and (max-width:640px){ .header-title-text a { color: #fff !important; } } And that's not working for me.
IXStudio Posted September 1, 2020 Posted September 1, 2020 Hi Remove the old code and replace with this. @media screen and (max-width:640px){ #collection-5f3fd0df46b52a672c2e6bd2:not(.header--menu-open) .header-announcement-bar-wrapper .header-title-text a { color: #3b3b3b !important; } } Please use the like button if it helps you! Best, Leopold Ninja Kit Extension: Upgrade your Squarespace website without coding.YouTube Preview - FREE DOWNLOAD
brandi_sqspace Posted September 1, 2020 Author Posted September 1, 2020 @IXStudio Boom! That was it! Thank you!!!
Recommended Posts
Archived
This topic is now archived and is closed to further replies.