Last 10 Commits for doctorly1.scroll.pub

commit 751a31b546784c719caaa831c4eea7af743e7e5f Author: root <root@hub.scroll.pub> Date: 2024-12-27 19:20:01 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..d0e258a --- /dev/null +++ b/body.html @@ -0,0 +1,50 @@ +<header> + <nav> + <a href="/">Home</a> + <a href="/search">Search Doctors</a> + <a href="/login">Login</a> + <button id="theme-toggle">Toggle Theme</button> + </nav> + <h1>Welcome to Doctorly</h1> + <p>Your modern solution for booking doctor appointments</p> +</header> + +<main> + <section id="hero"> + <div class="carousel"> + <div class="slide"> + <h2>Find the Best Doctors</h2> + <p>Search by specialty, location, and availability</p> + </div> + <div class="slide"> + <h2>Book Appointments Easily</h2> + <p>Interactive calendar for seamless booking</p> + </div> + <div class="slide"> + <h2>Manage Your Health</h2> + <p>Track your appointments and doctor recommendations</p> + </div> + </div> + </section> + + <section id="testimonials"> + <h2>What Our Patients Say</h2> + <div class="testimonial"> + <p>"Doctorly made finding and booking appointments so easy!"</p> + <p>- Jane Doe</p> + </div> + <div class="testimonial"> + <p>"The user interface is clean and intuitive. Highly recommend!"</p> + <p>- John Smith</p> + </div> + </section> + + <section id="cta"> + <h2>Ready to Get Started?</h2> + <a href="/search" class="cta-button">Find a Doctor</a> + </section> +</main> + +<footer> + <p>Doctorly - Modern Doctor's Appointment Platform</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..e485a7c --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://doctorly.scroll.pub +metaTags +editButton /edit.html +title Doctorly - Modern Doctor's Appointment Platform +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..62c080f --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "e665e23b-0ce0-4e00-b1ce-2ce4ccc1b95c", + "object": "chat.completion", + "created": 1735327184, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\ndoctorly.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://doctorly.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Doctorly - Modern Doctor's Appointment Platform\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <nav>\n <a href=\"/\">Home</a>\n <a href=\"/search\">Search Doctors</a>\n <a href=\"/login\">Login</a>\n <button id=\"theme-toggle\">Toggle Theme</button>\n </nav>\n <h1>Welcome to Doctorly</h1>\n <p>Your modern solution for booking doctor appointments</p>\n</header>\n\n<main>\n <section id=\"hero\">\n <div class=\"carousel\">\n <div class=\"slide\">\n <h2>Find the Best Doctors</h2>\n <p>Search by specialty, location, and availability</p>\n </div>\n <div class=\"slide\">\n <h2>Book Appointments Easily</h2>\n <p>Interactive calendar for seamless booking</p>\n </div>\n <div class=\"slide\">\n <h2>Manage Your Health</h2>\n <p>Track your appointments and doctor recommendations</p>\n </div>\n </div>\n </section>\n\n <section id=\"testimonials\">\n <h2>What Our Patients Say</h2>\n <div class=\"testimonial\">\n <p>\"Doctorly made finding and booking appointments so easy!\"</p>\n <p>- Jane Doe</p>\n </div>\n <div class=\"testimonial\">\n <p>\"The user interface is clean and intuitive. Highly recommend!\"</p>\n <p>- John Smith</p>\n </div>\n </section>\n\n <section id=\"cta\">\n <h2>Ready to Get Started?</h2>\n <a href=\"/search\" class=\"cta-button\">Find a Doctor</a>\n </section>\n</main>\n\n<footer>\n <p>Doctorly - Modern Doctor's Appointment Platform</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2563eb;\n --secondary-color: #1e40af;\n --background-color: #ffffff;\n --text-color: #1e293b;\n --shadow-color: rgba(0, 0, 0, 0.1);\n}\n\n[data-theme=\"dark\"] {\n --primary-color: #3b82f6;\n --secondary-color: #1e40af;\n --background-color: #1e293b;\n --text-color: #f8fafc;\n --shadow-color: rgba(255, 255, 255, 0.1);\n}\n\nbody {\n font-family: 'Arial', sans-serif;\n background-color: var(--background-color);\n color: var(--text-color);\n margin: 0;\n padding: 0;\n transition: background-color 0.3s, color 0.3s;\n}\n\nheader {\n background-color: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nnav {\n display: flex;\n justify-content: center;\n gap: 1rem;\n margin-bottom: 1rem;\n}\n\nnav a {\n color: white;\n text-decoration: none;\n font-weight: bold;\n}\n\n#theme-toggle {\n background-color: var(--secondary-color);\n color: white;\n border: none;\n padding: 0.5rem 1rem;\n cursor: pointer;\n}\n\n#hero {\n padding: 2rem;\n text-align: center;\n}\n\n.carousel {\n display: flex;\n overflow: hidden;\n width: 100%;\n max-width: 800px;\n margin: 0 auto;\n}\n\n.slide {\n min-width: 100%;\n transition: transform 0.5s ease;\n}\n\n#testimonials {\n padding: 2rem;\n text-align: center;\n}\n\n.testimonial {\n background-color: var(--shadow-color);\n padding: 1rem;\n margin: 1rem auto;\n max-width: 600px;\n border-radius: 8px;\n}\n\n#cta {\n padding: 2rem;\n text-align: center;\n}\n\n.cta-button {\n background-color: var(--primary-color);\n color: white;\n padding: 1rem 2rem;\n text-decoration: none;\n border-radius: 8px;\n font-weight: bold;\n}\n\nfooter {\n background-color: var(--primary-color);\n color: white;\n text-align: center;\n padding: 1rem;\n margin-top: 2rem;\n}\n\n@media (max-width: 768px) {\n nav {\n flex-direction: column;\n }\n\n .carousel {\n flex-direction: column;\n }\n\n .slide {\n min-width: 100%;\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const themeToggle = document.getElementById('theme-toggle');\n const body = document.body;\n\n const savedTheme = localStorage.getItem('theme') || 'light';\n body.setAttribute('data-theme', savedTheme);\n\n themeToggle.addEventListener('click', () => {\n const currentTheme = body.getAttribute('data-theme');\n const newTheme = currentTheme === 'light' ? 'dark' : 'light';\n body.setAttribute('data-theme', newTheme);\n localStorage.setItem('theme', newTheme);\n });\n\n const carousel = document.querySelector('.carousel');\n let slideIndex = 0;\n\n setInterval(() => {\n slideIndex = (slideIndex + 1) % carousel.children.length;\n carousel.style.transform = `translateX(-${slideIndex * 100}%)`;\n }, 5000);\n});\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 725, + "completion_tokens": 1272, + "total_tokens": 1997, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 725 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..d3a9d74 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# doctorly1.scroll.pub +Website generated by DeepSeek from prompt: Generate a full-stack MERN (MongoDB, Express, React, Node.js) application for a modern Doctor's Appointment website with the following features, using Vite for the frontend:Frontend Modern UI/UX Design: Support light and dark modes with a toggle switch. Responsive design for mobile, tablet, and desktop compatibility. Smooth animations and transitions (e.g., a carousel for showcasing doctors or testimonials). Pages: Home Page: Modern layout with a carousel showcasing featured doctors or services, a call-to-action section, and customer testimonials. Login/Sign-up Page: Secure authentication using JWT. User Dashboard: Displays upcoming appointments, doctor recommendations, and personal profiles. Search Page: Search doctors by specialty, location, availability, and ratings. Appointment Booking Page: Interactive calendar for slot selection and booking confirmation. Frontend Framework: Use React for the frontend with Vite for faster development and optimized production builds. Use Tailwind CSS for clean, modern, and customizable styling. Implement routing using react-router-dom. Backend Node.js with Express: RESTful APIs for user authentication, appointment management, and doctor data retrieval. Secure routes using JWT for authentication and role-based access control (e.g., admin vs. user). Database: Use MongoDB to store data: Users: Name, email, password (hashed), appointments, and preferences. Doctors: Name, specialty, ratings, availability, and location. Appointments: User ID, doctor ID, date, time, and status. Prepopulate the database with random doctor profiles (e.g., 20 entries). Deployment Frontend: Deploy the frontend on Vercel or GitHub Pages (using vite.config.js adjustments for relative paths). Backend: Deploy the backend on platforms like Render, Vercel, or AWS Lambda. Use .env files to manage sensitive environment variables (e.g., MongoDB URI, JWT secret). Additional Features Dark/Light Mode: Implement a toggle switch with local storage to save user preferences. SEO Optimizations: Use meta tags and dynamic routing for better search engine visibility. Sample Data: Create a JSON file for the prepopulated doctor database with fields: Name, Specialty, Availability (dates/times), Ratings (1-5 stars), and Location. Interactive Components: Use libraries like react-calendar or fullcalendar for appointment selection. Add animated modals for login, registration, and booking confirmation. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..55bb834 --- /dev/null +++ b/script.js @@ -0,0 +1,22 @@ +document.addEventListener('DOMContentLoaded', () => { + const themeToggle = document.getElementById('theme-toggle'); + const body = document.body; + + const savedTheme = localStorage.getItem('theme') || 'light'; + body.setAttribute('data-theme', savedTheme); + + themeToggle.addEventListener('click', () => { + const currentTheme = body.getAttribute('data-theme'); + const newTheme = currentTheme === 'light' ? 'dark' : 'light'; + body.setAttribute('data-theme', newTheme); + localStorage.setItem('theme', newTheme); + }); + + const carousel = document.querySelector('.carousel'); + let slideIndex = 0; + + setInterval(() => { + slideIndex = (slideIndex + 1) % carousel.children.length; + carousel.style.transform = `translateX(-${slideIndex * 100}%)`; + }, 5000); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..f4d3666 --- /dev/null +++ b/style.css @@ -0,0 +1,119 @@ +:root { + --primary-color: #2563eb; + --secondary-color: #1e40af; + --background-color: #ffffff; + --text-color: #1e293b; + --shadow-color: rgba(0, 0, 0, 0.1); +} + +[data-theme="dark"] { + --primary-color: #3b82f6; + --secondary-color: #1e40af; + --background-color: #1e293b; + --text-color: #f8fafc; + --shadow-color: rgba(255, 255, 255, 0.1); +} + +body { + font-family: 'Arial', sans-serif; + background-color: var(--background-color); + color: var(--text-color); + margin: 0; + padding: 0; + transition: background-color 0.3s, color 0.3s; +} + +header { + background-color: var(--primary-color); + color: white; + padding: 2rem; + text-align: center; +} + +nav { + display: flex; + justify-content: center; + gap: 1rem; + margin-bottom: 1rem; +} + +nav a { + color: white; + text-decoration: none; + font-weight: bold; +} + +#theme-toggle { + background-color: var(--secondary-color); + color: white; + border: none; + padding: 0.5rem 1rem; + cursor: pointer; +} + +#hero { + padding: 2rem; + text-align: center; +} + +.carousel { + display: flex; + overflow: hidden; + width: 100%; + max-width: 800px; + margin: 0 auto; +} + +.slide { + min-width: 100%; + transition: transform 0.5s ease; +} + +#testimonials { + padding: 2rem; + text-align: center; +} + +.testimonial { + background-color: var(--shadow-color); + padding: 1rem; + margin: 1rem auto; + max-width: 600px; + border-radius: 8px; +} + +#cta { + padding: 2rem; + text-align: center; +} + +.cta-button { + background-color: var(--primary-color); + color: white; + padding: 1rem 2rem; + text-decoration: none; + border-radius: 8px; + font-weight: bold; +} + +footer { + background-color: var(--primary-color); + color: white; + text-align: center; + padding: 1rem; + margin-top: 2rem; +} + +@media (max-width: 768px) { + nav { + flex-direction: column; + } + + .carousel { + flex-direction: column; + } + + .slide { + min-width: 100%; + } +} \ No newline at end of file