Jump to content

MayaViolet

Circle Member
  • Posts

    125
  • Joined

  • Last visited

Everything posted by MayaViolet

  1. By inspecting the element, I can see that the current horizontal rule block has a margin of (margin: 34px 0px) ( see attached screenshot). So, we could apply the following CSS to overrule that margin, of course adjusting similar to padding to match the exact pixel height you'd like. .sqs-block-horizontalrule hr { margin: 0 !important; }
  2. Hi @St Lukes - if you add the following code to the custom CSS panel, you will reduce the padding. You can also play around with changing the values from 0 to something like padding: 10px 0px (which would be 10px to top and bottom, or 0px to left and right), or event: 10px 0px 15px 0px (where the targeting direction goes top, right, bottom, left). Let me know if you have any questions! .footer-inner { padding: 0 !important; }
  3. Hi @mrkttnr I think you might have the background width set to inset - changing it to full width I think will solve this problem... but if it doesn't, this code will apply a fix: section[data-section-id="62b7422094e2396356c7ce98"] .section-background { left: 0 !important; right: 0 !important; bottom: 0 !important; }
  4. Hi @hayesma, here is an article that walks you through how to use just CSS to target the specific icon, and replace the source image that Squarespace pulls. It requires you to upload a custom file, but the video shows you exactly how to do so. Lmk if this isn't what you want to do and need further direction!
  5. Hi @sian75, can you share the link to the site in question so we can provide accurate code for your specific site?
  6. Hi @St Lukes, you can change the status to password protected following these instructions so that we can inspect the site directly to help you develop code to remove the padding correctly
  7. Hi @stvr1974 - you can drop the following code into the Page Injection section of the specific page where you want to hide the footer. To do so, navigate to "Website" and click the gear icon next to the page in question to access that page's settings. Then head to the "Advanced" tab drop the code in below: <style> footer { display: none !important; } </style> Let me know if you have any questions!
  8. Hi @ariellebrown - You can find SS's instructions on how to insert code for a specific page here, but essentially you will need to remove the code above from your site injection, because this is telling the pop-up to appear on every page of your site. Then, you'll want to navigate to Pages, and click the settings icon next to your Home page title, and navigate to the "Advanced" tab, and page header code injection to paste the code there. Give it a try, and let me know if you still have questions!
  9. Hi @Cinthetic, did you find a solution for a slideshow animation delay?
  10. @Lesum Any idea on CSS that will successfully change the placeholder font size? Can't get it to work... Site is here
  11. @Cowfish23 I believe you can try to add it via a code block, but it still may not work in a personal plan... worth a shot to try it though?
  12. @ibnibnbattuta did you find the solution? @tuanphan any ideas? Trying to do the same!
  13. Hi @tayspilates, it looks like it is the same letter-spacing and thickness on both screensizes, but it only appears to be closer/thicker on smaller screens, because you have large characters in a smaller space. To make adjustments, I would play around with the following code while previewing the effects on mobile in edit mode to see what meets your preference! /* Mobile Screen Size Updates */ @media all and (max-width: 768px) { .Marquee h1 { letter-spacing: .0em !important; font-size: 50px !important; } }
  14. I believe it was the following? I actually have it not active on the client site because we developed a diff solution, and the code link I found in my email shows up with an error, so not sure what if this will work! <!---Menu Hover--> <script> $('.header-burger').hover(function(){ $('body').toggleClass("header--menu-open"); }); </script> <!---END Menu Hover--->
  15. Absolutely! If you take note of the animation property, I included the syntax rules: // animation name, duration, timing-function, delay, direction Following that order, you can adjust what currently is set to "0s" to your preferred delay time. Let me know how that works!
  16. @WebShark Ok, the first step would be to set your header style to "Fixed" as referenced here. Then, try applying the follow CSS: /*--- Header Navigation - Fixed Left ---*/ @media all and (min-width: 768px) { /* Navigation Position */ .header-layout-branding-center-nav-center .header-title-nav-wrapper .header-nav { margin: 0; position: fixed; left: 0; top: 100px; width: 15vw; } .header-nav-list>div { white-space: inherit; } /* Page Content Width */ main#page { width: 85vw; margin-left: auto; } } Lmk how that works!
  17. Yes, solution is definitely possible but I think we need to clarify a few more design details first 🙂 Do you want the navigation to sit fixed on the left side of your site content, meaning it stays present even as users scroll down the page? To do so, we would need to target the header-nav and place it on the left side, but also add a left-margin to the entire site's page content, so they don't overlap. If you can provide your big-picture vision, that would help us be able to develop and share accurate code!
  18. Hey @tayspilates - it looks like the "Perks" page has it's own unique password applied to it, so I can't reference the exact example... If you can share that PW, I can target it exactly to see what's going on and to test code, but in the meantime you could play around with a media query (to target only mobile screens), and that specific typeface to adjust for letter-spacing: @media all and (max-width: 768px) { h1 { letter-spacing: .05em !important; } Lmk if you can either share that pw or remove the page-specific pw so I can try to recreate and solve the problem on my end!
  19. @NikiR great! Are you able to provide me with the URL and password of your website, so that I can give you the exact code? See here for more info on setting a site-wide password.
  20. Hi @sybfire, try this: div#sqs-cart-container { text-align: center !important; } h2.cart-title { text-align: center; font-size: 50px !important; // insert desired font size here }
  21. Hi @nahlah, if you can provide your URL and pw, we can provide exact code to make those edits. Are you comfortable with applying Custom CSS to your site?
  22. (you may need to apply "!important" after the properties if the code isn't sticking)
  23. .header-layout-branding-center-nav-center .header-title-nav-wrapper { flex: 0 0 100%; } .header-layout-branding-center-nav-center .header-title-nav-wrapper .header-nav { text-align: left; } .header-layout-branding-center-nav-center .header-title-nav-wrapper .header-nav .header-nav-list { justify-content: left; flex-direction: column; text-align: left; } Try the above - Not sure if that is your final preferred outcome?
  24. Hi @uebermut, you should be able to fix the navigation bar with SS's native settings, and then the logo can be targeted with custom CSS to fix it's position. We will need your site URL and password however to provide the correct code!
×
×
  • 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.