Save
This commit is contained in:
Roman Pyrih
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -9,8 +9,7 @@ $cGray: #f6f6f6;
|
||||
$cGrayLight: #eceff1;
|
||||
$cComment: #c3c3c3;
|
||||
$form_gray: #e7e7e7;
|
||||
$font_nunito: 'Nunito',
|
||||
sans-serif;
|
||||
$font_nunito: 'Nunito', sans-serif;
|
||||
|
||||
@import '_mixins';
|
||||
|
||||
@@ -124,7 +123,7 @@ input:-webkit-autofill:active {
|
||||
|
||||
.btn-success:not(:disabled):not(.disabled):active,
|
||||
.btn-success:not(:disabled):not(.disabled).active,
|
||||
.show>.btn-success.dropdown-toggle {
|
||||
.show > .btn-success.dropdown-toggle {
|
||||
background: $cRed;
|
||||
border: none;
|
||||
}
|
||||
@@ -137,7 +136,7 @@ input:-webkit-autofill:active {
|
||||
|
||||
.btn-success:not(:disabled):not(.disabled):active:focus,
|
||||
.btn-success:not(:disabled):not(.disabled).active:focus,
|
||||
.show>.btn-success.dropdown-toggle:focus {
|
||||
.show > .btn-success.dropdown-toggle:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -609,18 +608,18 @@ input:-webkit-autofill:active {
|
||||
margin-left: -15px;
|
||||
gap: 20px;
|
||||
|
||||
>li {
|
||||
> li {
|
||||
@include respond-between(sm, md) {
|
||||
&#link-5 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
>i {
|
||||
> i {
|
||||
display: none;
|
||||
}
|
||||
|
||||
>a {
|
||||
> a {
|
||||
font-family: $font_nunito;
|
||||
color: $cText;
|
||||
font-size: 18px;
|
||||
@@ -645,14 +644,14 @@ input:-webkit-autofill:active {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
>ul {
|
||||
> ul {
|
||||
display: flex;
|
||||
animation: fade_in_show 0.5s;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
>ul {
|
||||
> ul {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: none;
|
||||
@@ -661,7 +660,7 @@ input:-webkit-autofill:active {
|
||||
background: #fff;
|
||||
@include transition;
|
||||
|
||||
>li {
|
||||
> li {
|
||||
width: calc(100% / 4);
|
||||
margin-bottom: 25px;
|
||||
|
||||
@@ -685,7 +684,7 @@ input:-webkit-autofill:active {
|
||||
}
|
||||
}
|
||||
|
||||
>a {
|
||||
> a {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
white-space: nowrap;
|
||||
@@ -726,7 +725,6 @@ input:-webkit-autofill:active {
|
||||
|
||||
@include respond-above(xxl) {
|
||||
.product-mini {
|
||||
|
||||
&:nth-child(11),
|
||||
&:nth-child(12) {
|
||||
display: none;
|
||||
@@ -1399,10 +1397,10 @@ input:-webkit-autofill:active {
|
||||
&.level-0 {
|
||||
padding: 0 0 15px 0;
|
||||
|
||||
>li {
|
||||
> li {
|
||||
padding-bottom: 10px;
|
||||
|
||||
>a {
|
||||
> a {
|
||||
font-family: $font_nunito;
|
||||
font-weight: 600;
|
||||
color: $cText;
|
||||
@@ -2131,12 +2129,12 @@ ul.pager {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.grow-wrap>textarea {
|
||||
.grow-wrap > textarea {
|
||||
resize: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.grow-wrap>textarea,
|
||||
.grow-wrap > textarea,
|
||||
.grow-wrap::after {
|
||||
border: 1px solid #d5d5d5;
|
||||
padding: 0.5rem;
|
||||
@@ -2428,7 +2426,7 @@ ul.pager {
|
||||
.basket-options {
|
||||
padding-top: 25px;
|
||||
|
||||
>.content {
|
||||
> .content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
@@ -2827,7 +2825,7 @@ ul.pager {
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
>* {
|
||||
> * {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -3224,8 +3222,8 @@ ul.pager {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
>.container {
|
||||
>.row {
|
||||
> .container {
|
||||
> .row {
|
||||
.col-xl-4 {
|
||||
order: 1;
|
||||
}
|
||||
@@ -3250,8 +3248,8 @@ ul.pager {
|
||||
#main-menu {
|
||||
#menu-container-1 {
|
||||
ul.level-0 {
|
||||
>li {
|
||||
>ul {
|
||||
> li {
|
||||
> ul {
|
||||
padding: 25px;
|
||||
}
|
||||
}
|
||||
@@ -3293,7 +3291,7 @@ ul.pager {
|
||||
}
|
||||
|
||||
.basket-summary-address {
|
||||
>.basket-address-form {
|
||||
> .basket-address-form {
|
||||
.left {
|
||||
.addresses {
|
||||
.address {
|
||||
@@ -3567,7 +3565,6 @@ ul.pager {
|
||||
}
|
||||
|
||||
.pager {
|
||||
|
||||
.first,
|
||||
.last {
|
||||
display: none;
|
||||
@@ -4140,7 +4137,8 @@ ul.pager {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.content {}
|
||||
.content {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5126,7 +5124,6 @@ ul.pager {
|
||||
|
||||
ul {
|
||||
li {
|
||||
|
||||
a,
|
||||
.menu-trigger {
|
||||
text-transform: none;
|
||||
@@ -5493,7 +5490,6 @@ ul.pager {
|
||||
.products-related {
|
||||
.owl-carousel {
|
||||
.owl-nav {
|
||||
|
||||
.owl-prev,
|
||||
.owl-next {
|
||||
span {
|
||||
@@ -5628,7 +5624,6 @@ ul.pager {
|
||||
border-radius: 10px;
|
||||
|
||||
.jconfirm-buttons {
|
||||
|
||||
.btn.btn-blue,
|
||||
.btn.btn-orange {
|
||||
background-color: $cRed !important;
|
||||
@@ -5655,7 +5650,6 @@ ul.pager {
|
||||
#basket {
|
||||
.basket-product {
|
||||
.buttons {
|
||||
|
||||
.int-format.form-control:focus,
|
||||
.int-format.form-control:active {
|
||||
border: 2px solid #000;
|
||||
@@ -5666,7 +5660,8 @@ ul.pager {
|
||||
}
|
||||
|
||||
.row {
|
||||
.col-12 {}
|
||||
.col-12 {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5677,7 +5672,6 @@ ul.pager {
|
||||
#basket {
|
||||
.basket-bottom {
|
||||
.basket-message {
|
||||
|
||||
.form-control:focus,
|
||||
.form-control:active {
|
||||
border: 2px solid #000;
|
||||
@@ -6100,7 +6094,7 @@ ul.pager {
|
||||
}
|
||||
|
||||
.row {
|
||||
>div {
|
||||
> div {
|
||||
&:hover {
|
||||
img {
|
||||
animation-name: buzz-out-on-hover;
|
||||
@@ -6241,7 +6235,6 @@ ul.pager {
|
||||
}
|
||||
|
||||
.swiper {
|
||||
|
||||
.swiper-button-prev,
|
||||
.swiper-button-next {
|
||||
width: 40px;
|
||||
@@ -6306,3 +6299,86 @@ ul.pager {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// ******************
|
||||
.form-control {
|
||||
&.form-control-phone {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
border-radius: 10px;
|
||||
|
||||
&:has(> .form-control-input:focus) {
|
||||
color: #495057;
|
||||
background-color: #fff;
|
||||
border-color: #80bdff;
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
||||
}
|
||||
&:hover {
|
||||
&[tooltip] {
|
||||
position: relative;
|
||||
}
|
||||
&[tooltip]:before {
|
||||
content: '';
|
||||
display: none;
|
||||
content: '';
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 5px solid #343a40;
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 85px;
|
||||
z-index: 8;
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&[tooltip]:after {
|
||||
display: none;
|
||||
content: attr(tooltip);
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 50px;
|
||||
padding: 5px 8px;
|
||||
background: #343a40;
|
||||
color: #fff;
|
||||
z-index: 9;
|
||||
font-size: 0.75em;
|
||||
// height: 18px;
|
||||
line-height: 18px;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
}
|
||||
&[tooltip]:hover:before,
|
||||
&[tooltip]:hover:after {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control-phone-code {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
|
||||
span {
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.form-control-input {
|
||||
border: none;
|
||||
height: calc(2.25rem - 2px);
|
||||
|
||||
&:focus {
|
||||
border: none;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -70,7 +70,21 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="text" id="phone" name="phone" class="form-control" required placeholder="<?= ucfirst( \S::lang( 'telefon' ) );?>" value="<?= htmlspecialchars( $address_current['phone'] );?>">
|
||||
<div class="form-control form-control-phone" tooltip="Wprowadź numer w formacie: 123456789">
|
||||
<div class="form-control-phone-code">
|
||||
<img src="/images/system/lang_pl.png" alt="">
|
||||
<span>+48</span>
|
||||
</div>
|
||||
<input
|
||||
type="tel"
|
||||
id="phone"
|
||||
name="phone"
|
||||
class="form-control form-control-input"
|
||||
required
|
||||
placeholder="<?= ucfirst(\S::lang('telefon')); ?>"
|
||||
value="<?= htmlspecialchars($address_current['phone']); ?>"
|
||||
pattern="[0-9]{9}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
@@ -95,8 +109,26 @@
|
||||
<? if ( $this -> client ):?></div><? endif;?>
|
||||
</div>
|
||||
<script class="footer">
|
||||
$( function()
|
||||
{
|
||||
$(document).ready(function () {
|
||||
function validatePhone() {
|
||||
var phone = $('#phone');
|
||||
var phonePattern = /^[0-9]{9}$/;
|
||||
|
||||
if (!phone.val() || !phonePattern.test(phone.val())) {
|
||||
$('#order-send').prop('disabled', true);
|
||||
} else {
|
||||
$('#order-send').prop('disabled', false);
|
||||
}
|
||||
}
|
||||
|
||||
$('#phone').on('input', function () {
|
||||
validatePhone();
|
||||
});
|
||||
|
||||
validatePhone();
|
||||
});
|
||||
|
||||
$( function() {
|
||||
$( 'body' ).on( click_event, '.addresses .address .btn-select', function(e)
|
||||
{
|
||||
e.preventDefault();
|
||||
|
||||
Reference in New Issue
Block a user