compensate scrollbar via CSS variable

[ExileofAranei]

Hi, what do you think about this approach of changing scrollbar compensation from adding a direct padding in generated styles to CSS variable, that can be also used in the entire document. This can help developers to handle cases with fixed elements, that are shifted when Fancybox gets open. For example,

.header {
  position: fixed;
  left: 0;
  top: 0;
  max-width: calc(100% - var(--fancybox-scrollbar-compensate, 0));
}

And no JS callbacks with manual adding styles is needed anymore

[fancyapps]

Hi,

Actually, I've been lately thinking about a CSS only solution, but since these may be breaking changes, I'm leaving it for v5.

[fancyapps]

@ExileofAranei Sorry, fancybox5 is around the corner and will use the CSS variable as you suggested. You might be surprised, but it took almost a year of full-time work to completely rewrite the project (to move to TS and implement almost all feature requests).

[ExileofAranei]

@fancyapps Oops I forgot about this PR and deleted it while clearing unused GitHub repos. Happy to hear that, I use this UI almost for every project and it's great that such an amazing library is still evolving