Skip to content

Руслан Ибрагимов / yescenter

Go to a project
Commit 4286c408 by Ruha
Options

final fixes

1 parent 6d160f59
Pipeline #2610 for 4286c408 skipped in 0 seconds
Expand all
Inline Side-by-side
Showing 7 changed files with 175 additions and 65 deletions
css/additional.css
...@@ -4,20 +4,26 @@ ...@@ -4,20 +4,26 @@
z-index: 4999; z-index: 4999;
width: 100%; width: 100%;
height: 100%; height: 100%;
top: 0;
left: 0;
bottom: 0;
right: 0;
align-content: center;
justify-content: center;
align-items: center;
} }
.modal { .modal {
z-index: 5000; z-index: 5000;
width: 416px; width: 416px;
background: #fff; background: #fff;
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
padding: 0 0 12px 0; padding: 0 0 12px 0;
border-radius: 8px; border-radius: 8px;
} }
.modal-container {
}
.hidden { .hidden {
display: none; display: none;
} }
...@@ -38,21 +44,25 @@ ...@@ -38,21 +44,25 @@
margin: 0 auto; margin: 0 auto;
margin-top: 17px; margin-top: 17px;
} }
#callback-form .button { #callback-form .button {
margin-top:10px; margin-top: 10px;
} }
.modal-head { .modal-head {
text-align: right; text-align: right;
height: 28px; height: 28px;
} }
.modal-close { .modal-close {
text-align: right; text-align: right;
} }
.modal-close-xray { .modal-close-xray {
padding: 18px; padding: 18px;
position: relative; position: relative;
background: url("/img/modal/close.svg") no-repeat 96% 15px; background: url("/img/modal/close.png") no-repeat 96% 15px;
cursor:pointer; cursor: pointer;
} }
.modal-body-header { .modal-body-header {
...@@ -63,65 +73,101 @@ ...@@ -63,65 +73,101 @@
.modal-body-header small { .modal-body-header small {
font-size: 14px; font-size: 14px;
display: block; display: block;
padding: 0 0 37px; padding: 0 0 28px;
} }
.modal-label { .modal-label {
display: block; display: block;
font-size:14px; font-size: 14px;
font-weight: bold; font-weight: bold;
margin:auto; margin: auto;
padding:0 40px; padding: 0 40px;
margin-bottom: 2px; margin-bottom: 2px;
} }
#success .modal-body-header { #success .modal-body-header {
padding-top:36px; padding-top: 36px;
} }
#success small { #success small {
display: block; display: block;
padding-top:18px; padding-top: 18px;
} }
.time { .time {
width:152px; width: 152px;
display: inline-block; display: inline-block;
float:left; float: left;
margin-top: -20px;
} }
fieldset { fieldset {
max-height: 89px; max-height: 89px;
min-height: 40px; min-height: 87px;
} }
#order-form fieldset{
min-height:86px; #order-form fieldset {
min-height: 86px;
} }
#order-form fieldset:last-of-type { #order-form fieldset:last-of-type {
min-height: 94px; min-height: 94px;
} }
.time .input {width:100%; display: inline-block}
.tm {margin-left:40px;} .time .input {
.arrow-up{ width: 100%;
display: inline-block
}
.tm {
margin-left: 40px;
}
.item-poss a {
cursor: default;
}
.arrow-up {
content: ""; content: "";
display: block; display: block;
position: relative; position: relative;
background: url('/img/modal/butt_up.svg'); background: url('/img/modal/butt_up.svg');
height: 30px; height: 30px;
width: 30px; width: 42px;
top: 30px; top: 22px;
right: -115px; right: -109px;
background-size: cover; background-size: cover;
margin-top: -32px; margin-top: -32px;
cursor: pointer;
z-index:100;
} }
.arrow-down { .arrow-down {
content: ""; content: "";
display: block; display: block;
position: relative; position: relative;
background: url('/img/modal/butt_down.svg'); background: url('/img/modal/butt_down.svg');
height: 30px; height: 30px;
width: 30px; width: 42px;
top: 50px; top: 44px;
right: -115px; right: -109px;
background-size: cover; background-size: cover;
margin-top: -32px; margin-top: -32px;
cursor: pointer;
z-index:50;
}
.time.tm::after {
width: 16px;
height: 4px;
display: block;
content: "";
position: relative;
top: -45px;
right: -161px;
border-top: 2px solid #cacaca;
} }
.tm2 {margin-left:32px;} .tm2 {
margin-left: 32px;
}
.input { .input {
width: 336px; width: 336px;
height: 46px; height: 46px;
...@@ -137,36 +183,42 @@ fieldset { ...@@ -137,36 +183,42 @@ fieldset {
box-sizing: border-box; box-sizing: border-box;
padding: 4px 16px; padding: 4px 16px;
} }
.error { color: #ed1c24;}
.error {
color: #ed1c24;
}
label.error { label.error {
position: relative; position: relative;
height:0; height: 0;
top: -84px; top: -84px;
left: 148px; left: 148px;
display:inline-block; display: inline-block;
width:55%; width: 55%;
text-align:right; text-align: right;
font-size:13px; font-size: 13px;
} }
#footer-form label { #footer-form label {
padding:0 0px; padding: 0 0px;
} }
input:disabled, input:disabled,
input[disabled]{ input[disabled] {
border: 1px solid #999999; border: 1px solid #999999;
background-color: #EEEEEE!important; background-color: #EEEEEE !important;
color: #000!important; color: #000 !important;
cursor: not-allowed; cursor: not-allowed;
} }
input.error { input.error {
border-color: #ed1c24!important; border-color: #ed1c24 !important;
} }
input.valid { input.valid {
border-color: #18FF00!important; border-color: #18FF00 !important;
} }
.input input[type="text"] { .input input[type="text"] {
font-size: 15px; font-size: 15px;
color: #333; color: #333;
...@@ -176,16 +228,31 @@ input.valid { ...@@ -176,16 +228,31 @@ input.valid {
width: 100%; width: 100%;
height: 46px; height: 46px;
} }
.last {padding-top:18px;}
.last {
padding-top: 20px;
}
@media (max-width: 480px) { @media (max-width: 480px) {
.modal {width:360px;} .modal {
.map-ct1 {padding-top:0px;} width: 360px;
}
#footer-form input{width:328px;} .map-ct1 {
.last {padding-top:18px;} padding-top: 0px;
.modal-label { }
#footer-form input {
width: 328px;
} }
.last {
padding-top: 18px;
}
.modal-label {
}
#order-form label { #order-form label {
padding: 0 13px; padding: 0 13px;
} }
...@@ -194,13 +261,53 @@ input.valid { ...@@ -194,13 +261,53 @@ input.valid {
width: 42%; width: 42%;
display: inline-block; display: inline-block;
} }
.tm {margin-left:12px;}
.tm {
margin-left: 12px;
}
} }
@media (max-width: 769px) and (min-width: 481px) {
.map-ct1 {
padding-top: 0px;
}
#footer-form input {
width: 282px;
}
#footer-form label.error {
left: 127px
}
}
@media (max-width: 320px) {
.time.tm::after {
right:-130px;
}
.map-ct1 {
padding-top: 0px;
}
#footer-form input {
width: 282px;
}
@media (max-width: 769px) and (min-width:481px) { #footer-form label.error {
.map-ct1 {padding-top:0px;} left: 127px
#footer-form input{width:282px;} }
#footer-form label.error { left: 127px} .modal {
width: 300px;
}
.button {width: 273px;}
.input {width:273px;}
#footer-form label {
padding: 0px 5px;
}
.arrow-up, .arrow-down {
right: -80px;
}
.time {
width: 122px;
}
} }
css/style.css
...@@ -176,13 +176,13 @@ table { border-spacing: 0; border-collapse: collapse; width: 100%; } ...@@ -176,13 +176,13 @@ table { border-spacing: 0; border-collapse: collapse; width: 100%; }
.fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("../img/fc/fancybox_sprite@2x.png"); background-size: 44px 152px; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("../img/fc/fancybox_sprite@2x.png"); background-size: 44px 152px; }
#fancybox-loading div { background-image: url("../img/fc/fancybox_loading@2x.gif"); background-size: 24px 24px; } } #fancybox-loading div { background-image: url("/img/fc/fancybox_loading@2x.gif"); background-size: 24px 24px; } }
@font-face { font-family: PFAgoraSansPro; src: url("../fonts/PFAgoraSansPro-Bold.eot"); src: url("../fonts/PFAgoraSansPro-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/PFAgoraSansPro-Bold.woff2") format("woff2"), url("../fonts/PFAgoraSansPro-Bold.woff") format("woff"), url("../fonts/PFAgoraSansPro-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 700; } @font-face { font-family: PFAgoraSansPro; src: url("/fonts/PFAgoraSansPro-Bold.eot"); src: url("../fonts/PFAgoraSansPro-Bold.eot?#iefix") format("embedded-opentype"), url("/fonts/PFAgoraSansPro-Bold.woff") format("woff"), url("/fonts/PFAgoraSansPro-Bold.woff") format("woff"), url("/fonts/PFAgoraSansPro-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 700; }
@font-face { font-family: PFAgoraSansPro; src: url("../fonts/PFAgoraSansPro-Medium.eot"); src: url("../fonts/PFAgoraSansPro-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/PFAgoraSansPro-Medium.woff2") format("woff2"), url("../fonts/PFAgoraSansPro-Medium.woff") format("woff"), url("../fonts/PFAgoraSansPro-Medium.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 500; } @font-face { font-family: PFAgoraSansPro; src: url("/fonts/PFAgoraSansPro-Medium.eot"); src: url("../fonts/PFAgoraSansPro-Medium.eot?#iefix") format("embedded-opentype"), url("/fonts/PFAgoraSansPro-Medium.woff") format("woff"), url("/fonts/PFAgoraSansPro-Medium.woff") format("woff"), url("/fonts/PFAgoraSansPro-Medium.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 500; }
@font-face { font-family: PFAgoraSansPro; src: url("../fonts/PFAgoraSansPro-Regular.eot"); src: url("../fonts/PFAgoraSansPro-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/PFAgoraSansPro-Regular.woff2") format("woff2"), url("../fonts/PFAgoraSansPro-Regular.woff") format("woff"), url("../fonts/PFAgoraSansPro-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 400; } @font-face { font-family: PFAgoraSansPro; src: url("/fonts/PFAgoraSansPro-Regular.eot"); src: url("../fonts/PFAgoraSansPro-Regular.eot?#iefix") format("embedded-opentype"), url("/fonts/PFAgoraSansPro-Regular.woff") format("woff"), url("/fonts/PFAgoraSansPro-Regular.woff") format("woff"), url("/fonts/PFAgoraSansPro-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; font-weight: 400; }
body { font-family: PFAgoraSansPro; } body { font-family: PFAgoraSansPro; }
...@@ -585,7 +585,7 @@ body { font-family: PFAgoraSansPro; } ...@@ -585,7 +585,7 @@ body { font-family: PFAgoraSansPro; }
@media only screen and (max-width: 650px) { .map-ct1 .test { height: 352px; } } @media only screen and (max-width: 650px) { .map-ct1 .test { height: 352px; } }
.map-ct1 .form1 { position: absolute; top: 56px; z-index: 1; right: 0; -webkit-border-radius: 7px; border-radius: 7px; background-color: #ffffff; width: 336px; padding: 35px 48px 48px 48px; } .map-ct1 .form1 { position: absolute; top: 56px; z-index: 1; right: 0; -webkit-border-radius: 7px; border-radius: 7px; background-color: #ffffff; width: 336px; padding: 35px 48px 10px 48px; }
@media only screen and (max-width: 960px) { .map-ct1 .form1 { top: 24px; right: 24px; width: 281px; padding: 26px 24px; } } @media only screen and (max-width: 960px) { .map-ct1 .form1 { top: 24px; right: 24px; width: 281px; padding: 26px 24px; } }
......
js/common.js
/* common */ /* common */
// Для запуска функции:
$(window).resize();
$(document).ready(function () { $(document).ready(function () {
if ($('.mask').length > 0) { if ($('.mask').length > 0) {
$(".mask").mask("8 (999) 999-99-99"); $(".mask").mask("8 (999) 999-99-99");
...@@ -145,12 +149,12 @@ $('.modal-close-xray').click(function () { ...@@ -145,12 +149,12 @@ $('.modal-close-xray').click(function () {
closemodal($(this).parents('.modal').attr('id')); closemodal($(this).parents('.modal').attr('id'));
}); });
function callmodal(id) { function callmodal(id) {
overlay.removeClass('hidden'); overlay.css({'display':'flex'});
$('#' + id).removeClass('hidden'); $('#' + id).removeClass('hidden');
} }
function closemodal(id) { function closemodal(id) {
overlay.addClass('hidden'); overlay.css({'display':'none'});
$('#' + id).addClass('hidden'); $('#' + id).addClass('hidden');
} }
...@@ -168,17 +172,17 @@ $('.arrow-down').click(function () { ...@@ -168,17 +172,17 @@ $('.arrow-down').click(function () {
}); });
function time(number, type) { function time(number, type) {
number = number.toString();
var date = '25.06.2014 ' + number.toString(); var date = '25.06.2014 ' + number.toString();
var d = new Date();
var time = date.replace(/^(\d+)\.(\d+)\./, '$2/$1/'); var time = date.replace(/^(\d+)\.(\d+)\./, '$2/$1/');
var d = new Date();
d.setTime(Date.parse(time)); d.setTime(Date.parse(time));
if (type == 'down') { if (type == 'down') {
d.setMinutes(d.getMinutes() - 90); d=moment(d).add(-30, 'minutes').format('HH:mm');
} else { } else {
d.setMinutes(d.getMinutes() - 30); d=moment(d).add(30, 'minutes').format('HH:mm');
} }
return d.toLocaleTimeString().substr(0, 5); return d;
} }
$('#callback-form').submit(function (e) { $('#callback-form').submit(function (e) {
...@@ -187,7 +191,6 @@ $('#callback-form').submit(function (e) { ...@@ -187,7 +191,6 @@ $('#callback-form').submit(function (e) {
}); });
$('#order-form').submit(function (e) { $('#order-form').submit(function (e) {
e.preventDefault(); e.preventDefault();
closemodal('bid');
send('order-form'); send('order-form');
}); });
$('#footer-form').submit(function (e) { $('#footer-form').submit(function (e) {
...@@ -206,7 +209,7 @@ function send(form) { ...@@ -206,7 +209,7 @@ function send(form) {
closemodal('callback'); closemodal('callback');
closemodal('bid'); closemodal('bid');
closemodal('success'); closemodal('success');
$("#" + form).find('input').prop("disabled", true); $("#" + form).find('.button').prop("disabled", true);
callmodal('success'); callmodal('success');
} }
if (response.type == 'error_name') { if (response.type == 'error_name') {
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!