Storybook 25 Column Grid Snipet

snippet.js

javascript: (() => {
  function insertGrid(str) {
    var node = document.createElement('style');
    node.innerHTML = str;
    var iFrame = document.getElementById('storybook-preview-iframe');
    iFrame.contentWindow.document.body.appendChild(node);
  }
  const audiGrid = ` :root { --audi-grid-color: hsla(290, 87%, 47%, 0.15); --audi-grid: repeating-linear-gradient( to right, var(--audi-grid-color), var(--audi-grid-color) 4%, transparent 4%, transparent 8%, transparent 8% ); } html { position: relative; } html::before { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; min-height: 100vh; content: ''; background-image: var(--audi-grid); background-size: 100% 100%; z-index: 999999999999; pointer-events: none; } `;
  insertGrid(audiGrid);
})();