Jump to content

Help with some custom Newsletter block code - Something is going wrong

Recommended Posts

Hello, 

I created some code to edit the newsletter block and make it transparent, while leaving a bottom border. The code seems to work and the bottom border appears sometime, but sometimes it doesn't (for example, when opened in Incognito / Private browser or when switched to Mobile view). See everything below:

How it should look:

image.png.c916fb6993fda575f56b8b0876b58149.png

How it appears on mobile / incognito: 

image.png.a6a28b5795319e3bc0d8cb30bfb45bb9.png

The code I added:

.black .sqs-block-newsletter .newsletter-form-field-element {
  border:none;
  border-radius: 0px;
  border-bottom: 2px solid;
  border-color: #ceaa64; 
  background: rgba(0, 0, 0, 0.0);
}
.newsletter-block .newsletter-form-field-element:focus {
  background: rgba(0, 0, 0, 0.0)
}

I wrote this code and writing code is NOT my thing, so it's very possible I missed something or added something wrong. Please help! Thank you!

Link to comment
  • Replies 6
  • Views 697
  • Created
  • Last Reply

@RyanDejaegher Nope, none at all, looks all clean and good in my custom CSS window, but I seem to be the only person in my whole office who is even able to see the border. You said you were able to see it? You're the only person other than me who can, it seems. 

I see a couple errors when I inspect the element but am not sure if they're what's causing the issue. I'm inspecting now, but am honestly at a loss here.

Update: Something weird was breaking in the JS index. So, I removed the newsletter block and instead just used a normal contact form, edited down to only display the Email field. Close enough!

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.