<template>
  <div class="bg-white dark:bg-slate-800 shadow rounded-md w-full mx-auto">
    <div class="animate-pulse flex flex-col sm:flex-row space-3-4 items-center">
      <div class="object-cover h-40 w-72 bg-slate-700 m-2 md:m-4 shrink-0" />

      <div
        class="flex gap-3 flex self-start flex-col justify-between m-2 md:m-4 w-full px-2 md:px-4"
      >
        <div class="h-3 bg-slate-700 w-52 hidden sm:block"></div>
        <div class="h-5 bg-slate-700 w-72 lg:w-96"></div>
        <div class="flex items-center">
          <div
            class="rounded-full object-cover h-6 w-6 bg-slate-700 mx-2 shrink-0"
          />
          <div class="h-3 bg-slate-700 w-52"></div>
        </div>
      </div>
    </div>
  </div>
</template>
