Matthew Aaron Raymer
2 years ago
3 changed files with 90 additions and 2 deletions
@ -1,3 +1,89 @@ |
|||
<template> |
|||
<section id="Content" class="p-6 pb-24"></section> |
|||
<section id="Content" class="p-6 pb-24"> |
|||
<!-- Heading --> |
|||
<h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8"> |
|||
My Projects |
|||
</h1> |
|||
|
|||
<!-- Quick Search --> |
|||
<form id="QuickSearch" class="mb-4 flex"> |
|||
<input |
|||
type="text" |
|||
placeholder="Search…" |
|||
class="block w-full rounded-l border-r-0 border-slate-400" |
|||
/> |
|||
<button |
|||
class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400" |
|||
> |
|||
<i class="fa-solid fa-magnifying-glass fa-fw"></i> |
|||
</button> |
|||
</form> |
|||
|
|||
<!-- New Project --> |
|||
<button |
|||
class="fixed right-6 bottom-24 text-center text-4xl leading-none bg-blue-600 text-white w-14 py-2.5 rounded-full" |
|||
> |
|||
<fa icon="plus" class="fa-fw"></fa> |
|||
</button> |
|||
|
|||
<!-- Results List --> |
|||
<ul class=""> |
|||
<li class="border-b border-slate-300"> |
|||
<a href="project-view.html" class="block py-4 flex gap-4"> |
|||
<div class="flex-none w-12"> |
|||
<img |
|||
src="https://picsum.photos/200/200?random=1" |
|||
class="w-full rounded" |
|||
/> |
|||
</div> |
|||
|
|||
<div class="grow overflow-hidden"> |
|||
<h2 class="text-base font-semibold">Canyon cleanup</h2> |
|||
<div class="text-sm truncate"> |
|||
The quick brown fox jumps over the lazy dog. The quick brown fox |
|||
jumps over the lazy dog. |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</li> |
|||
|
|||
<li class="border-b border-slate-300"> |
|||
<a href="project-view.html" class="block py-4 flex gap-4"> |
|||
<div class="flex-none w-12"> |
|||
<img |
|||
src="https://picsum.photos/200/200?random=2" |
|||
class="w-full rounded" |
|||
/> |
|||
</div> |
|||
|
|||
<div class="grow overflow-hidden"> |
|||
<h2 class="text-base font-semibold">Potluck with neighbors</h2> |
|||
<div class="text-sm truncate"> |
|||
The quick brown fox jumps over the lazy dog. The quick brown fox |
|||
jumps over the lazy dog. |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</li> |
|||
|
|||
<li class="border-b border-slate-300"> |
|||
<a href="project-view.html" class="block py-4 flex gap-4"> |
|||
<div class="flex-none w-12"> |
|||
<img |
|||
src="https://picsum.photos/200/200?random=3" |
|||
class="w-full rounded" |
|||
/> |
|||
</div> |
|||
|
|||
<div class="grow overflow-hidden"> |
|||
<h2 class="text-base font-semibold">Historical site</h2> |
|||
<div class="text-sm truncate"> |
|||
The quick brown fox jumps over the lazy dog. The quick brown fox |
|||
jumps over the lazy dog. |
|||
</div> |
|||
</div> |
|||
</a> |
|||
</li> |
|||
</ul> |
|||
</section> |
|||
</template> |
|||
|
Loading…
Reference in new issue