Sisestuskastid

<div>
  <label for="name" class="block text-base font-semibold leading-6 text-gray-800 mb-2">Nimi</label>
  <input type="text" name="name" id="name" placeholder="Näiteks Toomas Nipernaadi" class="block w-full rounded py-3 px-4 text-gray-900 focus:outline-none focus:ring-2 sm:text-base sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
</div>

<div>
  <label for="title" class="block text-base font-semibold leading-6 text-gray-800 mb-2">Pealkiri</label>
  <input type="text" name="name" id="title" placeholder="Näiteks Tähtvere mõis" class="block w-full rounded py-3 px-4 text-gray-900 focus:outline-none focus:ring-2 sm:text-base sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
  <p class="mt-2 text-sm text-gray-500">Dokumendi või selle kirjeldamise tasandi pealkiri</p>
</div>

<div>
  <label for="name3" class="block text-base font-semibold leading-6 text-gray-800 mb-2">Nimi</label>
  <div class="relative">
    <input type="text" name="name" id="name3" placeholder="Näiteks Toomas Nipernaadi" class="block w-full rounded py-3 pl-4 pr-10 text-gray-900 focus:outline-none focus:ring-2 sm:text-base sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
    <div class="absolute inset-y-0 right-0 flex items-center pr-3">
      <svg class="relative h-7 w-7 p-1 rounded-full border-gray-200 hover:border-gray-300 hover:bg-gray-50" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
        <path d="M11 18H13V16H11V18ZM12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 20C7.59 20 4 16.41 4 12C4 7.59 7.59 4 12 4C16.41 4 20 7.59 20 12C20 16.41 16.41 20 12 20ZM12 6C9.79 6 8 7.79 8 10H10C10 8.9 10.9 8 12 8C13.1 8 14 8.9 14 10C14 12 11 11.75 11 15H13C13 12.75 16 12.5 16 10C16 7.79 14.21 6 12 6Z"/>
      </svg>
    </div>
  </div>
</div>

<div>
  <label for="email" class="block text-base font-semibold leading-6 text-gray-800 mb-2">Email</label>
  <input type="text" name="name" id="email" value="info@ra" class="block w-full rounded py-3 px-4 focus:outline-none focus:ring-2 sm:text-base sm:leading-6 border border-red-300 hover:border-red-400 focus:border-red-600 focus:ring-red-200 focus:ring-red-200">
  <p class="mt-2 text-sm text-red-500">Vigane meiliaadress</p>
</div>

<div>
  <label for="comment" class="block text-base font-semibold leading-6 text-gray-800 mb-2">Kommentaar</label>
  <textarea rows="2" name="comment" id="comment" class="block w-full rounded py-3 px-4 text-gray-900 focus:outline-none focus:ring-2 sm:text-base sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300"></textarea>
</div>

<div>
  <label for="name2" class="block text-sm font-semibold leading-6 text-gray-800 mb-1">Nimi</label>
  <input type="text" name="name" id="name2" placeholder="Näiteks Toomas Nipernaadi" class="block w-full rounded px-3 py-1.5 text-gray-900 focus:outline-none focus:ring-2 sm:text-sm sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
</div>

<div>
  <label for="title2" class="block text-sm font-semibold leading-6 text-gray-800 mb-1">Pealkiri</label>
  <input type="text" name="name" id="title2" placeholder="Näiteks Tähtvere mõis" class="block w-full rounded py-1.5 px-3 text-gray-900 focus:outline-none focus:ring-2 sm:text-sm sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
  <p class="mt-2 text-sm text-gray-500">Dokumendi või selle kirjeldamise tasandi pealkiri</p>
</div>

<div>
  <label for="name4" class="block text-sm font-semibold leading-6 text-gray-800 mb-1">Nimi</label>
  <div class="relative">
    <input type="text" name="name" id="name4" placeholder="Näiteks Toomas Nipernaadi" class="block w-full rounded py-1.5 pl-3 pr-10 text-gray-900 focus:outline-none focus:ring-2 sm:text-sm sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300">
    <div class="absolute inset-y-0 right-0 flex items-center pr-3">
      <svg class="relative h-7 w-7 p-1 rounded-full border-gray-200 hover:border-gray-300 hover:bg-gray-50" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg">
        <path d="M11 18H13V16H11V18ZM12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 20C7.59 20 4 16.41 4 12C4 7.59 7.59 4 12 4C16.41 4 20 7.59 20 12C20 16.41 16.41 20 12 20ZM12 6C9.79 6 8 7.79 8 10H10C10 8.9 10.9 8 12 8C13.1 8 14 8.9 14 10C14 12 11 11.75 11 15H13C13 12.75 16 12.5 16 10C16 7.79 14.21 6 12 6Z"/>
      </svg>
    </div>
  </div>
</div>

<div>
  <label for="email2" class="block text-sm font-semibold leading-6 text-gray-800 mb-1">Email</label>
  <input type="text" name="name" id="email2" value="info@ra" class="block w-full rounded px-3 py-1.5 focus:outline-none focus:ring-2 sm:text-sm sm:leading-6 border border-red-300 hover:border-red-400 focus:border-red-600 focus:ring-red-200 focus:ring-red-200">
  <p class="mt-2 text-sm text-red-500">Vigane meiliaadress</p>
</div>

<div>
  <label for="comment2" class="block text-sm font-semibold leading-6 text-gray-800 mb-1">Kommentaar</label>
  <textarea rows="2" name="comment" id="comment2" class="block w-full rounded py-1.5 px-3 text-gray-900 focus:outline-none focus:ring-2 sm:text-sm sm:leading-6 border border-gray-200 hover:border-gray-300 focus:border-gray-500 focus:ring-green-300 focus:ring-green-300 placeholder:text-gray-300"></textarea>
</div>