Project-Pro/it.vidok.com
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Jacek Pyziak
2024-11-17 19:56:17 +01:00
commit 81b1185f8e
6599 changed files with 832395 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
templates/widgets/widget-phone.css Normal file
View File

@@ -0,0 +1,187 @@
#widget-phone-icon {
background: #fb6c37;
height: 60px;
width: 60px;
text-align: center;
color: #FFF;
line-height: 60px;
border-radius: 50%;
font-size: 34px;
position: fixed;
bottom: 50px;
right: 50px;
display: none;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px 0px;
}
#widget-phone-icon i {
position: relative;
top: 2px;
}
#widget-phone-bg {
background: rgba( 0, 0, 0, .5 );
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1000;
display: none;
}
#widget-phone-box {
width: 600px;
height: 350px;
position: fixed;
top: 50%;
left: 50%;
transform: translate( -50%, -50% );
background: #FFF;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px 0px;
z-index: 1100;
}
#widget-phone-box #widget-phone-alert {
padding: 25px;
max-width: 400px;
margin: 50px auto;
display: none;
font-size: 30px;
text-align: center;
}
#widget-phone-box #widget-phone-alert.good {
color: #2cbd2b;
}
#widget-phone-box #widget-phone-alert.bad {
color: #cc0000;
}
#widget-phone-box #widget-phone-close {
position: absolute;
right: 10px;
top: 10px;
background: #e2e2e2;
color: #0d619c;
height: 30px;
width: 30px;
text-align: center;
border-radius: 50%;
line-height: 30px;
}
#widget-phone-box #widget-phone-close:hover {
color: #fb6c37;
}
#widget-phone-box #widget-phone-tabs ul {
list-style-type: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0;
padding: 0;
background: #f8f8f8;
border-bottom: 1px solid #e2e2e2;
}
#widget-phone-box #widget-phone-tabs ul li {
display: block;
width: calc(100%/3);
background: #f8f8f8;
color: #000;
padding: 15px;
text-align: center;
font-size: 13px;
border-right: 1px solid #e2e2e2;
cursor: pointer;
}
#widget-phone-box #widget-phone-tabs ul li.active {
background: #FFF;
color: #0d619c;
}
#widget-phone-box #widget-phone-tabs ul li i {
font-size: 20px;
margin-right: 5px;
position: relative;
top: 2px;
}
#widget-phone-box #widget-phone-box-content {
padding: 25px;
}
#widget-phone-box #widget-phone-box-content .tab {
display: none;
}
#widget-phone-box #widget-phone-box-content .tab.active {
display: block;
}
#widget-phone-box #widget-phone-box-content p {
text-align: center;
font-size: 24px;
font-family: 'Lato';
font-weight: 600;
max-width: 400px;
margin: auto;
}
#widget-phone-box #widget-phone-box-content .form-group {
max-width: 300px;
margin: auto;
position: relative;
margin-top: 30px;
}
#widget-phone-box #widget-phone-box-content .form-group i {
position: absolute;
display: block;
height: 40px;
line-height: 40px;
color: #FFF;
width: 40px;
text-align: center;
background: #0d619c;
font-size: 20px;
border-radius: 5px 0 0 5px;
}
#widget-phone-box #widget-phone-box-content .form-group input[type="text"] {
border: 0;
border-radius: 0;
height: 40px;
line-height: 40px;
padding-left: 50px;
box-shadow: none;
border: 1px solid #e2e2e2;
border-radius: 5px;
}
#widget-phone-box #widget-phone-box-content .form-group input[type="text"].error {
background: #fbd4d4;
border: 1px solid #cc0000;
}
#widget-phone-box #widget-phone-box-content .form-group button {
display: block;
width: 100%;
border-radius: 5px;
height: 50px;
border: 0;
background: #0d619c;
color: #fff;
text-shadow: none;
transition: all 0.5s ease;
font-weight: 600;
font-size: 18px;
font-family: 'Lato';
}
#widget-phone-box #widget-phone-box-content .form-group button:hover {
background: #fb6c37;
}
@media ( max-width: 767px ) {
#widget-phone-box {
width: 100%;
height: 100%;
top: 0;
left: 0;
transform: none;
}
#widget-phone-box #widget-phone-tabs ul li {
width: 100%;
border-right: 0;
}
#widget-phone-icon {
width: 50px;
height: 50px;
line-height: 50px;
font-size: 26px;
right: 10px;
bottom: 100px;
}
}

