JayVanDyke

@abigailallen I think I'm looking at the same spot on your site. You might need to get a more specific selector.

Try this

.sqs-block-summary-v2 {

    .summary-title .summary-title-link,
    .summary-heading .summary-collection-title {
        font-family: 'proxima-sera' !important;
        font-weight: 300 !important;
        font-size: 18px !important;
        color: #ccccc !important;
        text-transform: none !important;
        font-style: none !important;
    }
}

@media only screen and (max-width: 640px) {
    .user-items-list-simple {
        //change these for side padding on mobile
        padding-left: 4vw !important;
        padding-right: 4vw !important;
    }
}

@Jefferson0123 Try this, replace what you have with this CSS code. It has some higher specificity and I added the !important to try to override the original styles.

 

/* Hoowla quote button */

.sqs-block-code a.hoowla-quote-button {
    padding: 1.2rem 2.004rem !important;
    background-color: #90bd37 !important;
    border: 1px solid rgba(0,0,0,0) !important;
    border-radius: 5em !important;
    color: #fff !important;
    text-decoration: none !important;
    text-transform: none !important;
    font-family: Rockwell,"Helvetica Neue",Helvetica,sans-serif !important;
    font-size: 1.3rem !important;
    font-weight: 400 !important;
}

@WR-Mike can you leave the code in there? I'll be able to check it out and see why its not working.

See if this works

#collection-648c4211e872940647bd16de .sqs-block-form .button.sqs-button-element--primary {
  background-color: #41986C !important;

}

you probably have to target the navigation links specifically. 

Try this

h1, h2, h3, .header-nav-item a {
font-family: 'pixChicago' !important;
}

@Linnxh can you share a link to the site?

So basically I just made a section and added a marquee. Then with some javascript I moved it up to the banner section and added some basic CSS. There is much more css to add to fix things with screen sizes and most likely issues with overlapping the top banner and ideally it would be coded so that in edit mode the block is still in its section so you can make changes and I'd probably do it in the footer instead so that it can show on every page. This was just a quick and dirty version. I'll DM you with some ideas.

I would do it in a classic engine section and put all the videos into columns the way you want and then edit the top padding in the video block to adjust for each video style. The grid gets really weird when you mess with padding inside the containers. When I do this I usually try to use some css selector from the video blocks that can be more generic than the ones you're using. I've had a few client sites where I did this but it is a custom solution. If you want to set up a classic page section with your videos stacked in columns I can look and see how complicated it would be to write up some CSS.

Hey there! So you're trying to get this to be kind of like a masonry layout?

Hey @Matthew26 I'd honestly say this is something you want to do with the marquee block and some javascript. I've got a SUPER rough version here on a demo site to see if it's doable but not exactly how I would implement it on a client site. Happy to chat about building you a custom solution if you want to DM me

https://oval-cyan-eg7s.squarespace.com/home

pw: demo

If you're interested in checking one out, that's how this table one works. Affiliate link if you buy it.... 🙃
https://www.squarewebsites.org/squarespace-plugins/custom-table-block?peachs_apc=jay-van-dyke

@DesignPearl great! Can you mark it as the solution so someone else can get help from it too?

It looks like you have some custom css in there affecting the color. See if you can find it from screenshot below. if not you can try adding this to the end of your css file

.header-nav .header-nav-item--folder .header-nav-folder-content a:hover {
    color: white !important; //change me for the color
}

@DesignPearl try this in your custom CSS

.ProductItem-gallery-slides-item img {
  object-fit: contain !important;
}

@media only screen and (max-width: 640px) {
  .sqs-block-summary-v2 .summary-block-setting-design-list {
    .summary-thumbnail-outer-container {
      width: 100% !important;
    }
    .summary-thumbnail-container {
      padding-right: 0 !important;
    }
    .summary-content {
      width: 100% !important;
    }
    .summary-title, .summary-excerpt, .summary-read-more-link, .summary-metadata-item {
      padding-left: 0 !important;
    }
  }
}

@bbradley do you want this for every list summary block on the site? If so just change the code to this.

@Matthew26 I think I'd need to see your page. Can you share a link to where you have this setup?

try it like this instead

@media only screen and (max-width: 640px) {
  #block-9184d00069f6322414f9.sqs-block-summary-v2 .summary-block-setting-design-list {
    .summary-thumbnail-outer-container {
      width: 100% !important;
    }
    .summary-thumbnail-container {
      padding-right: 0 !important;
    }
    .summary-content {
      width: 100% !important;
    }
    .summary-title, .summary-excerpt, .summary-read-more-link, .summary-metadata-item {
      padding-left: 0 !important;
    }
  }
}

ahh yea, I was looking at the wrong page. See if this works, some of your code might override it but if you put it in we can inspect and figure out how to get it to work.

@media only screen and (max-width: 640px) {
  .sqs-block-summary-v2 .summary-block-setting-design-list {
    .summary-thumbnail-outer-container {
      width: 100% !important;
    }
    .summary-thumbnail-container {
      padding-right: 0 !important;
    }
    .summary-content {
      width: 100% !important;
    }
    .summary-title, .summary-excerpt, .summary-read-more-link, .summary-metadata-item {
      padding-left: 0 !important;
    }
  }
}

Seems ok to me at the moment but sometimes those images get hard coded numbers generated by a script when they load. Maybe this will work? This will probably break your focal points if you've got those set on your images anything other than center but it should make them be sure to fill the container.

@media only screen and (max-width: 640px) {
  .sqs-gallery-design-carousel .summary-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}

@bbradley can you share the link?

It's probably code somewhere else hidden on the page but I guess it's possible it's just squarespace. Is it every single page? Is it even if you make a brand new page? I've had to find these things before for clients if you want to DM we can chat about some help. I would just need to get access to your client's site as an admin.

I might try combining this with the id that the footer already has of #footer-sections and change the display of Will's button to be your call button.

https://www.will-myers.com/articles/building-a-back-to-top-button-in-squarespace

maybe check this out? 

https://www.adlyticmarketing.com/blog/squarespace-scrolling-marquee-announcement-bar

Also you could add a marquee to a footer section or something and we can move it to the announcement bar with some javascript. That might be an easier solution so you don't have to edit all that code. If you do that just share your link here and one of us can probably help write it for you.

@renee.hartwick
have you tried using safe mode? in the editor after "/config/" put "safe" so it should look like this

yourinternalurl.squarespace.com/config/safe

the other thing I would try is to get rid of literally all of the css and paste it into a plain text editor to save for just a moment to see if that's it. It looks to me like someone has manipulated the size of an element inside of a fluid engine container. I've had things look like this on sites where I had to adjust the sizing for portrait style video and it kind of breaks the editor a bit when you're working on that section. If it's happening in all of them I wonder if there's some generic css that's affecting the whole site. I've had to do this a few times, it's such a nightmare finding the issue.

@ColeH_design can you share a link to your site?