blob: 7db84f95a6d1114095ee27aa1dcaeb240a38e39b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
<script lang="ts">
import type PeerTeacher from "../../models/PeerTeacher";
export let pt: PeerTeacher;
</script>
<!-- PT Box -->
<div class="block border-b px-3 py-3 hover:bg-sky-100 hover:text-black">
<!-- Top half, name and button -->
<div class="flex flex-row items-center">
<!-- Left half, name -->
<strong class="flex-grow text-sm">{pt.name}</strong>
<!-- Right half, button -->
<!-- The button to open modal -->
<label for="my-modal-4" class="">
<svg
on:click={() => console.log(pt.name)}
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width={2}
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
/>
</svg>
</label>
<input type="checkbox" id="my-modal-4" class="modal-toggle"/>
<label for="my-modal-4" class="modal cursor-pointer">
<label class="modal-box relative" for="">
<h3 class="text-lg font-bold ">
{pt.name}
</h3>
{#each pt.events as e}
<p class="py-4">
{e.info}
</p>
{/each}
</label>
</label>
</div>
<!-- Bottom -->
<div>Hours: {pt.lab_hours}</div>
</div>
|
