Jump to content

ellen_b

Circle Member
  • Posts

    65
  • Joined

  • Last visited

Everything posted by ellen_b

  1. @Lesum Somehow just seeing this now. You are the BEST! Thank you thank you!
  2. @Lesum I'm wondering if it might be possible to exclude this effect from mobile, so the activated shape colors show up on mobile (without needing "hover")? An alternative I thought of was to add additional colored shapes to mobile that I then hide from desktop, which I know how to do, but it ends up being a lot of shapes haha 🤪 Maybe there's a more elegant way to do that with a media query in the original script? (Thank you!!)
  3. @Ziggy YES! That's perfect. Thanks so much!
  4. @Ziggy I'm having a similar issue with lines and hoping you might be able to help? I've used code blocks to create vertical lines on my site for a grid effect. This generally works great, but I've discovered that in instances where I want them to meet up with a horizontal line block, I can't get them to be flush (see screenshots). In section settings, I have fill screen toggled off and have taken the grid gaps down to zero hoping that would help. I've tried all combos of top, center, and bottom-aligning the horizontal lines. https://newnewshapesstudio.squarespace.com/?password=ellen I assume there's a way to move the line pixel by pixel with CSS but I'm not sure how to do it! Thanks so much in advance.
  5. @Lesum Brilliant! I LOVE how this effect turned out. Thank you so much!
  6. @Lesum Weird, yeah that little space wasn't there yesterday. I removed the new code and it didn't go away, but the CSS worked! As an example of multiple blocks on top of a shape, I've added a shape behind the text block and button in the "Ready to ditch...?" section near bottom of page (see screenshot). The block ID of that shape is #block-yui_3_17_2_1_1725733188880_15049 PS - I just updated the domain, so wanted to make sure you have that: https://newnewshapesstudio.squarespace.com/?password=ellen
  7. @Lesum AMAZING! Thank you so much. If there are multiple blocks on top of the shapes (like an image block + a text block), would I just separate by commas in the script? The only thing I noticed is that a little space has bene created between the top of the first section and the header (see screenshots). Does that have to do with this new code? (Thanks again! Sending you ☕️💕)
  8. @theolreverend Hi! Any chance you'd be able to share the solution you found for this issue? Thank you!
  9. @tuanphan I am trying to do the same thing and wondering if you could please share the script with me? My site is: https://sailfish-terrier-gzak.squarespace.com/?password=demo I'm trying to get an effect like the one on this site: https://nubeusa.com/ But the image over the shape block is getting in the way. Thanks so much!
  10. @Lesum Strange, I wonder what the root issue is. I added this most recent CSS and that fixed the alignment (THANK YOU!), but for some reason the carousel is only scrolling through 3 of the 5 case studies on mobile. It gets to the third one and then stops like there's no more. It's set to show 6 total items. I'm not sure whether it was stopping at 3 before I added the code. 🤪
  11. @Lesum Just tried and it's still doing it 😕 Is this happening because I added a border around the thumbnails?
  12. @Lesum Any chance you might be able to help with this? 🙏
  13. @sqsp_guru thank you!!
  14. Hi, I am trying to reduce the padding between my site header and blog title on individual blog pages. This is the code I've tried, without success: /* Reduces padding between header and blog title */ .blog-item-wrapper .blog-side-by-side-item-wrapper { padding-top: 0px !important; } https://upwardpartners.squarespace.com/case-studies/?password=brian I'd really appreciate any advice!
  15. @Ziggy Oh, that was an easy fix! Thank you!!
  16. Hi @tuanphan I used the code from this thread to make my summary blocks single-width on mobile, but when I scroll through the carousel it is cutting some of them off. Is that because I have an outline around my summary images? (see screenshot) https://upwardpartners.squarespace.com/?password=brian This is the CSS I've used: /* Adds border around list section cards */ .list-item[data-is-card-enabled="true"] { border:2px #0560B5 solid; } /* Adds cyan border to blog thumbnails and blog post images */ .summary-thumbnail { border: 2px solid #0560B5; } Do you have any ideas? Thanks so much!
  17. Hi, I want to make hyperlinked text within accordion descriptions underlined, rather than just another color. This is the code I tried, but it is making the whole description underlined instead. Anyone know how I should tweak it? Thank you! https://upwardpartners.squarespace.com/?password=brian /* Makes links in accordion description underlined */ .sqs-block-accordion .accordion-item__description, p a { text-decoration: underline; }
  18. @tuanphan Hello! I'm looking to add some padding *between* my blog categories. Right now they are touching. I've used the following CSS so far (see screenshot): /* Metadata Pill Style - For Blog - Ghost */ .blog-categories, .blog-author, .blog-date, .blog-meta-item { background: #F2F0ED; border: 2px solid #0560B5; padding: 7px 13px; border-radius: 50px; } .blog-meta-item { display: inline-block !important; margin: 5px !important; } /* Changes metadata categories font */ .blog-meta-section a.blog-categories { font-family: 'Work Sans' !important; } The website is: https://upwardpartners.squarespace.com/?password=brian Thanks so much in advance for any advice!!
  19. @Lesum Ahh got it. Thank you!! I have one tiny detail. Can we make the padding on the right side of the background color the same width as the right? See red markings in my screenshot.
  20. @Lesum Hmm replaced the code, but it's still not quite right. 🤔
  21. @Lesum Hi! Sorry, I'm just seeing now that you replied to this! (Thank you!) I deleted the code you suggested and added the new code. The width of the drowndown is now fixed as I hover over different items, which is great, but the item background extends over the edge of the folder (see screenshot). I'd like there to be some white margin on either side of the purple background.
  22. @tuanphan Hi! I have a related issue that I'm hoping you might be able to help out with. As I hover over the items in my nav folder, when I reach a longer one, the right edge of the folder itself bumps out. I'm guessing this is the "auto width" feature. I'd actually prefer to make the folder wider but static, so the folder size doesn't jump around. I've tried adding padding to the right side, but the jumping around still happens. Maybe there is some way to disable the auto-width? I have this CSS in right now from trying to manually adjust the padding: .header-nav .header-nav-item--folder .header-nav-folder-content { padding-left: 30px; padding-right: 30px; padding-top: 25px; padding-bottom: 25px; } Here is the site with password. Password = "backandforth" Thank you!
  23. Hi! I'm trying to add a sticky overlay scroll to create an effect like the one on this homepage: https://www.innerpowergrowthcoaching.com/ This is the site I'm working on: https://playfairappraising.squarespace.com/?password=tim I've been using this css, from this tutorial: https://insidethesquare.co/squarespace-tutorials/overlay-scroll #page .page-section { position: sticky!important; top: 0px!important } html { scroll-behavior: smooth } I've tried both the above css, which targets all sections, and singling out specific sections with the block IDs. In both cases, the scrolling goes all wonky. My theory was that it only worked on sections that *did not have a divider applied* but now I see that Inner Power Coaching site linked above, with the same style dividers, and clearly there's a way to do it! I'd really appreciate any insight/suggestions! Thanks in advance.
×
×
  • 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.