123
templates/widgets/widget-phone.php Normal file
View File

@@ -0,0 +1,123 @@
<link rel="stylesheet" type="text/css" href="/templates/widgets/widget-phone.css">
<script src="/libraries/jquery-ui/1.11.3/jquery-ui.min.js"></script>
<a href="#" id="widget-phone-icon">
<i class="fa fa-phone"></i>
</a>
<div id="widget-phone-bg">
<div id="widget-phone-box">
<a href="#" id="widget-phone-close">
<i class="fa fa-times"></i>
</a>
<div id="widget-phone-tabs">
<ul>
<li class="active" tab="widget-phone-now">
<i class="fa fa-phone"></i> Zadzwoń do mnie teraz
</li>
<!-- <li tab="widget-phone-later">
<i class="fa fa-clock-o"></i> Zadzwoń do mnie później
</li>
<li tab="widget-phone-message">
<i class="fa fa-comments-o"></i> Zostaw wiadomość
</li>-->
</ul>
</div>
<div id="widget-phone-box-content">
<div id="widget-phone-now" class="tab active">
<div id="widget-phone-alert">Dziękujemy za kontakt. Wkrótce oddzwonimy.</div>
<p>Podaj swój numer telefonu a oddzwonimy do Ciebie</p>
<div class="form-group">
<i class="fa fa-phone"></i>
<input type="text" class="form-control" name="widget-phone-input" id="widget-phone-input">
</div>
<div class="form-group">
<button type="button" class="btn btn-success">Zadzwoń do mnie teraz</button>
</div>
</div>
<div id="widget-phone-later" class="tab">
b
</div>
<div id="widget-phone-message" class="tab">
c
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready( function()
{
setTimeout(function() {
$( '#widget-phone-icon' ).show( 'fade' );
}, 2000 );
$( 'body' ).on( 'click', '#widget-phone-icon', function()
{
$( this ).hide( 'fade' );
$( '#widget-phone-bg' ).show( 'fade' );
});
$( 'body' ).on( 'click', '#widget-phone-close', function()
{
$( '#widget-phone-bg' ).hide( 'fade' );
$( '#widget-phone-box-content .tab.active *' ).show();
$( '#widget-phone-box-content .tab.active #widget-phone-alert' ).hide();
$( '#widget-phone-icon' ).show( 'fade' );
});
$( 'body' ).on( 'click', '#widget-phone-tabs li', function()
{
var tab = $( this ).attr( 'tab' );
$( '#widget-phone-box-content .tab' ).removeClass( 'active' );
$( '#widget-phone-box-content #' + tab ).addClass( 'active' );
});
$( 'body' ).on( 'click', '#widget-phone-now button', function()
{
var phone = $( '#widget-phone-now #widget-phone-input' ).val();
if ( $.trim( phone ) == '' )
{
$( '#widget-phone-box' ).effect( "bounce", { direction: 'left', distance: 25, times: 2 }, 500 );
$( '#widget-phone-now #widget-phone-input' ).addClass( 'error' ).focus();
return false;
}
else
{
$.ajax(
{
type: 'POST',
cache: false,
url: 'ajax.php',
data:
{
a: 'widget-phone-now',
phone: phone
},
beforeSend: function()
{
$( '#widget-phone-now #widget-phone-input' ).removeClass( 'error' );
$( '#widget-phone-now button' ).attr( 'disabled', 'disabled' );
$( '#widget-phone-now button' ).html( 'Trwa wysyłanie...' );
},
success: function( data )
{
$( '#widget-phone-now button' ).removeAttr( 'disabled' );
response = jQuery.parseJSON( data );
$( '.jqibox' ).remove();
if ( response.status === 'ok' )
{
$( '#widget-phone-now *' ).hide();
$( '#widget-phone-now #widget-phone-alert' ).show().addClass( 'good' ).html( 'Dziękujemy za kontakt. Wkrótce oddzwonimy.' );
}
else
{
$( '#widget-phone-now *' ).hide();
$( '#widget-phone-now #widget-phone-alert' ).show().addClass( 'bad' ).html( 'Wystąpił błąd.<br />Spróbuj ponownie.' );
}
}
});
}
});
});
</script>