ACC SHELL
<?php
$footerBox1 = '';
$footerBox2 = '';
$footerBox3 = '';
$footerBox4 = '';
if ( $settings[ 'contactFormVisible' ] == '1' )
{
$footerBox1 = '';
$footerBox2 = fuckOffOrphans( $settings['footerText1'] );
$footerBox3 = fuckOffOrphans( $settings['footerText2'] );
$footerBox4 = fuckOffOrphans( $settings['footerText3'] );
}
else
{
$footerBox1 = fuckOffOrphans( $settings['footerText1'] );
$footerBox2 = fuckOffOrphans( $settings['footerText2'] );
$footerBox3 = fuckOffOrphans( $settings['footerText3'] );
$footerBox4 = fuckOffOrphans( $settings['footerText4'] );
}
if ( $settings['facebookLikeBoxVisible'] == '1' )
{
$footerBox4 = $settings['facebookLikeBoxCode'];
}
if ( ( $footerBox1 != '' ) || ( $footerBox2 != '' ) || ( $footerBox3 != '' ) || ( $footerBox4 != '' ) )
{
?>
<div class="foot-side-cover">
<div class="foot-column">
<?= $footerBox2 ?>
</div>
<div class="foot-column">
<!-- POPUP COOKIES -->
<div class="popup-alert" id="popup-alert">
<div class="popup-alert-content">
<p style="color: black!important; font-weight: 500!important; font-size: 17px!important; text-align: center!important;">Súhlasíte so spracovaním <a href="http://www.nadaciakrizovatka.sk/spracovanie-osobnych-udajov" style="color: red;">osobných údajov?</a></p>
<br>
<p style="color: black!important; font-weight: 500!important; font-size: 15px!important; text-align: center!important;">Naše stránky využívajú cookies. Niektoré sú nevyhnutné pre správne fungovanie stránky,<br>iné môžeme používať len s vaším súhlasom.</p>
</div>
<button class="btn-close-alert" id="btn-close-alert-zavriet">Zavrieť</button>
<button class="btn-close-alert" id="btn-close-alert">Súhlasím</button>
</div>
<style>
.popup-alert {
display: none;
background-color: rgb(255 255 255 / 94%);
color: red!important;
padding: 20px;
border-radius: 10px;
position: fixed;
bottom: 1%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 9999;
text-align: center;
font-weight: 700!important;
font-size: 19px!important;
box-shadow: -1px 0px 8px rgba(0, 0, 10, 0.2);
}
@media (max-width: 670px) {
.popup-alert {
min-width: 91%!important;
}
}
.popup-alert-content {
margin-bottom: 20px;
}
.btn-close-alert {
background-color: red;
color: white;
border: none;
padding: 10px 20px;
border-radius: 5px;
cursor: pointer;
margin-right: 10px; /* Added margin to separate the buttons */
}
#btn-close-alert {
background-color: #669900;
}
</style>
<script>
var popupAlert = document.getElementById('popup-alert');
// Check if the popup should be displayed (e.g., only once)
if (!localStorage.getItem('popupAlertShown')) {
popupAlert.style.display = 'block';
}
// Add event listener to the close buttons
document.getElementById('btn-close-alert').addEventListener('click', closePopup);
document.getElementById('btn-close-alert-zavriet').addEventListener('click', closePopup);
function closePopup() {
popupAlert.style.display = 'none';
localStorage.setItem('popupAlertShown', 'true'); // Set local storage to prevent further display
}
</script>
<!-- POPUP COOKIES -->
<?php
if ( $settings[ 'contactFormVisible' ] == '1' )
{
?>
<div id="contact-form-foot">
<!--
=======================================================================
This is a working contact form. To receive email,
Replace YOUR_ACCESS_KEY_HERE with your actual Access Key.
Create Access Key here 👉 https://web3forms.com/
=======================================================================
-->
<div class="flex items-center min-h-screen bg-gray-100 dark:bg-gray-900">
<div class="container mx-auto">
<div class="max-w-xl mx-auto my-10 bg-white p-5 rounded-md shadow-sm">
<div class="text-center">
<h1 id="kontaktny-formular-text" class="my-3 text-3xl font-semibold text-gray-700 dark:text-gray-200">
Kontaktný formulár
</h1>
</div>
<div class="m-7">
<form action="https://api.web3forms.com/submit" method="POST" id="form" class="needs-validation" novalidate>
<input type="hidden" name="access_key" value="929004ae-b1fc-49b4-9697-90d64961ea8d" />
<input type="hidden" name="subject" value="New Submission from Web3Forms" />
<input type="checkbox" name="botcheck" id="" style="display: none;" />
<div class="flex mb-6 space-x-4">
<div class="w-full md:w-1/2">
<label for="fname" class="block mb-2 text-sm text-gray-600 dark:text-gray-400">Meno</label>
<input type="text" name="name" id="first_name" placeholder="" required class="w-full px-3 py-2 placeholder-gray-300 border-2 border-gray-200 rounded-md focus:outline-none focus:ring focus:ring-indigo-100 focus:border-indigo-300" />
<div class="empty-feedback invalid-feedback text-red-400 text-sm mt-1">
Zadajte Vaše meno.
</div>
</div>
<div class="w-full md:w-1/2">
<label for="lname" class="block mb-2 text-sm text-gray-600 dark:text-gray-400">Priezvisko</label>
<input type="text" name="last_name" id="lname" placeholder="" required class="w-full px-3 py-2 placeholder-gray-300 border-2 border-gray-200 rounded-md focus:outline-none focus:ring focus:ring-indigo-100 focus:border-indigo-300" />
<div class="empty-feedback invalid-feedback text-red-400 text-sm mt-1">
Zadajte Vaše priezvisko.
</div>
</div>
</div>
<div class="flex mb-6 space-x-4">
<div class="w-full md:w-1/2">
<label for="email" class="block mb-2 text-sm text-gray-600 dark:text-gray-400">Email</label>
<input type="email" name="email" id="email" placeholder="@" required class="w-full px-3 py-2 placeholder-gray-300 border-2 border-gray-200 rounded-md focus:outline-none focus:ring focus:ring-indigo-100 focus:border-indigo-300" />
<div class="empty-feedback text-red-400 text-sm mt-1">
Zadajte Váš email.
</div>
<div class="invalid-feedback text-red-400 text-sm mt-1">
Zadajte správny formát adresy.
</div>
</div>
<div class="w-full md:w-1/2">
<label for="phone" class="block text-sm mb-2 text-gray-600 dark:text-gray-400">Tel. číslo</label>
<input type="text" name="phone" id="phone" placeholder="+421" required class="w-full px-3 py-2 placeholder-gray-300 border-2 border-gray-200 rounded-md focus:outline-none focus:ring focus:ring-indigo-100 focus:border-indigo-300" />
<div class="empty-feedback invalid-feedback text-red-400 text-sm mt-1">
Zadajte tel. číslo.
</div>
</div>
</div>
<div class="mb-6">
<label for="message" class="block mb-2 text-sm text-gray-600 dark:text-gray-400">Vaša správa</label>
<textarea rows="5" name="message" id="message" placeholder="Obsah Vašej správy" class="w-full px-3 py-2 placeholder-gray-300 border-2 border-gray-200 rounded-md focus:outline-none focus:ring focus:ring-indigo-100 focus:border-indigo-300" required></textarea>
<div class="empty-feedback invalid-feedback text-red-400 text-sm mt-1">
Zadajte Vašu správu.
</div>
</div>
<div class="mb-6">
<button type="submit" class="w-full px-3 py-4 text-white bg-indigo-500 rounded-md focus:bg-indigo-600 focus:outline-none odoslat-button">
Odoslať
</button>
</div>
<p class="text-base text-center text-gray-400" id="result"></p>
</form>
</div>
</div>
</div>
</div>
<style>
#kontaktny-formular-text {
font-size: 18px;
color: #333 !important;
font-family: "Roboto Slab", serif;
font-weight: 500 !important;
text-align: left;
line-height: 1.2em !important;
padding-bottom: 4%;
text-align: center;
}
.odoslat-button {
margin-left: auto;
margin-right: auto;
}
.w-full {
display: flex;
flex-direction: column;
margin-bottom: 1px;
}
#message {
display: flex;
flex-direction: column;
margin-bottom: 15px;
width: -webkit-fill-available;
}
#form {
margin-top: 20px;
font-family: roboto-slab!important;
}
.invalid-feedback,
.empty-feedback {
display: none;
}
.was-validated :placeholder-shown:invalid ~ .empty-feedback {
display: block;
}
.was-validated :not(:placeholder-shown):invalid ~ .invalid-feedback {
display: block;
}
.is-invalid,
.was-validated :invalid {
border-color: #dc3545;
}
#form input {
border-color: #45454500!important;
}
#form #message {
border-color: #45454500!important;
}
</style>
<script>
(function () {
"use strict";
/*
* Form Validation
*/
// Fetch all the forms we want to apply custom validation styles to
const forms = document.querySelectorAll(".needs-validation");
const result = document.getElementById("result");
// Loop over them and prevent submission
Array.prototype.slice.call(forms).forEach(function (form) {
form.addEventListener(
"submit",
function (event) {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
form.querySelectorAll(":invalid")[0].focus();
} else {
/*
* Form Submission using fetch()
*/
const formData = new FormData(form);
event.preventDefault();
event.stopPropagation();
const object = {};
formData.forEach((value, key) => {
object[key] = value;
});
const json = JSON.stringify(object);
result.innerHTML = "Please wait...";
fetch("https://api.web3forms.com/submit", {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: "application/json"
},
body: json
})
.then(async (response) => {
let json = await response.json();
if (response.status == 200) {
result.innerHTML = json.message;
result.classList.remove("text-gray-500");
result.classList.add("text-green-500");
} else {
console.log(response);
result.innerHTML = json.message;
result.classList.remove("text-gray-500");
result.classList.add("text-red-500");
}
})
.catch((error) => {
console.log(error);
result.innerHTML = "Something went wrong!";
})
.then(function () {
form.reset();
form.classList.remove("was-validated");
setTimeout(() => {
result.style.display = "none";
}, 5000);
});
}
form.classList.add("was-validated");
},
false
);
});
})();
</script>
</div>
<?php
}
?>
<?= $footerBox1 ?>
</div>
<div class="foot-column">
<?= $footerBox3 ?>
</div>
<div class="cleaner30"></div>
</div>
<div class="cleaner"></div>
<?php
}
?>
<div class="last-line">
<p><?= stripcslashes( $footerHTML) ?></p>
<a href="http://www.tridvajedna.cz" title="Stránky vytvoril: 321 Creative People" target="_blank" class="logo321"><img src="/img/321-CREATIVE-PEOPLE-black.png" alt="321 creative people" /></a>
</div>
ACC SHELL 2018