commit c66c3497d709f1981ce5589d66aae7e714ee4367
Author: root <root@hub.scroll.pub> Date: 2024-12-27 09:43:56 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..36f464f --- /dev/null +++ b/body.html @@ -0,0 +1,44 @@ +<header> + <h1>Playmate</h1> + <p>Find your perfect partner for badminton or table tennis.</p> +</header> + +<main> + <section id="create-game"> + <h2>Create a Game</h2> + <form id="game-form"> + <label for="sport">Sport:</label> + <select id="sport" name="sport" required> + <option value="badminton">Badminton</option> + <option value="table-tennis">Table Tennis</option> + </select> + + <label for="date">Date:</label> + <input type="date" id="date" name="date" required> + + <label for="time">Time:</label> + <input type="time" id="time" name="time" required> + + <label for="location">Location:</label> + <input type="text" id="location" name="location" required> + + <label for="level">Skill Level:</label> + <select id="level" name="level" required> + <option value="beginner">Beginner</option> + <option value="intermediate">Intermediate</option> + <option value="advanced">Advanced</option> + </select> + + <button type="submit">Create Game</button> + </form> + </section> + + <section id="game-list"> + <h2>Available Games</h2> + <ul id="games"></ul> + </section> +</main> + +<footer> + <p>Playmate - Connecting players since 2023</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..69971aa --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://playmate.scroll.pub +metaTags +editButton /edit.html +title Playmate - Find Your Game Partner +style.css +body.html +script.js \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..831e81b --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# playmate.scroll.pub +Website generated by DeepSeek from prompt: i want a site where i can find partner to play in badminton or table tennis, i want to have possibility to create game in a certain time and place for different levels \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..3fb61d4 --- /dev/null +++ b/script.js @@ -0,0 +1,25 @@ +document.addEventListener('DOMContentLoaded', function() { + const gameForm = document.getElementById('game-form'); + const gamesList = document.getElementById('games'); + + gameForm.addEventListener('submit', function(e) { + e.preventDefault(); + + const sport = document.getElementById('sport').value; + const date = document.getElementById('date').value; + const time = document.getElementById('time').value; + const location = document.getElementById('location').value; + const level = document.getElementById('level').value; + + const gameItem = document.createElement('li'); + gameItem.innerHTML = ` + <strong>${sport.toUpperCase()}</strong><br> + Date: ${date} | Time: ${time}<br> + Location: ${location}<br> + Level: ${level} + `; + + gamesList.appendChild(gameItem); + gameForm.reset(); + }); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..d18049f --- /dev/null +++ b/style.css @@ -0,0 +1,92 @@ +:root { + --primary-color: #4CAF50; + --secondary-color: #45a049; + --background-color: #f4f4f4; + --text-color: #333; + --white: #fff; +} + +body { + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + margin: 0; + padding: 0; + background-color: var(--background-color); + color: var(--text-color); + line-height: 1.6; +} + +header { + background-color: var(--primary-color); + color: var(--white); + padding: 2rem; + text-align: center; +} + +h1 { + margin: 0; + font-size: 2.5rem; +} + +main { + padding: 2rem; + max-width: 800px; + margin: 0 auto; +} + +section { + background-color: var(--white); + padding: 1.5rem; + margin-bottom: 2rem; + border-radius: 8px; + box-shadow: 0 2px 5px rgba(0,0,0,0.1); +} + +form { + display: grid; + grid-gap: 1rem; +} + +label { + font-weight: bold; +} + +input, select, button { + padding: 0.5rem; + border: 1px solid #ddd; + border-radius: 4px; +} + +button { + background-color: var(--primary-color); + color: var(--white); + border: none; + cursor: pointer; + transition: background-color 0.3s ease; +} + +button:hover { + background-color: var(--secondary-color); +} + +#games { + list-style: none; + padding: 0; +} + +#games li { + background-color: var(--white); + padding: 1rem; + margin-bottom: 1rem; + border-radius: 4px; + box-shadow: 0 1px 3px rgba(0,0,0,0.1); +} + +@media (max-width: 600px) { + h1 { + font-size: 2rem; + } + + main { + padding: 1rem; + } +} \ No newline at end of file