Agency theme portfolio modals in Google Chrome cannot scroll

Archive
1

Hello Grav Team!

Thanks for an interesting take on CMS. I am new to GRAV, but enjoying it so far:-)

I have a problem with the “Agency” Skeleton, though: The portfolio modals cannot scroll in Google Chrome on Mac. This makes seeing the entire portfolio modal impossible.

I have checked on two macs, same problem. Works well on windows phone, ipad + safari, and with Safari and Firefox on the two same Mac computers.

As a curiosity, when I inspect the modal window element with the chromes dev tools, and toggle one of the overflow classes on the .modal class on or off, scrolling is possible.

I have checked up on the agency bootstrap starter theme, where the modal windows are working cross browser. So the problem must lie in the Grav-Agency implementation. However, I haven’t been able to find a solution.

My test site is: heypapa

Cheers,

Stefan

2

I’ve passed your request on to Karol who wrote the Agency theme for Grav.

3

Are you talking about the modals like: http://heypapa.dk/#portfolioModal2 ???

I can scroll those in Chrome if i make the window small enough that a scrollbar appears.

4

Hello Stefan,
Indeed this looks like a bug. What is sort of funny… that scrolling is starting to work when you resize browser window after modal load. Anyways, I’m going to take a look at this and I will provide fix soon. Thanks for reporting ! :slight_smile:

5

Hey,
You have to add something like that to your global.css file or agency.scss file:

.portfolio-modal.modal {
  .modal-content {
    height: 100%;
    overflow-y: scroll;
  }
}
6

I included fix i the package, it’s going to be included in next release.

7

Hello Karol,
Thanks! I just changed the .modal-content class in global.css - height: 100% instead of min-height: 100% and added overflow-y: scroll. As far as I can see, it works like a charm across browsers:-)

Cheers,

Stefan

8

thanks, i’m going to test that