Skip to content

Instantly share code, notes, and snippets.

@Mikepicker
Created September 26, 2022 16:44
Show Gist options
  • Select an option

  • Save Mikepicker/bb0029d6e9ceff349a08eee037bc4863 to your computer and use it in GitHub Desktop.

Select an option

Save Mikepicker/bb0029d6e9ceff349a08eee037bc4863 to your computer and use it in GitHub Desktop.
<html>
<head>
...
</head>
<body>
<div x-data="lists" class="container">
<nav>
<ul>
<li>
<h1 @click="selectedList = null" style="margin:0; text-align: center; cursor: pointer">DooDoo</h1>
</li>
</ul>
<ul>
<li><i x-show="!showLogin" @click="logout()" class="bx bx-log-out bx-md" style="cursor: pointer"></i></li>
</ul>
</nav>
<!-- login / signup -->
<article x-show="showLogin" x-transition>
<h2>Login</h2>
<label for="email">Email</label>
<input x-model="email" type="email" id="email" placeholder="Email address">
<label for="password">Password</label>
<input x-model="password" type="password" id="password">
<button @click="login()" class="contrast outline">Login</button>
<mark x-show="loginMessage" x-text="loginMessage"></mark>
<hr style="margin: 4rem;"></hr>
<h2>Signup</h2>
<label for="email">Email</label>
<input x-model="email" type="email" id="email" placeholder="Email address">
<label for="password">Password</label>
<input x-model="password" type="password" id="password">
<label for="passwordConfirm">Confirm Password</label>
<input x-model="passwordConfirm" type="password" id="passwordConfirm">
<button @click="signup()" class="contrast outline">Signup</button>
<mark x-show="signupMessage" x-text="signupMessage"></mark>
</article>
</div>
</body>
</head>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment