commit 3b0c90699370eb0ec173ddd3f58cee7882f4d884
Author: root <root@hub.scroll.pub> Date: 2024-12-27 14:54:17 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..856e293 --- /dev/null +++ b/body.html @@ -0,0 +1,34 @@ +<header> + <h1>TripWise</h1> + <p>Your ultimate travel planning companion</p> +</header> + +<main> + <section id="search"> + <h2>Plan Your Trip</h2> + <form id="trip-form"> + <label for="destination">Destination:</label> + <input type="text" id="destination" placeholder="Enter your destination" required> + + <label for="dates">Travel Dates:</label> + <input type="date" id="start-date" required> + <input type="date" id="end-date" required> + + <button type="submit">Plan My Trip</button> + </form> + </section> + + <section id="itinerary" class="hidden"> + <h2>Your Itinerary</h2> + <div id="itinerary-list"></div> + </section> + + <section id="accommodation"> + <h2>Find Places to Stay</h2> + <div id="accommodation-list"></div> + </section> +</main> + +<footer> + <p>Made with ❤️ by TripWise</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..747970b --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://tripwise.scroll.pub +metaTags +editButton /edit.html +title TripWise - Plan Your Travel Itinerary & Find Places to Stay +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..d409032 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# tripwise.scroll.pub +Website generated by DeepSeek from prompt: create a website where i can plan the travel itinerary for my trip to a specific place and find place to live \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..97eae41 --- /dev/null +++ b/script.js @@ -0,0 +1,40 @@ +document.getElementById('trip-form').addEventListener('submit', function(e) { + e.preventDefault(); + + const destination = document.getElementById('destination').value; + const startDate = document.getElementById('start-date').value; + const endDate = document.getElementById('end-date').value; + + // Show itinerary section + document.getElementById('itinerary').classList.remove('hidden'); + + // Clear previous itinerary + const itineraryList = document.getElementById('itinerary-list'); + itineraryList.innerHTML = ''; + + // Add trip details to itinerary + const tripDetails = document.createElement('div'); + tripDetails.className = 'trip-details'; + tripDetails.innerHTML = ` + <h3>${destination}</h3> + <p>${startDate} to ${endDate}</p> + `; + itineraryList.appendChild(tripDetails); + + // Simulate finding accommodations + const accommodationList = document.getElementById('accommodation-list'); + accommodationList.innerHTML = ` + <div class="accommodation-item"> + <h3>Luxury Hotel</h3> + <p>5-star hotel in city center</p> + </div> + <div class="accommodation-item"> + <h3>Cozy B&B</h3> + <p>Charming bed and breakfast</p> + </div> + <div class="accommodation-item"> + <h3>Budget Hostel</h3> + <p>Affordable shared accommodations</p> + </div> + `; +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..502a816 --- /dev/null +++ b/style.css @@ -0,0 +1,105 @@ +:root { + --primary-color: #1a73e8; + --secondary-color: #f1f3f4; + --text-color: #202124; + --border-radius: 8px; +} + +body { + font-family: 'Segoe UI', sans-serif; + line-height: 1.6; + color: var(--text-color); + margin: 0; + padding: 0; + background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); + min-height: 100vh; +} + +header { + background: var(--primary-color); + color: white; + padding: 2rem; + text-align: center; + border-bottom: 4px solid #1557b0; +} + +h1 { + font-size: 2.5rem; + margin: 0; +} + +p { + margin: 0.5rem 0 0; +} + +main { + max-width: 1200px; + margin: 2rem auto; + padding: 0 1rem; +} + +section { + background: white; + border-radius: var(--border-radius); + box-shadow: 0 2px 4px rgba(0,0,0,0.1); + padding: 2rem; + margin-bottom: 2rem; +} + +form { + display: grid; + gap: 1rem; +} + +label { + font-weight: 500; +} + +input { + padding: 0.75rem; + border: 1px solid #ddd; + border-radius: var(--border-radius); + font-size: 1rem; +} + +button { + background: var(--primary-color); + color: white; + padding: 0.75rem 1.5rem; + border: none; + border-radius: var(--border-radius); + cursor: pointer; + font-size: 1rem; + transition: background 0.3s ease; +} + +button:hover { + background: #1557b0; +} + +.hidden { + display: none; +} + +#itinerary-list, +#accommodation-list { + display: grid; + gap: 1rem; +} + +footer { + text-align: center; + padding: 1rem; + background: var(--secondary-color); + margin-top: 2rem; +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } + + form { + grid-template-columns: 1fr; + } +} \ No newline at end of file