Changes to calendora.scroll.pub

root
root
24 days ago
Initial commit
body.html
Changed around line 1
+
+

Calendora

+

Your simple, beautiful calendar

+
+
+
+
+
+

+
+
+
+
+
+
Sun
+
Mon
+
Tue
+
Wed
+
Thu
+
Fri
+
Sat
+
+
+
+
+
+
+

Stay organized with Calendora

+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://calendora.scroll.pub
+ metaTags
+ editButton /edit.html
+ title Calendora - Your Simple, Beautiful Calendar
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "edc21183-d52d-4453-bdba-ee2ef206e074",
+ "object": "chat.completion",
+ "created": 1735445450,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\ncalendora.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://calendora.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Calendora - Your Simple, Beautiful Calendar\nstyle.css\nbody.html\nscript.js\n---body.html---\n
\n

Calendora

\n

Your simple, beautiful calendar

\n
\n\n
\n
\n \n

\n \n
\n\n
\n
\n
Sun
\n
Mon
\n
Tue
\n
Wed
\n
Thu
\n
Fri
\n
Sat
\n
\n
\n
\n
\n\n
\n

Stay organized with Calendora

\n
\n---style.css---\n:root {\n --primary-color: #5c6bc0;\n --secondary-color: #42a5f5;\n --background-color: #f5f5f5;\n --text-color: #333;\n --border-color: #ddd;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background-color: var(--background-color);\n padding: 1rem;\n max-width: 800px;\n margin: 0 auto;\n}\n\nheader {\n text-align: center;\n margin: 2rem 0;\n}\n\nheader h1 {\n color: var(--primary-color);\n font-size: 2.5rem;\n}\n\n.calendar-controls {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin: 2rem 0;\n}\n\n.calendar-controls button {\n background: none;\n border: none;\n font-size: 2rem;\n cursor: pointer;\n color: var(--primary-color);\n padding: 0.5rem;\n}\n\n.calendar-controls button:hover {\n color: var(--secondary-color);\n}\n\n.calendar-grid {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 4px;\n background: white;\n border-radius: 8px;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n padding: 1rem;\n}\n\n.weekdays {\n display: contents;\n}\n\n.weekdays div {\n text-align: center;\n font-weight: bold;\n padding: 0.5rem;\n color: var(--primary-color);\n}\n\n.days {\n display: contents;\n}\n\n.days div {\n padding: 1rem;\n text-align: center;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.days div:hover {\n background: var(--secondary-color);\n color: white;\n}\n\n.days div.empty {\n background: transparent;\n pointer-events: none;\n}\n\nfooter {\n text-align: center;\n margin-top: 2rem;\n color: #666;\n}\n\n@media (max-width: 600px) {\n .calendar-grid {\n gap: 2px;\n padding: 0.5rem;\n }\n\n .days div {\n padding: 0.5rem;\n }\n}\n---script.js---\nconst monthNames = [\n \"January\", \"February\", \"March\", \"April\", \"May\", \"June\",\n \"July\", \"August\", \"September\", \"October\", \"November\", \"December\"\n];\n\nconst calendarDays = document.getElementById('calendar-days');\nconst currentMonthElement = document.getElementById('current-month');\nconst prevMonthButton = document.getElementById('prev-month');\nconst nextMonthButton = document.getElementById('next-month');\n\nlet currentDate = new Date();\n\nfunction renderCalendar() {\n const year = currentDate.getFullYear();\n const month = currentDate.getMonth();\n \n currentMonthElement.textContent = `${monthNamesonth]} ${year}`;\n \n const firstDay = new Date(year, month, 1);\n const lastDay = new Date(year, month + 1, 0);\n const daysInMonth = lastDay.getDate();\n const startDay = firstDay.getDay();\n \n calendarDays.innerHTML = '';\n \n for (let i = 0; i < startDay; i++) {\n const emptyDay = document.createElement('div');\n emptyDay.classList.add('empty');\n calendarDays.appendChild(emptyDay);\n }\n \n for (let day = 1; day <= daysInMonth; day++) {\n const dayElement = document.createElement('div');\n dayElement.textContent = day;\n calendarDays.appendChild(dayElement);\n }\n}\n\nprevMonthButton.addEventListener('click', () => {\n currentDate.setMonth(currentDate.getMonth() - 1);\n renderCalendar();\n});\n\nnextMonthButton.addEventListener('click', () => {\n currentDate.setMonth(currentDate.getMonth() + 1);\n renderCalendar();\n});\n\nrenderCalendar();\n---end---"
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 238,
+ "completion_tokens": 1236,
+ "total_tokens": 1474,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 238
+ },
+ "system_fingerprint": "fp_f1afce2943"
+ }
readme.scroll
Changed around line 1
+ # calendora.scroll.pub
+ Website generated by DeepSeek from prompt: generate a calendar app
script.js
Changed around line 1
+ const monthNames = [
+ "January", "February", "March", "April", "May", "June",
+ "July", "August", "September", "October", "November", "December"
+ ];
+
+ const calendarDays = document.getElementById('calendar-days');
+ const currentMonthElement = document.getElementById('current-month');
+ const prevMonthButton = document.getElementById('prev-month');
+ const nextMonthButton = document.getElementById('next-month');
+
+ let currentDate = new Date();
+
+ function renderCalendar() {
+ const year = currentDate.getFullYear();
+ const month = currentDate.getMonth();
+
+ currentMonthElement.textContent = `${monthNamesonth]} ${year}`;
+
+ const firstDay = new Date(year, month, 1);
+ const lastDay = new Date(year, month + 1, 0);
+ const daysInMonth = lastDay.getDate();
+ const startDay = firstDay.getDay();
+
+ calendarDays.innerHTML = '';
+
+ for (let i = 0; i < startDay; i++) {
+ const emptyDay = document.createElement('div');
+ emptyDay.classList.add('empty');
+ calendarDays.appendChild(emptyDay);
+ }
+
+ for (let day = 1; day <= daysInMonth; day++) {
+ const dayElement = document.createElement('div');
+ dayElement.textContent = day;
+ calendarDays.appendChild(dayElement);
+ }
+ }
+
+ prevMonthButton.addEventListener('click', () => {
+ currentDate.setMonth(currentDate.getMonth() - 1);
+ renderCalendar();
+ });
+
+ nextMonthButton.addEventListener('click', () => {
+ currentDate.setMonth(currentDate.getMonth() + 1);
+ renderCalendar();
+ });
+
+ renderCalendar();
style.css
Changed around line 1
+ :root {
+ --primary-color: #5c6bc0;
+ --secondary-color: #42a5f5;
+ --background-color: #f5f5f5;
+ --text-color: #333;
+ --border-color: #ddd;
+ }
+
+ * {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ }
+
+ body {
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+ line-height: 1.6;
+ color: var(--text-color);
+ background-color: var(--background-color);
+ padding: 1rem;
+ max-width: 800px;
+ margin: 0 auto;
+ }
+
+ header {
+ text-align: center;
+ margin: 2rem 0;
+ }
+
+ header h1 {
+ color: var(--primary-color);
+ font-size: 2.5rem;
+ }
+
+ .calendar-controls {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin: 2rem 0;
+ }
+
+ .calendar-controls button {
+ background: none;
+ border: none;
+ font-size: 2rem;
+ cursor: pointer;
+ color: var(--primary-color);
+ padding: 0.5rem;
+ }
+
+ .calendar-controls button:hover {
+ color: var(--secondary-color);
+ }
+
+ .calendar-grid {
+ display: grid;
+ grid-template-columns: repeat(7, 1fr);
+ gap: 4px;
+ background: white;
+ border-radius: 8px;
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+ padding: 1rem;
+ }
+
+ .weekdays {
+ display: contents;
+ }
+
+ .weekdays div {
+ text-align: center;
+ font-weight: bold;
+ padding: 0.5rem;
+ color: var(--primary-color);
+ }
+
+ .days {
+ display: contents;
+ }
+
+ .days div {
+ padding: 1rem;
+ text-align: center;
+ border-radius: 4px;
+ cursor: pointer;
+ transition: all 0.2s ease;
+ }
+
+ .days div:hover {
+ background: var(--secondary-color);
+ color: white;
+ }
+
+ .days div.empty {
+ background: transparent;
+ pointer-events: none;
+ }
+
+ footer {
+ text-align: center;
+ margin-top: 2rem;
+ color: #666;
+ }
+
+ @media (max-width: 600px) {
+ .calendar-grid {
+ gap: 2px;
+ padding: 0.5rem;
+ }
+
+ .days div {
+ padding: 0.5rem;
+ }
+ }