|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8" /> |
|
<meta name="viewport" content="width=device-width" /> |
|
<title>My static Space</title> |
|
<script src="https://cdn.tailwindcss.com"></script> |
|
</head> |
|
<body> |
|
<div class="h-screen w-screen bg-black/95 px-12 text-gray-300/90"> |
|
<div class="mx-auto flex h-screen max-h-screen max-w-4xl flex-col gap-8 overflow-x-auto pt-12"> |
|
<div class="flex items-start justify-start gap-4 leading-relaxed"> |
|
<img src="https://huggingface.co/avatars/2edb18bd0206c16b433841a47f53fa8e.svg" class="mt-5 h-4 w-4 flex-none rounded-full shadow-lg shadow-white/40" /> |
|
<div class="text-blue-00 group relative rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-800/20 px-5 pt-4 pb-5">Lorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing elit. Dolorum maiores quo officiis?</div> |
|
</div> |
|
<div class="mb-2 flex items-start justify-start gap-4 text-gray-300/70"> |
|
<div class="mt-4 h-4 w-4 flex-none rounded-full"></div> |
|
<div class="rounded-2xl px-4 py-3.5">Lorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum</div> |
|
</div> |
|
<div class="flex items-start justify-start gap-4 leading-relaxed"> |
|
<img src="https://huggingface.co/avatars/2edb18bd0206c16b433841a47f53fa8e.svg" class="mt-5 h-3 w-3 flex-none rounded-full bg-white" /> |
|
<div class="text-blue-00 rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-800/20 px-5 pt-4 pb-5"> |
|
<p>Lorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit</p> |
|
<div class="mt-4 flex flex-wrap gap-4 first:mt-0"> |
|
<img src="https://lexica-serve-encoded-images2.sharif.workers.dev/full_jpg/7a6fcbc9-3440-49b4-9c33-eaadc59a462d" alt="" class="max-h-[360px] rounded-xl" /> |
|
<img src="https://lexica-serve-encoded-images2.sharif.workers.dev/full_jpg/11d91b58-4305-45de-b608-1142ddc118a7" alt="" class="max-h-[360px] rounded-xl" /> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="flex items-start justify-start gap-4 text-gray-300"> |
|
<div class="mt-4 h-4 w-4 flex-none rounded-full"></div> |
|
<div class="rounded-2xl px-4 py-3.5">Lorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum, dolor sit amet consectetur adipisicing eLorem ipsum</div> |
|
</div> |
|
<div class="flex items-start justify-start gap-4 leading-relaxed"> |
|
<img src="https://huggingface.co/avatars/2edb18bd0206c16b433841a47f53fa8e.svg" class="mt-5 h-4 w-4 flex-none rounded-full shadow-lg shadow-white/40" /> |
|
<div class="group relative rounded-2xl bg-gradient-to-br from-gray-800/50 to-gray-800/20 px-5 pt-4 pb-5 text-blue-900"><div class="h-4 w-2 animate-pulse bg-white/20"></div></div> |
|
</div> |
|
</div> |
|
|
|
<div class="fixed inset-x-0 bottom-12 mx-auto max-w-4xl"> |
|
<div class="w-full rounded-2xl border border-black bg-gradient-to-br from-gray-800/40 to-gray-800/50 px-4 py-3.5 shadow-2xl shadow-white/5 outline-none ring-gray-700 focus:ring-1" role="textbox" contenteditable>Ask anything...</div> |
|
|
|
</div> |
|
</div> |
|
</body> |
|
</html> |
|
|
