diff --git a/src/scripts/navigate-event.js b/src/scripts/navigate-event.js index d7b8212..0e9f171 100644 --- a/src/scripts/navigate-event.js +++ b/src/scripts/navigate-event.js @@ -35,8 +35,30 @@ function openRightMenu() { ); } -const controls = document.querySelectorAll('.jsMobileSidebarControl'); -Array.from(controls).forEach(control => { +const control = document.querySelector('.jsMobileSidebarControl'); +const buttons = control.querySelectorAll('.jsMobileRightMenuButton'); +const rightMenu = control.querySelector('.jsRightMenu'); + +Array.from(buttons).forEach(button => + button.addEventListener("click", () => { + if (button.classList.contains('icon-close')) { + button.classList.remove('icon-close'); + button.classList.add('icon-options-vertical'); + rightMenu.setAttribute('hidden', ''); + } + else { + button.classList.remove('icon-options-vertical'); + button.classList.add('icon-close'); + rightMenu.removeAttribute('hidden'); + }; + }) +) + + + + + +/*Array.from(controls).forEach(control => { const button = control.querySelector('.jsMobileRightMenuButton'); const rightMenu = control.querySelector('.jsRightMenu'); @@ -53,7 +75,7 @@ Array.from(controls).forEach(control => { rightMenu.removeAttribute('hidden'); } }); -}); +});*/ /*const buttons = document.querySelectorAll(".jsMobileToggleRightMenu"); diff --git a/src/views/partials/admin/page-admin-chat-create.pug b/src/views/partials/admin/page-admin-chat-create.pug index 85ce2ff..ce0335c 100644 --- a/src/views/partials/admin/page-admin-chat-create.pug +++ b/src/views/partials/admin/page-admin-chat-create.pug @@ -1,8 +1,8 @@ div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.padding-large.border-bottom.border-color-grey - div.segment.half.sm-full + div.segment.full.sm-three-quarter h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title') - div.segment.half.sm-hidden.text-right - solid-link(class="backlink", next=`admin-${getRoute('chat', true)}` data-trans='circle.create.backlink') + div.segment.lg-hidden.sm-quarter.text-right + div.jsMobileRightMenuButton.icon.icon-close.icon-heading div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal div#loader-users-title.loader.loader diff --git a/src/views/partials/admin/page-admin-chat.pug b/src/views/partials/admin/page-admin-chat.pug index 0d7fdf0..32a3a93 100644 --- a/src/views/partials/admin/page-admin-chat.pug +++ b/src/views/partials/admin/page-admin-chat.pug @@ -1,5 +1,8 @@ div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal - h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title') + div.segment.full.sm-three-quarter + h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title') + div.segment.lg-hidden.sm-quarter.text-right + div.jsMobileRightMenuButton.icon.icon-close.icon-heading div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal diff --git a/src/views/partials/admin/page-admin-circles-create.pug b/src/views/partials/admin/page-admin-circles-create.pug index ad90c8f..17f4f2f 100644 --- a/src/views/partials/admin/page-admin-circles-create.pug +++ b/src/views/partials/admin/page-admin-circles-create.pug @@ -1,8 +1,8 @@ div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey - div.segment.half.sm-full + div.segment.full.sm-three-quarter h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.create.title') - div.segment.half.sm-hidden.text-right - solid-link(class="backlink", next=`admin-${getRoute('circles', true)}` data-trans='circle.create.backlink') + div.segment.lg-hidden.sm-quarter.text-right + div.jsMobileRightMenuButton.icon.icon-close.icon-heading div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal div.loader.loader-top(id=`loader-admin-${getComponent('circles').uniq}`) diff --git a/src/views/partials/admin/page-admin-circles.pug b/src/views/partials/admin/page-admin-circles.pug index 9aae27b..788532f 100644 --- a/src/views/partials/admin/page-admin-circles.pug +++ b/src/views/partials/admin/page-admin-circles.pug @@ -1,5 +1,8 @@ div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal - h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.list.title') + div.segment.full.sm-three-quarter + h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='circle.list.title') + div.segment.lg-hidden.sm-quarter.text-right + div.jsMobileRightMenuButton.icon.icon-close.icon-heading div.segment.full.padding-large.padding-top-medium.padding-bottom-xsmall.sm-padding-xsmall.sm-padding-top-xxsmall.whitespace-normal diff --git a/src/views/partials/admin/page-admin-projects-create.pug b/src/views/partials/admin/page-admin-projects-create.pug index 662b5e0..89e76cb 100644 --- a/src/views/partials/admin/page-admin-projects-create.pug +++ b/src/views/partials/admin/page-admin-projects-create.pug @@ -1,8 +1,8 @@ div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey - div.segment.half.sm-full + div.segment.full.sm-three-quarter h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='project.create.title') - div.segment.half.sm-hidden.text-right - solid-link(class="backlink", next=`admin-${getRoute('projects', true)}` data-trans='project.create.backlink') + div.segment.lg-hidden.sm-quarter.text-right + div.jsMobileRightMenuButton.icon.icon-close.icon-heading div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal div.loader.loader-top(id=`loader-admin-${getComponent('projects').uniq}`)