undefined

import { useState } from 'react';

import * as htmltoimage from 'html-to-image';

import reactLogo from './assets/react.svg';

import viteLogo from '/vite.svg';

import { WavyBackground } from './components/wavy-background';

import './App.css';

window.addEventListener('message', async ({ data }) => {

	if (data.type === 'screenshot') {

		const screenshot = await htmltoimage.toJpeg(document.body);

		parent.postMessage(

			{

				type: 'screenshot-ready',

        screenshot

			},

			'http://localhost:5173'

		);

	}

});

function App() {

  return (

    <WavyBackground className="max-w-4xl mx-auto pb-40">

      <p className="text-2xl md:text-4xl lg:text-7xl text-white font-bold inter-var text-center">

        Hero waves are cool

      </p>

      <p className="text-base md:text-lg mt-4 text-white font-normal inter-var text-center">

        Leverage the power of canvas to create a beautiful hero section

      </p>

    </WavyBackground>

  )

}

export default App