Skip to content

Instantly share code, notes, and snippets.

@duyixian1234

duyixian1234/index.html

Last active December 29, 2023 09:13
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save duyixian1234/28b7e4185d92dc523143def1ea255311 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save duyixian1234/28b7e4185d92dc523143def1ea255311 to your computer and use it in GitHub Desktop.
Download ZIP
comments
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Comment Component</title>
<link
href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css"
rel="stylesheet"
/>
<script src="script.js"></script>
</head>
<body class="bg-gray-100">
<div class="container mx-auto p-4">
<h1 class="text-2xl font-bold mb-4">Comments</h1>
<!-- Comment Form -->
<form class="mb-4">
<div class="flex flex-col mb-4">
<label for="comment" class="mb-2">Comment:</label>
<textarea
id="comment"
name="comment"
rows="4"
class="border border-gray-300 p-2"
></textarea>
</div>
<div class="flex flex-col mb-4">
<label for="email" class="mb-2">Email:</label>
<input
type="email"
id="email"
name="email"
class="border border-gray-300 p-2"
/>
</div>
<button
type="submit"
class="bg-blue-500 text-white py-2 px-4 rounded hover:bg-blue-600"
>
Submit
</button>
</form>
<!-- Comment List -->
<div class="bg-white p-4 border border-gray-300">
<h2 class="text-xl font-bold mb-4">Comments:</h2>
<ul>
<li class="mb-2">
<div class="font-bold">John Doe</div>
<div class="text-gray-600">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
</li>
<li class="mb-2">
<div class="font-bold">Jane Smith</div>
<div class="text-gray-600">
Pellentesque habitant morbi tristique senectus et netus et
malesuada fames ac turpis egestas.
</div>
</li>
</ul>
</div>
</div>
</body>
</html>
Raw
script.js
console.log("init");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment