Jump to content

LukeDesign

Member
  • Posts

    59
  • Joined

  • Last visited

Recent Profile Visitors

306 profile views
  1. The code below that I’ve been using to style my cookie banner has stopped working, particularly the font color. It worked fine for a month. Can you suggest any changes to fix the issue? Site: https://www.lucasano.com/ .sqs-cookie-banner-v2 p { color: #F9F7F5 !important; font-family: "Stevie Sans", sans-serif !important; font-size: 12px !important; font-style: normal !important; font-weight: 200 !important; letter-spacing: .7px !important; line-height: 150% !important; }
  2. Thank you. I was able to find some Javascript that achieved what I was looking for.
  3. Does anyone have a suggestion for this? Thank you!
  4. I've added the CSS in the Custom CSS under Website Tools. I also tried it in the Page's header injector, but are not working. The below image is what happens: I have a lot of CSS in my Custom CSS - you want me to send all of it?
  5. Thank you! For a blog post, is there a way to stack the meta as well - with date on top and category underneath? https://www.lucasano.com/blog-content/template-blog-post
  6. I am building a blog post template that I will use for all my posts. I want to add a “Related Posts” summary block on the bottom using categories. I know how to add a summary block and select categories, but since I am building a template, I would like CSS that can pull up the categories from the current page automatically to display those related posts. Here is the template so far: https://www.lucasano.com/blog-content/template-blog-post Thanks!
  7. Thank you, @inside_the_square! This code worked perfectly! I had a couple other issues trying to get the category pages to match the style of blog post pages and summary blocks: The date on category pages are displayed as 00/00/00 whereas blog posts and summary blocks are displayed as June 1, 2024. Is there a code to match to June 1, 2024? I’d like the date displayed on top, then category underneath, followed by the blog title.
  8. I am trying to style the my category blog pages to how I’ve styled my blog summary blocks, specifically, the “Read More” link. Here is the style of the summary block where the “Read More” link is styled correctly: https://www.lucasano.com/test-5 And below is a link to one of my category pages where I've tried to mimic the "Read More" style button: https://www.lucasano.com/blog-content/category/Latest+Work I can’t get the "Read More" link to style correctly even though I am using the same code for the summary block, but targeting the .blog-more-link selector. Also, the underline is not going away, despite the correct code to remove it. Here is the code I am using: .blog-more-link { position: relative !important; display: inline-block !important; height: 40px !important; padding-top: 6px !important; padding-left: 5px !important; padding-right: 0px !important; padding-bottom: 5px !important; font-size: 13px !important; top: -20px !important; color: initial !important; z-index: 1 !important; transition: color 0.3s !important; text-decoration: none !important; } .blog-more-link::before { content: "" !important; position: absolute !important; top: 0 !important; left: 50% !important; width: 30% !important; height: 80% !important; border: 1px solid #323843 !important; box-sizing: border-box !important; transform: translateX(-50%) !important; border-radius: 4px !important; background-color: transparent !important; transition: background-color 0.3s !important; z-index: -1 !important; } .blog-more-link:hover::before { background-color: #323843 !important; } .blog-more-link:hover { color: #EFEAE6 !important; }
  9. The CSS you gave me is still there - https://www.lucasano.com/test
  10. Hi @tuanphan, I tried using this code to achieve the same on a single page, but it's not showing the navigation links in the hamburger menu. My header navigation is also partially showing. I used the same code as above but switched out my body#collection ID, which is body#collection-66588e7bd03541145758635a. Website: https://www.lucasano.com/test
  11. I am also trying to get background-attachment: fixed to work on IOS. I’ve been scouring the internet trying to find a solution and came across this post: https://kriesi.at/support/topic/colour-section-background-image-mobile-responsive-issue/#post-1262283 You can also see his test here: https://webers-testseite.de/donkey/ which works perfectly on my IOS. I am wondering on how to adapt this code to Squarespace (I am not a CSS expert). This is the code he is using: .bg-fixed { -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); background-size: 0 !important; overflow: hidden; position: relative; top: 0; } .bg-fixed:after { content: ""; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-image: inherit !important; background-repeat: no-repeat !important; background-size: cover; background-position: inherit; pointer-events: none; z-index: -1; visibility: visible !important; } Here is a link to my test page: https://www.lucasano.com/test-3 The section ID I want to set the background image to is: section[data-section-id="6657842d665515262f9f5e36"] And the URL for the background is: https://static1.squarespace.com/static/660dabf2c74e425529726520/t/662252cc3539fd50ece45305/1713525454099/Sample+image+4.jpg Thanks!
  12. Thank you. That definitely helped but it's creating an uneven spacing between each link: https://www.lucasano.com/test-2
  13. I want to reduce the spacing between links in a blog Archive block. I don't want them so spread apart but rather closer together. I adjusted the padding, but that's just adjusting the size of the link background: https://www.lucasano.com/test-2 Here is the code I am using: .archive-group-name-link { background: #323843; color: #F8F4EF; padding: 5px!important; border: 3px solid #323843; border-radius: 4px; font-size: 12px; font-family: 'Stevie Sans', sans-serif; }
×
×
  • 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.