import * as React from 'react'

/**
 *
 * @category Components
 */
export const Guide = ({src = ``, opacity = `0.1`}) => {
  if (!src.startsWith(`./template`)) return null

  return (
    <div
      className={`
        position:absolute
        absolute
      `}
      style={{
        opacity,
        width: `100%`,
        zIndex: `200`,
        height: `100%`,
        pointerEvents: `none`,
      }}
    >
      <img
        style={{
          width: `100%`,
        }}
        src={src}
        alt="design guide"
      />
    </div>
  )
}

export default Guide