Add homepage to show all events
This commit is contained in:
51
public/index.html
Normal file
51
public/index.html
Normal file
@@ -0,0 +1,51 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='UTF-8'>
|
||||
<meta name='viewport' content='width=device-width, initial-scale=1'>
|
||||
|
||||
<title>Trip Schedule</title>
|
||||
|
||||
<link href='output.css' rel='stylesheet'>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.11.0/qs.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class='fixed flex justify-between p-4 shadow-sm w-screen bg-white z-10'>
|
||||
<h1 class='text-3xl'>Trip Schedule</h1>
|
||||
</header>
|
||||
|
||||
<div id='container' class='min-h-screen z-0 p-8 pt-20 bg-gray-100'>
|
||||
</div>
|
||||
|
||||
<template id='events-container'>
|
||||
<div class='my-8'>
|
||||
<h2 class='events-container-title text-2xl mb-4'></h2>
|
||||
<div class='grid md:grid-cols-3 lg:grid-cols-4 grid-cols-1 gap-4'>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id='event-card'>
|
||||
<div class='shadow-xl rounded-md text-center p-4 bg-white relative'>
|
||||
<h3 class='event-name text-2xl'></h3>
|
||||
|
||||
<span class='event-type py-0.5 px-3 rounded my-2 inline-block'></span>
|
||||
|
||||
<div class='event-date text-red-600 text-l'>
|
||||
<span class='event-start'></span>
|
||||
<span class='event-time-seperator hidden'> - </span>
|
||||
<span class='event-end'></span>
|
||||
</div>
|
||||
<div class='event-time text-red-600 text-l'>
|
||||
<span class='event-start'></span>
|
||||
<span class='event-time-seperator hidden'> - </span>
|
||||
<span class='event-end'></span>
|
||||
</div>
|
||||
<a class='event-link absolute inset-0 block' href=''></a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script src='script.js' type='module'></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user