@porsche-design-system/components-js
Version:
Porsche Design System is a component library designed to help developers create the best experience for software or services distributed by Dr. Ing. h.c. F. Porsche AG.
16 lines (13 loc) • 790 B
JavaScript
import { _gridSafeZoneS, _gridWidthMax, _gridSafeZoneXXL } from './gridShared.mjs';
import { gridGap } from './gridGap.mjs';
const columnMap = {
narrow: 4,
basic: 2,
extended: 1,
};
const gridColumnWidthS = `calc((100vw - ${_gridSafeZoneS} * 2 - ${gridGap} * 15) / 16)`;
const gridColumnWidthXXL = `calc((min(100vw, ${_gridWidthMax}) - ${_gridSafeZoneXXL} * 2 - ${gridGap} * 15) / 16)`;
const _gridPadding = `max(0px, 50vw - ${_gridWidthMax} / 2)`;
const _getGridOffsetS = (width) => `calc(${_gridSafeZoneS} + (${gridGap} + ${gridColumnWidthS}) * ${columnMap[width]})`;
const _getGridOffsetXXL = (width) => `calc(${_gridPadding} + ${_gridSafeZoneXXL} + (${gridGap} + ${gridColumnWidthXXL}) * ${columnMap[width]})`;
export { _getGridOffsetS, _getGridOffsetXXL, _gridPadding };