JSFiddle - React, Tailwind, and code Playground

by austinpray

JavaScript

const percent = (dividend, divisor) => (dividend/divisor)*100

const ratios = [
    [21, 9],
    [18, 9],
    [16, 9],
    [4, 3],
    [1, 1],
    [9, 6],
    [1, 2],
]

const aspectRatios = ratios.map(([w, h]) => ({
    [`.wp-embed-aspect-${w}-${h}`]: {
      '.wp-block-embed__wrapper::before': {
        content: `''`,
        display: 'block',
        paddingTop: `${percent(w, h)}%`,
      },
    },
  }))
  
console.log(aspectRatios);