{"id":97,"date":"2026-03-06T16:46:15","date_gmt":"2026-03-06T16:46:15","guid":{"rendered":"https:\/\/dabudi.si\/?page_id=97"},"modified":"2026-03-22T10:49:46","modified_gmt":"2026-03-22T10:49:46","slug":"97-2","status":"publish","type":"page","link":"https:\/\/dabudi.si\/index.php\/97-2\/","title":{"rendered":"koledar"},"content":{"rendered":"\n<!DOCTYPE html>\n\n<html lang=\"sl\">\n<head>\n<meta charset=\"UTF-8\">\n<title>Mese\u010dni Koledar &#8211; Son\u010dni Zahod<\/title>\n<style>\n* { box-sizing: border-box; margin:0; padding:0; }\nhtml, body { height: 100%; }\n\nbody {\nfont-family: Arial, sans-serif;\nposition: relative;\nmin-height: 100%;\ndisplay: flex;\nflex-direction: column;\n}\n\n\/* Ozadje *\/\nbody::before {\ncontent: \"\";\nposition: fixed;\ntop:0; left:0;\nwidth: 100%;\nheight: 100%;\nbackground: url('https:\/\/images.unsplash.com\/photo-1501973801540-537f08ccae7f?auto=format&fit=crop&w=1350&q=80') no-repeat center center;\nbackground-size: cover;\nz-index: -1;\nfilter: brightness(0.85);\n}\n\nheader {\nbackground: rgba(33,150,243,0.8);\ncolor: white;\npadding: 10px 20px;\ndisplay: flex;\njustify-content: space-between;\nalign-items: center;\n}\n\nheader h1 { font-size: 24px; }\n\nbutton {\npadding: 6px 12px;\nborder: none;\nborder-radius: 4px;\nbackground: #1976d2;\ncolor: white;\ncursor: pointer;\n}\nbutton:hover { background: #115293; }\n\n\/* GLAVA DNI *\/\n#calendarHeader {\ndisplay: grid;\ngrid-template-columns: repeat(7, 1fr);\ntext-align: center;\nfont-weight: bold;\ncolor: white;\nbackground: rgba(0,0,0,0.3);\n}\n\n#calendarHeader div {\npadding: 10px 0;\nborder-right: 1px solid rgba(255,255,255,0.2);\n}\n#calendarHeader div:last-child {\nborder-right: none;\n}\n\n\/* KOLEDAR *\/\n#calendar {\nflex:1;\ndisplay: grid;\ngrid-template-columns: repeat(7, 1fr);\ngrid-auto-rows: 120px;\npadding: 5px;\n}\n\n.day {\nbackground: rgba(64, 224, 208, 0.7);\nmargin: 1px;\npadding: 5px;\ndisplay: flex;\nflex-direction: column;\nborder-radius: 5px;\n}\n\n.day-header { font-weight: bold; margin-bottom: 5px; }\n\n.day-other-month {\nbackground: rgba(64, 224, 208, 0.4);\ncolor: #fff;\n}\n\n.tasks { flex:1; overflow-y:auto; }\n\n.task {\nbackground: rgba(255,255,255,0.8);\nmargin: 2px 0;\npadding: 2px 4px;\nborder-radius: 4px;\nfont-size: 12px;\ncursor: pointer;\n}\n\n\/* MODAL *\/\n.modalOverlay {\ndisplay: none;\nposition: fixed;\ntop:0; left:0;\nwidth: 100%; height: 100%;\nbackground: rgba(0,0,0,0.3);\njustify-content:center;\nalign-items:center;\nz-index: 10;\n}\n\n.modalBox {\nbackground: white;\npadding:20px;\nborder-radius:5px;\nwidth:300px;\ntext-align:center;\n}\n\n.modalBox input {\nwidth:90%;\npadding:5px;\nmargin-bottom:10px;\n}\n\n.modalBox button { margin:5px; } <\/style>\n\n<\/head>\n<body>\n\n<header>\n  <button id=\"prevMonth\">&lt;<\/button>\n  <h1 id=\"monthYear\"><\/h1>\n  <button id=\"nextMonth\">&gt;<\/button>\n<\/header>\n\n<!-- DNEVI -->\n\n<div id=\"calendarHeader\">\n  <div>PON<\/div>\n  <div>TOR<\/div>\n  <div>SRE<\/div>\n  <div>\u010cET<\/div>\n  <div>PET<\/div>\n  <div>SOB<\/div>\n  <div>NED<\/div>\n<\/div>\n\n<div id=\"calendar\"><\/div>\n\n<!-- MODAL -->\n\n<div class=\"modalOverlay\" id=\"modalOverlay\">\n  <div class=\"modalBox\">\n    <h3>Dodaj nalogo<\/h3>\n    <input type=\"text\" id=\"taskInput\" placeholder=\"Vpi\u0161i nalogo\">\n    <br>\n    <button id=\"saveTask\">Shrani<\/button>\n    <button id=\"cancelTask\">Prekli\u010di<\/button>\n  <\/div>\n<\/div>\n\n<script>\nlet currentDate = new Date();\nlet selectedDay = null;\n\nfunction renderCalendar(date){\n  const calendar = document.getElementById(\"calendar\");\n  calendar.innerHTML=\"\";\n\n  const year = date.getFullYear();\n  const month = date.getMonth();\n\n  const monthNames = [\"Januar\",\"Februar\",\"Marec\",\"April\",\"Maj\",\"Junij\",\"Julij\",\"Avgust\",\"September\",\"Oktober\",\"November\",\"December\"];\n  document.getElementById(\"monthYear\").textContent = monthNames[month]+\" \"+year;\n\n  \/\/ EUROPSKI ZA\u010cETEK TEDNA\n  let firstDayOfMonth = new Date(year, month, 1).getDay();\n  firstDayOfMonth = firstDayOfMonth === 0 ? 6 : firstDayOfMonth - 1;\n\n  const lastDate = new Date(year, month+1, 0).getDate();\n  const prevLastDate = new Date(year, month, 0).getDate();\n\n  for(let i=0;i<42;i++){\n    const cell = document.createElement(\"div\");\n    cell.className=\"day\";\n\n    let dayNumber;\n\n    if(i < firstDayOfMonth){\n      dayNumber = prevLastDate - firstDayOfMonth + i + 1;\n      cell.classList.add(\"day-other-month\");\n      cell.dataset.date = formatDate(new Date(year, month-1, dayNumber));\n\n    } else if(i >= firstDayOfMonth + lastDate){\n      dayNumber = i - firstDayOfMonth - lastDate + 1;\n      cell.classList.add(\"day-other-month\");\n      cell.dataset.date = formatDate(new Date(year, month+1, dayNumber));\n\n    } else {\n      dayNumber = i - firstDayOfMonth + 1;\n      cell.dataset.date = formatDate(new Date(year, month, dayNumber));\n    }\n\n    const header = document.createElement(\"div\");\n    header.className=\"day-header\";\n    header.textContent = dayNumber;\n\n    const tasksDiv = document.createElement(\"div\");\n    tasksDiv.className=\"tasks\";\n\n    cell.appendChild(header);\n    cell.appendChild(tasksDiv);\n\n    cell.onclick = () => openModal(cell.dataset.date);\n\n    calendar.appendChild(cell);\n  }\n\n  loadTasks();\n}\n\nfunction formatDate(d){\n  return `${d.getFullYear()}-${d.getMonth()+1}-${d.getDate()}`;\n}\n\nfunction openModal(date){\n  selectedDay = date;\n  document.getElementById(\"modalOverlay\").style.display=\"flex\";\n  document.getElementById(\"taskInput\").value=\"\";\n  document.getElementById(\"taskInput\").focus();\n}\n\ndocument.getElementById(\"cancelTask\").onclick = () => {\n  document.getElementById(\"modalOverlay\").style.display=\"none\";\n};\n\ndocument.getElementById(\"saveTask\").onclick = () => {\n  const text = document.getElementById(\"taskInput\").value;\n  if(!text) return;\n  addTask(selectedDay, text);\n  document.getElementById(\"modalOverlay\").style.display=\"none\";\n};\n\nfunction saveTasks(){\n  const tasks = {};\n  document.querySelectorAll(\".day\").forEach(day=>{\n    const date = day.dataset.date;\n    if(date){\n      const taskTexts=[];\n      day.querySelectorAll(\".task\").forEach(t=>taskTexts.push(t.textContent));\n      if(taskTexts.length) tasks[date]=taskTexts;\n    }\n  });\n  localStorage.setItem(\"calendarTasks\", JSON.stringify(tasks));\n}\n\nfunction loadTasks(){\n  const tasks = JSON.parse(localStorage.getItem(\"calendarTasks\") || \"{}\");\n\n  document.querySelectorAll(\".day\").forEach(day=>{\n    const date = day.dataset.date;\n\n    if(date && tasks[date]){\n      const tasksDiv = day.querySelector(\".tasks\");\n      tasksDiv.innerHTML=\"\";\n\n      tasks[date].forEach(t=>{\n        const div = document.createElement(\"div\");\n        div.className=\"task\";\n        div.textContent=t;\n\n        div.onclick = e=>{\n          e.stopPropagation();\n          if(confirm(\"Ali \u017eeli\u0161 odstraniti to nalogo?\")){\n            div.remove();\n            saveTasks();\n          }\n        };\n\n        tasksDiv.appendChild(div);\n      });\n    }\n  });\n}\n\nfunction addTask(date, text){\n  const dayCell = document.querySelector(`.day[data-date='${date}']`);\n  const tasksDiv = dayCell.querySelector(\".tasks\");\n\n  const div = document.createElement(\"div\");\n  div.className=\"task\";\n  div.textContent=text;\n\n  div.onclick = e=>{\n    e.stopPropagation();\n    if(confirm(\"Ali \u017eeli\u0161 odstraniti to nalogo?\")){\n      div.remove();\n      saveTasks();\n    }\n  };\n\n  tasksDiv.appendChild(div);\n  saveTasks();\n}\n\ndocument.getElementById(\"prevMonth\").onclick = () => {\n  currentDate.setMonth(currentDate.getMonth() - 1);\n  renderCalendar(currentDate);\n};\n\ndocument.getElementById(\"nextMonth\").onclick = () => {\n  currentDate.setMonth(currentDate.getMonth() + 1);\n  renderCalendar(currentDate);\n};\n\nrenderCalendar(currentDate);\n<\/script>\n\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Mese\u010dni Koledar &#8211; Son\u010dni Zahod &lt; &gt; PON TOR SRE \u010cET PET SOB NED Dodaj nalogo Shrani Prekli\u010di<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-97","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/pages\/97","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/comments?post=97"}],"version-history":[{"count":10,"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/pages\/97\/revisions"}],"predecessor-version":[{"id":201,"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/pages\/97\/revisions\/201"}],"wp:attachment":[{"href":"https:\/\/dabudi.si\/index.php\/wp-json\/wp\/v2\/media?parent=97"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}