I'm working on a custom overlay component and I need to set a margin on it. It should be 0.5rem depending on the position of the overlay (e.g. originY === 'bottom' => margin-top: 0.5rem, and so on). I was hoping to use PositionStrategy object for this but it looks like there's no such info available on it. private getOverlayConfig(origin: HTMLElement): OverlayConfig { const positionStrategy = this.calculatePosition(origin); // was hoping for something like this // const panelClass = positionStrategy.originY === 'bottom' ? 'panel-margin-top' : 'panel-margin-bottom' return new OverlayConfig({ positionStrategy, panelClass, //... }) } PositionStrategy object exposes only four methods (apply, attach, detach, dispose) which are of no use to me and I can't access anything else. As for a CSS solution I can't imagine it. The overlay can open either a template or a component and since they are placed in an overlay, I have no idea how to compare the position of the overlay with the origin position (button which opened the overlay). Any idea how to do it? Continue reading...
