Jump to content

DPruitt

Circle Member
  • Posts

    185
  • Joined

  • Last visited

Everything posted by DPruitt

  1. Have you tried injecting the CSS into the Header Injection instead of custom css?
  2. Hey Mike! Try this: #collection-id #sections .page-section:nth-child(1):after {content:''; width: 100%; display:block; position: absolute; bottom:0px; height: 70px; background: #1c1c1c; background: linear-gradient(0deg, #1c1c1c 28%, rgba(28, 28, 28, 0) 100%); } You can always toggle the height if it needs to be larger... You'll also need to toggle the #collection-id to get the code to work specifically on your homepage so that other pages are not affected... If you want it on all pages, simply remove #collection-id.
  3. Here are a few soft solutions, but not sure if they are ideal for what you're trying to accomplish: Option 1: .sqs-block-accordion .accordion-item__dropdown--open { transition-property: visibility, opacity !important; transition-timing-function: linear !important; transition-duration: .5s, 2s !important; transition-delay: 2s, .5s !important; } Option 2: .accordion-item__dropdown--open { transition: all ease-in-out 3s !important; } You might have to adjust the height of the accordion and a few other things to get the effect just right...
  4. I think your quickest approach will be to assign a bold link per collection. Try inserting this into CUSTOM CSS: /*Homepage*/ #collection-649d74abb21c116f17a9fc23 #block-yui_3_17_2_1_1688402606420_25603 a:first-child{font-weight: 900 !important;} /*About*/ #collection-64a2a952762de64617a90212 #block-yui_3_17_2_1_1688402606420_25603 a:nth-child(2){font-weight: 900 !important;} /*Services*/ #collection-64a2a95e48f12318878a5706 #block-yui_3_17_2_1_1688402606420_25603 a:nth-child(3){font-weight: 900 !important;} /*Contact*/ #collection-64a2a967b299003f9fbecef8 #block-yui_3_17_2_1_1688402606420_25603 a:last-child{font-weight: 900 !important;}
  5. I think the quickest fix on this will be to display the cart on the shop page and product pages at all times... Try inserting this into the Shop Page Header Code Injection: <style> .floating-cart {display:flex !important;} </style>
  6. Try this instead: .item-pagination-link:hover .item-pagination-prev-next, .item-pagination-link:hover .item-pagination-icon svg { color: #42c6ff !important; stroke: #42c6ff !important; }
  7. I updated the code just now, but basically, you can alter the "width" and/or the left & right padding.... You might need to shrink the text size too...
  8. I just reviewed the Markup to the site and could see how hitting back on the browser could cause certain elements to display; it's all written into the same index. I think your best bet is just to give your projects a background so that it covers anything displaying behind it. Try inserting this into DESIGN - CUSTOM CSS: .project {background-color:#000000 !important;}
  9. Made you a quick video on chrome PC. It seems to be doing the same thing on my device as it did a few days ago; definitely agree there's something fishy going on: https://www.loom.com/share/8774a48befc44b93878ffeb6970b093e?sid=a3f8cd90-15e6-4e00-a1ab-a72c12d2a9a7
  10. This should work if you're using Squarespace 7.1. Sorta hard not having a link to your website; insert into CUSTOM CSS: #footer-sections .sqs-svg-icon--wrapper { margin-left: 30px !important; margin-right: 30px !important; }
  11. I would switch to a "classic editor sections" when using accordion blocks and summary blocks. Honestly, the spacing can get so bad sometimes, I use Classic editor sections more than fluid engine...
  12. I can't recreate this error on my end... The images do stall loading for a second until I scroll sometimes. What you might do at the top of each page is add a text link that goes to the main index (homepage).
  13. Add this to Website Tools - CUSTOM CSS: .ProductItem-additional {margin-top:0px !important;}
  14. Here you go, enter this into CUSTOM CSS: .sqs-cart-quantity { color: #000000 !important; }
  15. Here you go: .header-title-logo a:after { content: 'Subtitle Text'; font-size: 18px; color: #000000; text-align: center; display: block; }
  16. Try this fix: .gallery-fullscreen-slideshow-item-img{ transition: opacity 1600ms ease-in-out !important; -webkit-transition: opacity 1600ms ease-in-out !important; -ms-transition: opacity 1600ms ease-in-out !important; -moz-transition: opacity 1600ms ease-in-out !important; -o-transition: opacity 1600ms ease-in-out !important; } .gallery-fullscreen-slideshow[data-transition="fade"] .gallery-fullscreen-slideshow-item[data-active="true"] .gallery-fullscreen-slideshow-item-src{ transition: opacity 1400ms ease-in-out !important; -webkit-transition: opacity 1400ms ease-in-out !important; -ms-transition: opacity 1400ms ease-in-out !important; -moz-transition: opacity 1400ms ease-in-out !important; -o-transition: opacity 1400ms ease-in-out !important; }
  17. Try inserting this into custom CSS: @media screen and (max-width: 640px) { .col.sqs-col-4.span-4 { width: 33.33%!important; display: inline-block; } .small-button-style-outline .sqs-block-button .sqs-block-button-element--small { width: 95px; padding-left: 2px; padding-right: 2px; font-size: 9px; color: #000; } }
  18. This inserting this into the page header injection area of the shop page instead: <style> .header-title-logo img {filter: brightness(0) invert(0);} </style> If you want to invert the logo on the Cart Page you will add this to the Custom CSS Panel: #cart .header-title-logo img {filter: brightness(0) invert(0);} For the checkout page where users insert their CC# information, you'll have to render the original logo or use text as your logo as we can't use any coding for the secure checkout page.
  19. This might work; you might adjust the width of the code so that it looks good and fills the container without overflowing to another line: @media screen and (max-width: 767px) .sqs-layout .sqs-gallery-design-grid-slide { width: 25% !important; clear: none !important; }
  20. Insert this into the CSS Panel: /*CSS Written Text* .statictext{ color: white; font-size: 55px; padding: 15px; font-family: sans-serif; } .writtentext{ color: white; border-right: 2px solid red; font-size: 55px; font-family: sans-serif; color: rgb(255, 30, 0); } /*END CSS Written Text* Insert this into the Page Injection area of the Header: /*Insert Into header - Written Text*/ <script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.11/typed.min.js" integrity="sha512-BdHyGtczsUoFcEma+MfXc71KJLv/cd+sUsUaYYf2mXpfG/PtBjNXsPo78+rxWjscxUYN2Qr2+DbeGGiJx81ifg==" crossorigin="anonymous"></script> Insert this into a codeblock on the page where you would like the text to appear. It's recommended that you use a Classic Editor Section instead of Fluid Engine: <div class="statictext">I'm</div> <div class="writtentext"></div> <script> var typing=new Typed(".writtentext", { strings: ["", "Youtuber", "Freelancer", "Graphics Designer", "Web Designer", "Web Developer"], typeSpeed: 100, backSpeed: 40, loop: true, }); </script>
  21. Do you have the link so that we can view it?
  22. FYI, you can still add the fonts here: https://herring-apricots-mnd6.squarespace.com/config/editor
  23. This issue has been reported to SS for the New UI "Website Tools".
×
×
  • 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.