{"id":4164,"date":"2024-10-04T16:20:31","date_gmt":"2024-10-04T16:20:31","guid":{"rendered":"http:\/\/localhost\/test1\/?page_id=4164"},"modified":"2026-01-13T09:56:15","modified_gmt":"2026-01-13T08:56:15","slug":"reservation-form-2","status":"publish","type":"page","link":"https:\/\/testx.kafanakodnese.rs\/sr\/reservation-form-2\/","title":{"rendered":"Reservation form"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"4164\" class=\"elementor elementor-4164\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d3a82ae e-flex e-con-boxed e-con e-parent\" data-id=\"d3a82ae\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-f07f9be e-con-full e-flex e-con e-child\" data-id=\"f07f9be\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8d94229 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"8d94229\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInUp&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Rezervi\u0161ite<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8ac7770 elementor-widget elementor-widget-shortcode\" data-id=\"8ac7770\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\t<!-- Uklju\u010divanje Flatpickr CSS i JS -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/flatpickr\/4.6.9\/flatpickr.min.css\">\n    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/flatpickr\/4.6.9\/flatpickr.min.js\"><\/script>\n\n    <style>\n        .reservation-form {\n            max-width: 1000px;\n            margin:  auto;\n            padding: 20px;\n            background-color: #f9f9f9;\n            border-radius: 10px;\n            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);\n        }\n\n        .form-group {\n            margin-bottom: 20px;\n            display: flex;\n            flex-direction: column;\n        }\n\n        .reservation-form label {\n            margin-bottom: 8px;\n            font-weight: bold;\n\t\t\tfont-family: Montserrat;\n        }\n\n        .reservation-form input {\n            padding: 10px;\n            border: 1px solid #ccc;\n            border-radius: 5px;\n            font-size: 16px;\n\t\t\tfont-family: Montserrat;\n        }\n\n        .reservation-form input.wide {\n            width: 100%;\n            max-width: 800px;\n        }\n\n        .reservation-form input.narrow {\n            width: 100%;\n            max-width: 300px;\n        }\n\n        .reservation-form button {\n            width: 100%;\n            padding: 15px;\n            background-color: #E08D1A;\n            color: white;\n            border: none;\n            border-radius: 20px;\n            cursor: pointer;\n            font-size: 16px;\n        }\n\n        .reservation-form button:hover {\n            background-color: #c26a21;\n        }\n\t\t\n\t\t\/* Stil za fade-out poruke *\/\n        #successMessage1, #successMessage2 {\n            opacity: 1;\n            transition: opacity 2s ease-out;\n        }\n\n        \/* Sakrivanje druge poruke u po\u010detku *\/\n        #successMessage2 {\n            opacity: 0;\n            display: none;\n        }\n\t\t\n\t\t\n\t\t\/* Stilovi za toast notifikacije *\/\n        .toast {\n            position: fixed;\n            top: 15%; \/* Centriranje vertikalno *\/\n            left: 50%; \/* Centriranje horizontalno *\/\n            transform: translate(-50%, -50%); \/* Pomakni za pola \u0161irine i visine *\/\n            padding: 15px;\n            border-radius: 5px;\n            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n            opacity: 0;\n            transition: opacity 0.5s ease, transform 0.5s ease;\n            z-index: 9999;\n\t\t\tfont-family: Montserrat;\n        }\n\n        .show {\n            opacity: 1;\n            transform: translate(-50%, -50%);\n        }\n\n        \/* Modalni stil *\/\n        .modal {\n            display: none;\n            position: fixed;\n            z-index: 1000;\n            left: 0;\n            top: 0;\n            width: 100%;\n            height: 100%;\n            background-color: rgba(0, 0, 0, 0.5);\n        }\n\n        .modal-content {\n            background-color: white;\n            margin: 15% auto;\n            padding: 20px;\n            border: 1px solid #888;\n            width: 80%;\n            max-width: 400px;\n            text-align: center;\n            border-radius: 10px;\n        }\n\n        .modal button {\n            padding: 10px 20px;\n            background-color: #0073aa;\n            color: white;\n            border: none;\n            border-radius: 5px;\n            cursor: pointer;\n            font-size: 16px;\n            margin-top: 20px;\n        }\n\n        .modal button:hover {\n            background-color: #005f8d;\n        }\n\n        @media (max-width: 600px) {\n            .reservation-form input,\n            .reservation-form button {\n                font-size: 14px;\n                width: 100%;\n            }\n        }\n    <\/style>\n\t\n\t<script>\n    document.addEventListener('DOMContentLoaded', function() {\n        \/\/ Inicijalizacija Flatpickr za datum\n        flatpickr(\"#reservation_date\", {\n            dateFormat: \"d\/m\/Y\",\n            allowInput: true,\n            altInput: true,\n            altFormat: \"d\/m\/Y\"\n        });\n\t\t\n\t\t\/\/ Fade-out efekt za poruke\n        \/*var successMessage1 = document.getElementById('successMessage1');\n        var successMessage2 = document.getElementById('successMessage2');\n\n        if (successMessage1 && successMessage2) {\n            \/\/ Prva poruka nestaje nakon 3 sekunde\n            setTimeout(function() {\n                successMessage1.style.opacity = '0';\n            }, 3000);\n\n            \/\/ Druga poruka se pojavljuje 1 sekundu kasnije (nakon 4 sekunde)\n            setTimeout(function() {\n                successMessage2.style.display = 'block';\n                successMessage2.style.opacity = '1';\n            }, 4000);\n\n            \/\/ Druga poruka nestaje nakon dodatnih 3 sekunde\n            setTimeout(function() {\n                successMessage2.style.opacity = '0';\n            }, 7000);\n        }*\/\n\t\t\n\t\t\/\/ Prikaz toast notifikacija nakon slanja forme\n        var toast1 = document.getElementById('toast1');\n        var toast2 = document.getElementById('toast2');\n\n        if (toast1 && toast2) {\n            \/\/ Prika\u017ei prvu notifikaciju\n            setTimeout(function() {\n                toast1.classList.add('show');\n            }, 500); \/\/ Nakon 0.5 sekundi\n\n            \/\/ Sakrij prvu i prika\u017ei drugu nakon 3 sekunde\n            setTimeout(function() {\n                toast1.classList.remove('show');\n                toast2.classList.add('show');\n            }, 3500); \/\/ 3 sekunde za prvu, pa prika\u017ei drugu\n\n            \/\/ Sakrij drugu notifikaciju nakon dodatnih 3 sekunde\n            setTimeout(function() {\n                toast2.classList.remove('show');\n            }, 6500); \/\/ 3 sekunde prikaz druge notifikacije\n        }\n\t\t\n\t\t\n    });\n    <\/script>\n\t\n\t\n\n    <form action=\"https:\/\/testx.kafanakodnese.rs\/wp-admin\/admin-post.php\" method=\"post\" class=\"reservation-form\">\n        <input type=\"hidden\" name=\"action\" value=\"submit_reservation\">\n\n        <div class=\"form-group\">\n            <label for=\"name\">Ime i prezime<\/label>\n            <input type=\"text\" id=\"name\" name=\"name\" class=\"wide\" required>\n        <\/div>\n\n        <div class=\"form-group\">\n            <label for=\"email\">Email:<\/label>\n            <input type=\"email\" id=\"email\" name=\"email\" class=\"wide\" required>\n        <\/div>\n\t\t\n\t\t<div class=\"form-group\">\n\t\t\t<label for=\"phone\">Telefon (opciono)<\/label>\n\t\t\t<input type=\"tel\" id=\"phone\" name=\"phone\" class=\"wide\">\n\t\t<\/div>\n\n        <div class=\"form-group\">\n            <label for=\"number_of_persons\">Broj osoba<\/label>\n            <input type=\"number\" id=\"number_of_persons\" name=\"number_of_persons\" class=\"narrow\" required>\n        <\/div>\n\n        <div class=\"form-group\">\n            <label for=\"reservation_date\">Datum<\/label>\n            <input type=\"text\" id=\"reservation_date\" name=\"reservation_date\" placeholder=\"dd\/mm\/yyyy\" class=\"narrow\" required>\n        <\/div>\n\n        \t\t\n\t\t<div class=\"form-group\">\n            <label for=\"reservation_time\">Vreme<\/label>\n            <input type=\"time\" id=\"reservation_time\" name=\"reservation_time\" class=\"narrow\" required>\n        <\/div>\n\t\t\n\t\t<div class=\"form-group\">\n\t\t\t<label for=\"zone\">Zona<\/label>\n\t\t\t<select id=\"zone\" name=\"zone\" class=\"narrow\" required>\n\t\t\t\t<option value=\"non-smoking\">Nepu\u0161a\u010dka \/ Non-Smoking<\/option>\n\t\t\t\t<option value=\"smoking\">Pu\u0161a\u010dka \/ Smoking<\/option>\n\t\t\t<\/select>\n    <\/div>\n\n        <button type=\"submit\">Po\u0161alji zahtev<\/button>\n    <\/form>\n\n    \n    \n\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-39822a3 e-con-full e-flex e-con e-child\" data-id=\"39822a3\" data-element_type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-ab7e591 e-con-full e-flex e-con e-child\" data-id=\"ab7e591\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-750f2e9 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"750f2e9\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">DA LI STE GLADNI?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b1cfc26 elementor-widget elementor-widget-heading\" data-id=\"b1cfc26\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Pridru\u017eite nam se na obroku punom ukusa i emocija-svaki zalogaj pri\u010da pri\u010du,a svaki trenutak je posve\u0107en Vama.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0e44bfa e-con-full e-flex e-con e-child\" data-id=\"0e44bfa\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c063a96 elementor-widget elementor-widget-heading\" data-id=\"c063a96\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Hranu mo\u017eete poru\u010diti nakon \u0161to dobijete potvrdu rezervacije i broj stola.Tom prilikom \u0107ete dobiti i link putem kog \u0107ete izvr\u0161iti rezervaciju Va\u0161eg menija.<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f7eea6c e-con-full e-flex e-con e-child\" data-id=\"f7eea6c\" data-element_type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-7e0276d e-con-full e-flex e-con e-child\" data-id=\"7e0276d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9f27120 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"9f27120\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Na\u0161 e-mail<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-64f71f0 elementor-widget__width-inherit elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"64f71f0\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\"><a href=\"http:\/\/kafanakodnese@gmail.com\">kafanakodnese@gmail.com<\/a><\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-143513d e-con-full elementor-hidden-mobile elementor-hidden-tablet e-flex e-con e-child\" data-id=\"143513d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3c6e129 elementor-hidden-tablet elementor-hidden-mobile elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"3c6e129\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b6c7cb3 e-con-full e-flex e-con e-child\" data-id=\"b6c7cb3\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cc356a8 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"cc356a8\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Telefon<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e3e0a73 elementor-widget__width-initial elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"e3e0a73\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInDown&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\"><a href=\"#\"><a href=\"tel:+381112507674\"> 011 250 7674<\/a>,<br><a href=\"tel:+38163479340\"> 063 479 340<\/a><\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\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>","protected":false},"excerpt":{"rendered":"<p>Make reservation Are You Hungry? Join us for a meal filled with flavors and emotions \u2013 every bite tells a story, and every moment is dedicated to You. You can order food after receiving confirmation of your reservation and your table number. At that time, you will also receive a link to finalize the reservation [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-4164","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/pages\/4164","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/comments?post=4164"}],"version-history":[{"count":151,"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/pages\/4164\/revisions"}],"predecessor-version":[{"id":6012,"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/pages\/4164\/revisions\/6012"}],"wp:attachment":[{"href":"https:\/\/testx.kafanakodnese.rs\/sr\/wp-json\/wp\/v2\/media?parent=4164"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}