commit 47e07a4f137f1d736446fc3e020dcba464bf2a9c
Author: ffff:77.98.241.22 <ffff:77.98.241.22@hub.scroll.pub> Date: 2024-12-27 10:17:28 +0000 Subject: updated index.scroll diff --git a/index.scroll b/index.scroll index c162bc5..d3e2120 100644 --- a/index.scroll +++ b/index.scroll @@ -5,4 +5,5 @@ editButton /edit.html title AI RPG - Craft Your Adventure style.css body.html -script.js \ No newline at end of file +script.js +index.html \ No newline at end of file
commit 47b2592e6752b2666426c47224fa6d9696d5e39d
Author: ffff:77.98.241.22 <ffff:77.98.241.22@hub.scroll.pub> Date: 2024-12-27 10:17:06 +0000 Subject: updated index.scroll diff --git a/index.scroll b/index.scroll index 5fc244b..c162bc5 100644 --- a/index.scroll +++ b/index.scroll @@ -1,5 +1,5 @@ buildHtml -baseUrl https://airpg.scroll.pub +baseUrl https://airPpg.scroll.pub metaTags editButton /edit.html title AI RPG - Craft Your Adventure
commit 8a565a590a09c4e145b63ecbc3277274999b7f4f
Author: root <root@hub.scroll.pub> Date: 2024-12-27 10:16:03 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..87f2fca --- /dev/null +++ b/body.html @@ -0,0 +1,28 @@ +<header> + <h1>AI RPG</h1> + <p>Your Adventure, Your Story</p> +</header> +<main> + <section id="character-creation"> + <h2>Create Your Character</h2> + <form id="character-form"> + <label for="name">Name:</label> + <input type="text" id="name" name="name" required> + <label for="class">Class:</label> + <select id="class" name="class" required> + <option value="warrior">Warrior</option> + <option value="mage">Mage</option> + <option value="rogue">Rogue</option> + </select> + <button type="submit">Start Adventure</button> + </form> + </section> + <section id="adventure" class="hidden"> + <h2>Your Adventure</h2> + <div id="story"></div> + <div id="choices"></div> + </section> +</main> +<footer> + <p>AI RPG - Craft Your Adventure</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..5fc244b --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://airpg.scroll.pub +metaTags +editButton /edit.html +title AI RPG - Craft Your Adventure +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..296571a --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# airpg.scroll.pub +Website generated by DeepSeek from prompt: Ai rpg \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..c67c40b --- /dev/null +++ b/script.js @@ -0,0 +1,35 @@ +document.getElementById('character-form').addEventListener('submit', function(event) { + event.preventDefault(); + const name = document.getElementById('name').value; + const charClass = document.getElementById('class').value; + + document.getElementById('character-creation').classList.add('hidden'); + document.getElementById('adventure').classList.remove('hidden'); + + startAdventure(name, charClass); +}); + +function startAdventure(name, charClass) { + const story = `Welcome, ${name}, the ${charClass}! Your journey begins in the mystical land of Eldoria. The fate of the realm rests in your hands.`; + document.getElementById('story').textContent = story; + + const choices = [ + { text: 'Explore the forest', outcome: 'You discover a hidden treasure.' }, + { text: 'Visit the village', outcome: 'The villagers ask for your help.' }, + { text: 'Climb the mountain', outcome: 'You encounter a fierce dragon.' } + ]; + + const choicesDiv = document.getElementById('choices'); + choicesDiv.innerHTML = ''; + + choices.forEach(choice => { + const button = document.createElement('button'); + button.textContent = choice.text; + button.classList.add('choice-button'); + button.addEventListener('click', () => { + document.getElementById('story').textContent = choice.outcome; + choicesDiv.innerHTML = ''; + }); + choicesDiv.appendChild(button); + }); +} \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..d2675e2 --- /dev/null +++ b/style.css @@ -0,0 +1,136 @@ +:root { + --primary-color: #4a90e2; + --secondary-color: #f5a623; + --background-color: #1e1e2f; + --text-color: #ffffff; + --font-family: 'Arial', sans-serif; +} + +body { + font-family: var(--font-family); + background-color: var(--background-color); + color: var(--text-color); + margin: 0; + padding: 0; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; +} + +header { + text-align: center; + margin-bottom: 2rem; +} + +header h1 { + font-size: 3rem; + color: var(--primary-color); +} + +header p { + font-size: 1.5rem; + color: var(--secondary-color); +} + +main { + width: 90%; + max-width: 800px; + background-color: #2d2d44; + padding: 2rem; + border-radius: 10px; + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); +} + +section { + margin-bottom: 2rem; +} + +h2 { + color: var(--primary-color); + margin-bottom: 1rem; +} + +form { + display: flex; + flex-direction: column; +} + +label { + margin-bottom: 0.5rem; + color: var(--text-color); +} + +input, select, button { + padding: 0.5rem; + margin-bottom: 1rem; + border: none; + border-radius: 5px; + font-size: 1rem; +} + +button { + background-color: var(--primary-color); + color: var(--text-color); + cursor: pointer; + transition: background-color 0.3s ease; +} + +button:hover { + background-color: var(--secondary-color); +} + +#adventure { + display: none; +} + +#story { + font-size: 1.2rem; + line-height: 1.6; + margin-bottom: 1.5rem; +} + +#choices { + display: flex; + flex-direction: column; + gap: 1rem; +} + +.choice-button { + background-color: var(--secondary-color); + color: var(--text-color); + padding: 0.75rem; + border: none; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease; +} + +.choice-button:hover { + background-color: var(--primary-color); +} + +footer { + text-align: center; + margin-top: 2rem; + color: var(--secondary-color); +} + +@media (max-width: 600px) { + header h1 { + font-size: 2rem; + } + + header p { + font-size: 1rem; + } + + main { + padding: 1rem; + } + + #story { + font-size: 1rem; + } +} \ No newline at end of file