events width 7.1

Site URL: https://www.boardies.ca/events

Hi folks. I just did the 7.1 upgrade and it went well, with the expected handful of tweaks necessary. However, one thing needs a workaround to match my pre-upgrade layout...

We have a main event page (https://www.boardies.ca/events), and two individual event pages that get called from that. All three of those pages have lost the ability to set the content more narrow.

While I have the grid and lots of flexibility for content width throughout the site... it seems absent for this events page and sub-pages.

Is there some custom code I can use to override this full-width behaviour?

Thanks 🙂

Hello @KR-SS, did you try using the width settings? See attached screenshot for reference:

That only moves it inwards a few pixels, that's it. And it doesn't unlock any handles or other settings to pull that content more narrow. I forgot to mention that in my original post. In fact, I see that I currently have it set to Inset.

Anyone with some sort of workaround here?

Hey @tuanphan you've helped in the past. Any insight on this?

This was answered by @tuanphan with this code:

65% was the best value for me

/* event main page width */
div.sqs-events-collection-list.events.events-list.events-stacked {
    max-width: 65% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

/* event detail page width */
.sqs-events-collection-item.events.events-item {
    max-width: 65% !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

I wrote some code to adjust width of event page, event detail,...