{"id":336,"date":"2025-12-08T03:35:37","date_gmt":"2025-12-08T03:35:37","guid":{"rendered":"https:\/\/auliawo.art\/?page_id=336"},"modified":"2025-12-08T03:42:40","modified_gmt":"2025-12-08T03:42:40","slug":"test","status":"publish","type":"page","link":"https:\/\/auliawo.art\/?page_id=336","title":{"rendered":"Kalender"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n\r\nWedding Calendar Booking - Januari 2025<\/title>\r\n\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@600&family=Poppins:wght@300;400;500&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n*{margin:0;padding:0;box-sizing:border-box}\r\n\r\nbody{\r\n font-family:'Poppins',sans-serif;\r\n background:linear-gradient(180deg,#faf5fb,#fff);\r\n color:#4b204b;\r\n}\r\n\r\n.wrap{\r\n max-width:900px;\r\n margin:50px auto;\r\n padding:20px;\r\n}\r\n\r\nh1{\r\n text-align:center;\r\n font-family:'Playfair Display',serif;\r\n font-size:44px;\r\n}\r\n\r\n.sub{\r\n text-align:center;\r\n margin-bottom:30px;\r\n color:#7a5a7a;\r\n font-size:18px;\r\n}\r\n\r\n\/* Calendar *\/\r\n.calendar-box{\r\n background:#fff;\r\n padding:30px;\r\n border-radius:20px;\r\n border:1px solid #ecd9f3;\r\n}\r\n\r\n.calendar{\r\n display:grid;\r\n grid-template-columns:repeat(7,1fr);\r\n gap:10px;\r\n margin-top:20px;\r\n}\r\n\r\n.day,.date{\r\n padding:12px;\r\n border-radius:12px;\r\n text-align:center;\r\n font-size:14px;\r\n}\r\n\r\n.day{\r\n font-weight:600;\r\n color:#a66db1;\r\n}\r\n\r\n.date{\r\n background:#faf5fb;\r\n cursor:pointer;\r\n transition:.2s;\r\n}\r\n\r\n.date:hover{\r\n background:#eadcf4;\r\n}\r\n\r\n.selected{\r\n background:#4b204b !important;\r\n color:white;\r\n}\r\n\r\n.booked{\r\n background:#e6cde0 !important;\r\n color:#6d2f6d;\r\n cursor:not-allowed;\r\n}\r\n\r\n\/* Form *\/\r\n.form-box{\r\n text-align:center;\r\n margin-top:20px;\r\n}\r\n\r\ninput{\r\n padding:12px;\r\n width:240px;\r\n border-radius:8px;\r\n border:1px solid #ccc;\r\n}\r\n\r\nbutton{\r\n padding:12px 25px;\r\n background:#4b204b;\r\n color:white;\r\n border:none;\r\n border-radius:10px;\r\n cursor:pointer;\r\n}\r\n\r\n\/* List *\/\r\n.booking-list{\r\n margin-top:30px;\r\n}\r\n\r\n.booking-item{\r\n background:#fff;\r\n padding:10px 15px;\r\n border-radius:12px;\r\n border:1px solid #eee;\r\n margin-bottom:8px;\r\n}\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n<div class=\"wrap\">\r\n <h1>Wedding Booking Calendar<\/h1>\r\n <p class=\"sub\">Bulan Januari 2025 \u2014 Klik tanggal lalu masukkan nama pasangan<\/p>\r\n\r\n <div class=\"calendar-box\">\r\n <div class=\"calendar\" id=\"calendar\">\r\n\r\n <div class=\"day\">Min<\/div><div class=\"day\">Sen<\/div><div class=\"day\">Sel<\/div>\r\n <div class=\"day\">Rab<\/div><div class=\"day\">Kam<\/div><div class=\"day\">Jum<\/div><div class=\"day\">Sab<\/div>\r\n\r\n <div class=\"date\" onclick=\"selectDate(this)\">1<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">2<\/div>\r\n <div class=\"date booked\">3<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">4<\/div>\r\n <div class=\"date booked\">5<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">6<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">7<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">8<\/div>\r\n <div class=\"date booked\">9<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">10<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">11<\/div>\r\n <div class=\"date booked\">12<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">13<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">14<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">15<\/div>\r\n <div class=\"date booked\">16<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">17<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">18<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">19<\/div>\r\n <div class=\"date booked\">20<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">21<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">22<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">23<\/div>\r\n <div class=\"date booked\">24<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">25<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">26<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">27<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">28<\/div>\r\n <div class=\"date booked\">29<\/div>\r\n <div class=\"date\" onclick=\"selectDate(this)\">30<\/div>\r\n\r\n <\/div>\r\n\r\n <div class=\"form-box\">\r\n <p id=\"selectedText\">Belum pilih tanggal<\/p><br>\r\n <input type=\"text\" id=\"nameInput\" placeholder=\"Nama pasangan\"><br><br>\r\n <button onclick=\"addBooking()\">Tambah Booking<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"booking-list\" id=\"bookingList\">\r\n <div class=\"booking-item\">3 Januari 2025 \u2014 Andri & Putri<\/div>\r\n <div class=\"booking-item\">5 Januari 2025 \u2014 Bima & Salsabila<\/div>\r\n <div class=\"booking-item\">9 Januari 2025 \u2014 Rizky & Amel<\/div>\r\n <div class=\"booking-item\">12 Januari 2025 \u2014 Danu & Raisa<\/div>\r\n <div class=\"booking-item\">16 Januari 2025 \u2014 Fajar & Lestari<\/div>\r\n <div class=\"booking-item\">20 Januari 2025 \u2014 Iqbal & Shafa<\/div>\r\n <div class=\"booking-item\">24 Januari 2025 \u2014 Rama & Citra<\/div>\r\n <div class=\"booking-item\">29 Januari 2025 \u2014 Ardi & Nabila<\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\nlet selectedDate = null;\r\n\r\nfunction selectDate(el){\r\n if(el.classList.contains(\"booked\")) return;\r\n\r\n document.querySelectorAll(\".date\").forEach(d=>d.classList.remove(\"selected\"));\r\n el.classList.add(\"selected\");\r\n\r\n selectedDate = el.innerText;\r\n document.getElementById(\"selectedText\").innerText = \"Tanggal dipilih: \" + selectedDate + \" Januari 2025\";\r\n}\r\n\r\nfunction addBooking(){\r\n const name = document.getElementById(\"nameInput\").value;\r\n if(!selectedDate || name===\"\"){\r\n alert(\"Pilih tanggal dan isi nama!\");\r\n return;\r\n }\r\n\r\n document.querySelectorAll(\".date\").forEach(d=>{\r\n if(d.innerText === selectedDate){\r\n d.classList.add(\"booked\");\r\n d.classList.remove(\"selected\");\r\n d.onclick = null;\r\n }\r\n });\r\n\r\n const list = document.getElementById(\"bookingList\");\r\n const div = document.createElement(\"div\");\r\n div.className = \"booking-item\";\r\n div.innerText = selectedDate + \" Januari 2025 \u2014 \" + name;\r\n list.appendChild(div);\r\n\r\n document.getElementById(\"nameInput\").value = \"\";\r\n document.getElementById(\"selectedText\").innerText = \"Belum pilih tanggal\";\r\n selectedDate = null;\r\n}\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Wedding Calendar Booking – Januari 2025 Wedding Booking Calendar Bulan Januari 2025 \u2014 Klik tanggal lalu masukkan nama pasangan MinSenSel RabKamJumSab 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 Belum pilih tanggal Tambah […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_glsr_average":0,"_glsr_ranking":0,"_glsr_reviews":0,"footnotes":""},"class_list":["post-336","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/pages\/336","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/auliawo.art\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=336"}],"version-history":[{"count":7,"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/pages\/336\/revisions"}],"predecessor-version":[{"id":375,"href":"https:\/\/auliawo.art\/index.php?rest_route=\/wp\/v2\/pages\/336\/revisions\/375"}],"wp:attachment":[{"href":"https:\/\/auliawo.art\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=336"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}