Skip to content

Тимофей Семененко / shold.dev5.ashmanov.com

Go to a project
Commit 39db5ad6 by Semenenko Timofey
Options

filter part2

1 parent 1e01f4b9
Pipeline #2856 for 39db5ad6 skipped in 0 seconds
Inline Side-by-side
Showing 6 changed files with 95 additions and 156 deletions
404.php
...@@ -6,7 +6,6 @@ if(!isAjax()) { ...@@ -6,7 +6,6 @@ if(!isAjax()) {
CHTTP::SetStatus("404 Not Found"); CHTTP::SetStatus("404 Not Found");
} }
@define('ERROR_404','Y'); @define('ERROR_404','Y');
global $APPLICATION; global $APPLICATION;
global $USER; global $USER;
$APPLICATION->RestartBuffer(); $APPLICATION->RestartBuffer();
......
css/easy-responsive-tabs.css
...@@ -39,11 +39,11 @@ h2.resp-accordion { ...@@ -39,11 +39,11 @@ h2.resp-accordion {
} }
.resp-tab-active { .resp-tab-active {
border: 1px solid #5AB1D0 !important; border: 1px solid #fff !important;
border-bottom: none; border-bottom: none;
margin-bottom: -1px !important; margin-bottom: -1px !important;
padding: 12px 14px 14px 14px !important; padding: 12px 14px 14px 14px !important;
border-top: 4px solid #5AB1D0 !important; border-top: 4px solid #fff !important;
border-bottom: 0px #fff solid !important; border-bottom: 0px #fff solid !important;
} }
...@@ -58,10 +58,11 @@ h2.resp-accordion { ...@@ -58,10 +58,11 @@ h2.resp-accordion {
.resp-tab-content { .resp-tab-content {
border: 1px solid #c1c1c1; border: 1px solid #c1c1c1;
border-top-color: #5AB1D0; border-top-color: #fff;
} }
h2.resp-accordion { h2.resp-accordion {
color: #fff;
font-size: 13px; font-size: 13px;
border: 1px solid #c1c1c1; border: 1px solid #c1c1c1;
border-top: 0px solid #c1c1c1; border-top: 0px solid #c1c1c1;
...@@ -116,8 +117,8 @@ z-index: 1; ...@@ -116,8 +117,8 @@ z-index: 1;
margin-right: -1px !important; margin-right: -1px !important;
padding: 14px 15px 15px 14px !important; padding: 14px 15px 15px 14px !important;
border-top: 1px solid; border-top: 1px solid;
border: 1px solid #5AB1D0 !important; border: 1px solid #fff !important;
border-left: 4px solid #5AB1D0 !important; border-left: 4px solid #fff !important;
margin-bottom: 4px !important; margin-bottom: 4px !important;
border-right: 1px #FFF solid !important; border-right: 1px #FFF solid !important;
} }
......
css/media.css
...@@ -206,7 +206,8 @@ li.additional_list_item{margin-bottom:20px;float:left;} ...@@ -206,7 +206,8 @@ li.additional_list_item{margin-bottom:20px;float:left;}
.path-current{padding:0 5px;} .path-current{padding:0 5px;}
.page-head._bigger .path-current{margin-bottom:6px;} .page-head._bigger .path-current{margin-bottom:6px;}
.page-head._mp{overflow:hidden;} .page-head._mp{overflow:hidden;}
.page-content{/* padding: 200px 0 30px 0; */} .page-content{/* padding-top: 80px; */px; */}
/* .page-content.mobile{padding-top: 230px;} */
._top .path{padding-top:70px;text-align:center;margin:0;} ._top .path{padding-top:70px;text-align:center;margin:0;}
.page-head._bigger .path{padding-top:3px;margin:0;text-align:center;} .page-head._bigger .path{padding-top:3px;margin:0;text-align:center;}
.page-head._bigger .phone{/* bottom:7px; */top:auto;left:0;width:100%;} .page-head._bigger .phone{/* bottom:7px; */top:auto;left:0;width:100%;}
...@@ -218,7 +219,7 @@ li.additional_list_item{margin-bottom:20px;float:left;} ...@@ -218,7 +219,7 @@ li.additional_list_item{margin-bottom:20px;float:left;}
.filter._inner-page .filter-element{font-size:0;} .filter._inner-page .filter-element{font-size:0;}
.filter-element._parent{width:100%;} .filter-element._parent{width:100%;}
.filter-element._select{min-width:0;width:33%;} .filter-element._select{min-width:0;width:33%;}
.filter-select-item{padding-left:0;text-align:center;display:block;} .filter-select-item{color: #333;padding-left:0;text-align:center;display:block;}
.mp-tiles-wr{padding-top:4rem;} .mp-tiles-wr{padding-top:4rem;}
.process-top{padding:0 0 0 0;min-height:auto;} .process-top{padding:0 0 0 0;min-height:auto;}
.process-top-image{float:none;position:static;left:0;top:0;overflow:hidden;width:100%;height:auto;} .process-top-image{float:none;position:static;left:0;top:0;overflow:hidden;width:100%;height:auto;}
......
js/index.js
...@@ -489,6 +489,11 @@ $(document).ready(function() { ...@@ -489,6 +489,11 @@ $(document).ready(function() {
width: 'auto', //auto or any width like 600px width: 'auto', //auto or any width like 600px
fit: true, // 100% fit in a container fit: true, // 100% fit in a container
tabidentify: 'hor_1', // The tab groups identifier tabidentify: 'hor_1', // The tab groups identifier
activetab_bg: '#333', // background color for active tabs in this group
inactive_bg: '#f37e43', // background color for inactive tabs in this group
active_border_color: '#f37e43', // border color for active tabs heads in this group
inactive_color: '#fff',
activetab_color: '#fff',
activate: function(event) { // Callback function if tab is switched activate: function(event) { // Callback function if tab is switched
var $tab = $(this); var $tab = $(this);
var $info = $('#nested-tabInfo'); var $info = $('#nested-tabInfo');
...@@ -497,17 +502,41 @@ $(document).ready(function() { ...@@ -497,17 +502,41 @@ $(document).ready(function() {
$info.show(); $info.show();
} }
}); });
$('#parentHorizontalTab').easyResponsiveTabs({
// Child Tab type: 'default', //Types: default, vertical, accordion
$('#ChildVerticalTab_1').easyResponsiveTabs({ width: 'auto', //auto or any width like 600px
type: 'vertical', fit: true, // 100% fit in a container
width: 'auto', tabidentify: 'hor_2', // The tab groups identifier
fit: true, activetab_bg: '#333', // background color for active tabs in this group
tabidentify: 'ver_1', // The tab groups identifier inactive_bg: '#f37e43', // background color for inactive tabs in this group
activetab_bg: '#fff', // background color for active tabs in this group active_border_color: '#f37e43', // border color for active tabs heads in this group
inactive_bg: '#F5F5F5', // background color for inactive tabs in this group inactive_color: '#fff',
active_border_color: '#c1c1c1', // border color for active tabs heads in this group activetab_color: '#fff',
active_content_border_color: '#5AB1D0' // border color for active tabs contect in this group so that it matches the tab head border activate: function(event) { // Callback function if tab is switched
var $tab = $(this);
var $info = $('#nested-tabInfo');
var $name = $('span', $info);
$name.text($tab.text());
$info.show();
}
});
$('#parentHorizontalTab').easyResponsiveTabs({
type: 'default', //Types: default, vertical, accordion
width: 'auto', //auto or any width like 600px
fit: true, // 100% fit in a container
tabidentify: 'hor_3', // The tab groups identifier
activetab_bg: '#333', // background color for active tabs in this group
inactive_bg: '#f37e43', // background color for inactive tabs in this group
active_border_color: '#f37e43', // border color for active tabs heads in this group
inactive_color: '#fff',
activetab_color: '#fff',
activate: function(event) { // Callback function if tab is switched
var $tab = $(this);
var $info = $('#nested-tabInfo');
var $name = $('span', $info);
$name.text($tab.text());
$info.show();
}
}); });
//Vertical Tab //Vertical Tab
...@@ -517,6 +546,12 @@ $(document).ready(function() { ...@@ -517,6 +546,12 @@ $(document).ready(function() {
fit: true, // 100% fit in a container fit: true, // 100% fit in a container
closed: 'accordion', // Start closed if in accordion view closed: 'accordion', // Start closed if in accordion view
tabidentify: 'hor_1', // The tab groups identifier tabidentify: 'hor_1', // The tab groups identifier
activetab_bg: '#333', // background color for active tabs in this group
inactive_bg: '#f37e43', // background color for inactive tabs in this group
active_border_color: '#fff', // border color for active tabs heads in this group
inactive_color: '#fff',
activetab_color: '#fff',
activate: function(event) { // Callback function if tab is switched activate: function(event) { // Callback function if tab is switched
var $tab = $(this); var $tab = $(this);
var $info = $('#nested-tabInfo2'); var $info = $('#nested-tabInfo2');
...@@ -525,7 +560,19 @@ $(document).ready(function() { ...@@ -525,7 +560,19 @@ $(document).ready(function() {
$info.show(); $info.show();
} }
}); });
}); });
$(".resp-accordion hor_1 resp-tab-active").on ('click' , function () {
alert('1');
// $('.page-content mobile').removeClass('mobile');
});
//отключение режима просмотра в карточке проекта
$(".hor_1").on('click' , function(){
$('.page-content').addClass('mobile');
});
local/include/filter_params_mobile.php
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<? if ($_SERVER['REQUEST_URI'] == '/projects/') { ?> <? if ($_SERVER['REQUEST_URI'] == '/projects/') { ?>
<style> <style>
.page-content { .page-content {
padding: 300px 0 30px 0; padding: 85px 0 30px 0;
} }
.text-content H1 { .text-content H1 {
...@@ -89,128 +89,6 @@ ...@@ -89,128 +89,6 @@
</div> </div>
<? if ($APPLICATION->GetCurPage() != '/') { ?> </div><? } ?> <? if ($APPLICATION->GetCurPage() != '/') { ?> </div><? } ?>
<? if ($APPLICATION->GetCurPage() != '/') { ?>
<div class='out_sub_menu'> <? } ?>
<div class="filter-element _parent">
<div id="parentVerticalTab">
<ul class="resp-tabs-list hor_1">
<li class="filter-element _house _inactive" data-type="house">
Площадь<? if ($APPLICATION->GetCurPage() == '/') { ?><a href="#!"
class="filter-select-title">площадь</a> <? } ?>
1
</li>
<li class="filter-element _house _inactive" data-type="house">
Этажи<? if ($APPLICATION->GetCurPage() == '/') { ?><a href="#!"
class="filter-select-title">этажи</a> <? } ?>
</li>
<li class="filter-element _house _inactive" data-type="house">
Спальни <? if ($APPLICATION->GetCurPage() == '/') { ?><a href="#!"
class="filter-select-title">спальни</a> <? } ?>
</li>
<li class="filter-element _house _inactive" data-type="house">
Тип<? if ($APPLICATION->GetCurPage() == '/') { ?> <a href="#!"
class="filter-select-title">Тип</a> <? } ?>
</li>
<li class="filter-element _bathhouse _inactive" data-type="bathhouse">Этажность</li>
<li class="filter-element _misc _inactive" data-type="misc">Виды конструкций</li>
</ul>
<div class="resp-tabs-container hor_1">
<div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'square';
$filterData = $projectFilter->getFilterData($key); ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
</div>
</div>
<div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'floors';
$filterData = $projectFilter->getFilterData($key) ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
</div>
</div>
<div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'bedrooms';
$filterData = $projectFilter->getFilterData($key) ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
</div>
</div>
<div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'combo';
$filterData = $projectFilter->getFilterData($key); ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
</div>
</div>
<div>
<? $key = 'bathhouse-floors';
$filterData = $projectFilter->getFilterData($key) ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-option filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
<div>
<? $key = 'misc-type';
$filterData = $projectFilter->getFilterData($key); ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-option filter-chosable"
data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?>
</div>
</div>
</div>
<div class="filter-element _all _inactive" data-type="all"></div>
</div>
</div>
<? if ($APPLICATION->GetCurPage() == '/') { ?> <? if ($APPLICATION->GetCurPage() == '/') { ?>
<button class="filter-element _submit filter-submit-button" type="submit">подобрать</button> <? } ?> <button class="filter-element _submit filter-submit-button" type="submit">подобрать</button> <? } ?>
...@@ -223,7 +101,10 @@ ...@@ -223,7 +101,10 @@
<style> <style>
.page-content { .page-content {
padding: 150px 0 30px 0; padding: 205px 0 30px 0;
}
.page-content.mobile {
padding: 320px 0 30px 0;
} }
.projects-list { .projects-list {
...@@ -237,7 +118,7 @@ ...@@ -237,7 +118,7 @@
.static-content { .static-content {
padding-bottom: 0; padding-bottom: 0;
margin-top: 90px; /*margin-top: 90px;*/
} }
</style> </style>
...@@ -436,11 +317,11 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') { ...@@ -436,11 +317,11 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') {
<style> <style>
.page-content { .page-content {
padding: 100px 0 30px 0; padding: 105px 0 30px 0;
} }
.projects-list { .projects-list {
margin-top: 45px; margin-top: 60px;
} }
.text-content H1 { .text-content H1 {
...@@ -450,14 +331,15 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') { ...@@ -450,14 +331,15 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') {
.static-content { .static-content {
padding-bottom: 0; padding-bottom: 0;
margin-top: 60px; /*margin-top: 60px;*/
} }
.page-content.mobile {
@media (max-width: 1024px) { padding-top: 180px;
.page-head._bigger + .page-content {
padding-top: 100px;
} }
@media (max-width: 1024px) {
.page-head._bigger + .page-content.mobile {
padding-top: 200px;
} }
</style> </style>
...@@ -537,15 +419,18 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') { ...@@ -537,15 +419,18 @@ if ($_SERVER['REQUEST_URI'] == '/projects/bani-iz-kleenogo-brusa/') {
<div class="resp-tabs-container hor_1"> <div class="resp-tabs-container hor_1">
<div> <div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'bathhouse-floors'; <? $key = 'bathhouse-floors';
$filterData = $projectFilter->getFilterData($key) ?> $filterData = $projectFilter->getFilterData($key) ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?> <? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-option filter-chosable" <a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>" data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a> data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?> <? } ?>
</div> </div>
</div>
</div>
</div> </div>
...@@ -569,7 +454,7 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') { ...@@ -569,7 +454,7 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') {
<style> <style>
.page-content { .page-content {
padding: 100px 0 30px 0; padding: 105px 0 30px 0;
} }
.projects-list { .projects-list {
...@@ -585,6 +470,9 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') { ...@@ -585,6 +470,9 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') {
padding-bottom: 0; padding-bottom: 0;
margin-top: 60px; margin-top: 60px;
} }
.page-content.mobile {
padding-top: 200px;
}
@media (max-width: 1024px) { @media (max-width: 1024px) {
.page-head._bigger + .page-content { .page-head._bigger + .page-content {
...@@ -669,15 +557,18 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') { ...@@ -669,15 +557,18 @@ if ($_SERVER['REQUEST_URI'] == '/projects/raznye-proekty/') {
<div class="resp-tabs-container hor_1"> <div class="resp-tabs-container hor_1">
<div> <div>
<div class="filter-select">
<div class='filter-inner-wrap'>
<? $key = 'misc-type'; <? $key = 'misc-type';
$filterData = $projectFilter->getFilterData($key); ?> $filterData = $projectFilter->getFilterData($key); ?>
<? foreach ($filterData['items'] as $code => $filterItem) { ?> <? foreach ($filterData['items'] as $code => $filterItem) { ?>
<a href="#!" class="filter-option filter-chosable" <a href="#!" class="filter-select-item filter-chosable"
data-name="<?= $key ?>:<?= $code ?>" data-name="<?= $key ?>:<?= $code ?>"
data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a> data-input="<?= $key ?>-<?= $code ?>"><span><?= $filterItem['name'] ?></span></a>
<? } ?> <? } ?>
</div> </div>
</div>
</div>
</div> </div>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!