Skip to content

Instantly share code, notes, and snippets.

@Mikepicker

Mikepicker/pocketbase_todo_lists.html

Created September 26, 2022 17:01
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Mikepicker/dd9c825230da00192a395b031e153feb to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Mikepicker/dd9c825230da00192a395b031e153feb to your computer and use it in GitHub Desktop.
Download ZIP
Raw
pocketbase_todo_lists.html
<html>
<head>
...
</head>
<body>
<div x-data="lists" class="container">
<!-- NAVBAR BLOCK -->
<!-- LOGIN / SIGNUP BLOCK -->
<!-- show lists -->
<article x-show="!showLogin && !selectedList" x-transition style="margin-top: 10%;">
<h2>Your Lists</h2>
<template x-for="list in lists">
<div style="display:flex; justify-content: space-between; margin-top: 1rem">
<u><strong x-text="list.name" @click="selectList(list)" style="cursor: pointer;"></strong></u>
<i @click="deleteList(list)" class="bx bx-trash bx-sm" style="text-align: end; cursor: pointer"></i>
</div>
</template>
<hr style="margin: 2rem"></hr>
<label for="newList">Create New List</label>
<input x-model="newListName" id="newList" type="newList" placeholder="List Name">
<button @click="createList" class="contrast outline">Create</button>
</article>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment