diff --git a/assets/css/gp-style-tablet.css b/assets/css/gp-style-tablet.css index ea0fd00..5b93838 100644 --- a/assets/css/gp-style-tablet.css +++ b/assets/css/gp-style-tablet.css @@ -187,6 +187,12 @@ main{ } .cabinet__orders.active, .cabinet__profile.active{ opacity: 1; + + width: 100%; +} +.cabinet__orders.hide, .cabinet__profile.hide{ + position: static; + display: block; } .cabinet__subscription-pc{ display: none; diff --git a/assets/js/gp-cabinet.js b/assets/js/gp-cabinet.js index 764289a..9f23f75 100644 --- a/assets/js/gp-cabinet.js +++ b/assets/js/gp-cabinet.js @@ -7,55 +7,8 @@ let widthPhoneCabinet = 1200; fun.toggleOpenX('.cabinet-card__order', '.cabinet-card-order__open-detail', '.cabinet-card-order__detail', '.cabinet-card-order__block-detail'); - -startHeight('.cabinet__orders', '.cabinet', widthPhoneCabinet, '.cabinet__profile', '.cabinet-control__button'); controlCabinet('.cabinet-control__button', '.cabinet', widthPhoneCabinet); -window.addEventListener('resize', (e) => { - startHeight('.cabinet__orders', '.cabinet', widthPhoneCabinet, '.cabinet__profile', '.cabinet-control__button'); -}); - - -// function -function startHeight(heightElement, contentElement, minWidth, removeActive, buttons) { - let thisWidth = window.innerWidth; - let thisHeightElement = document.querySelector(heightElement); - let thisContentElement = document.querySelector(contentElement); - let thisRemoveActive = document.querySelector(removeActive); - let thisButtons = document.querySelectorAll(buttons); - - if (thisWidth <= minWidth) { - let newHeight = thisHeightElement.clientHeight + 48; - - thisContentElement.style.height = `${newHeight}px`; - thisHeightElement.classList.add('active'); - thisRemoveActive.classList.remove('active'); - - thisButtons.forEach(e => { - let thisClassList = e.classList; - - if (!thisClassList.contains('start')) { - thisClassList.remove('active'); - }else{ - thisClassList.add('active') - } - }) - }else{ - thisContentElement.style.height = 'auto'; - thisHeightElement.classList.remove('active'); - - thisButtons.forEach(e => { - let thisClassList = e.classList; - - if (!thisClassList.contains('start')) { - thisClassList.remove('active'); - }else{ - thisClassList.add('active') - } - }) - } -} - function controlCabinet(buttons, main, minWidth){ let thisWidth = window.innerWidth; let thisMain = document.querySelector(main); @@ -63,7 +16,6 @@ function controlCabinet(buttons, main, minWidth){ if (thisWidth <= minWidth) { let thisButtons = document.querySelectorAll(buttons); - // let thisContents = document.querySelectorAll(contents); thisButtons.forEach(e => { e.onclick = function (element){ @@ -76,6 +28,16 @@ function controlCabinet(buttons, main, minWidth){ if (!thisContent.classList.contains('active')) { thisMain.querySelector('.active').classList.remove('active'); thisContent.classList.add('active'); + + setTimeout(() => { + thisMain.style.height = 'auto'; + + if (thisMain.querySelector('.hide')) { + thisMain.querySelector('.hide').classList.remove('hide'); + } + + thisMain.querySelector('.active').classList.add('hide'); + }, 200); } thisButtons.forEach(e => { @@ -86,4 +48,5 @@ function controlCabinet(buttons, main, minWidth){ }) } -} \ No newline at end of file +} + diff --git a/registration.html b/registration.html index 1f8ed3a..7ff353c 100644 --- a/registration.html +++ b/registration.html @@ -366,7 +366,7 @@ -
+