Theme configuration object

[Tanguy-Magnaudet]

Describe the problem

When using a built in theme, we cannot pass a configuration object. this makes it impossible to change the direction of the overlay theme easely.

Describe the proposed solution

adding a themeConfig object that can be passed to the new SwupOverlayTheme() class, like so :

SwupOverlayTheme({
  direction: 'to-right'
});

How important is this feature to you?

• [ ] Nice to have
• [x] Would make my life a lot easier
• [ ] I cannot use swup without it

[daun]

Good point. We're trying to get away from theme options, towards CSS custom properties for customizing themes. The direction option of overlays is the one single option that couldn't be converted easily.

We'll think of a way of making this configurable from the Astro integration.

In the meantime, this should do the trick when run after swup was initialized:

document.querySelector('.swup-transition-overlay').dataset.direction = 'to-right';

[daun]

We've released version 1.2.0 of the integration that allows customizing theme options:

{
  theme: ['overlay', { direction: 'to-right' }]
}