trent_larson
/
kickstarter-for-time
6
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

New layout: Project List

master
Jose Olarte III 2 years ago
parent
2305440d9d
commit
f02cf3b2ea
1 changed files with 89 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 89
      project-list.html

89
project-list.html
View File

@ -0,0 +1,89 @@
<!doctype html>
<html class="text-slate-700">
<head>
<title>My Projects - Kickstarter for Time</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Tailwind -->
<script src="https://cdn.tailwindcss.com?plugins=forms"></script>
<!-- Font Awesome -->
<script src="https://kit.fontawesome.com/2396c18fde.js" crossorigin="anonymous"></script>
<link href="css/main.css" rel="stylesheet">
</head>
<body>
<!-- QUICK NAV -->
<nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200">
<ul class="flex text-2xl p-2 gap-2">
<!-- Home Feed -->
<li class="basis-1/5 rounded-md text-slate-500"><a href="" class="block text-center py-3 px-1"><i class="fa-solid fa-house-chimney fa-fw"></i></a></li>
<!-- Search -->
<li class="basis-1/5 rounded-md text-slate-500"><a href="search.html" class="block text-center py-3 px-1"><i class="fa-solid fa-magnifying-glass fa-fw"></i></a></li>
<!-- Projects -->
<li class="basis-1/5 rounded-md bg-slate-400 text-white"><a href="" class="block text-center py-3 px-1"><i class="fa-solid fa-folder-open fa-fw"></i></a></li>
<!-- Commitments -->
<li class="basis-1/5 rounded-md text-slate-500"><a href="" class="block text-center py-3 px-1"><i class="fa-solid fa-hand fa-fw rotate-45"></i></a></li>
<!-- Profile -->
<li class="basis-1/5 rounded-md text-slate-500"><a href="account-view.html" class="block text-center py-3 px-1"><i class="fa-solid fa-circle-user fa-fw"></i></a></li>
</ul>
</nav>
<!-- CONTENT -->
<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>
<!-- 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>
</body>
</html>
Write Preview
Loading…
Cancel
Save