diff --git a/src/index.pug b/src/index.pug index d9e186a..bfcc71b 100644 --- a/src/index.pug +++ b/src/index.pug @@ -47,7 +47,7 @@ html(lang="en") header#header.segment.sm-full.lg-full.padding-left-large.padding-right-large.sm-padding-right-xsmall.sm-padding-left-small.shadow-small.text-disable-selection.bg-color-white include views/partials/header.pug - nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.lg-quarter.jsLeftMenu + nav#main__menu.scrollbar-nav.segment.bg-color-heading.text-top.lg-quarter.text-disable-selection.jsLeftMenu include views/partials/menu-left.pug main#content.segment.lg-three-quarter.sm-full.text-top diff --git a/src/scripts/navigate-event.js b/src/scripts/navigate-event.js index 3154e19..2e167ed 100644 --- a/src/scripts/navigate-event.js +++ b/src/scripts/navigate-event.js @@ -15,6 +15,10 @@ function closeUserControls() { Array.from(document.querySelectorAll(".views-container")).forEach(vC => vC.classList.toggle("sidebar-is-closed") ); + Array.from(document.querySelectorAll(".jsOffsiteToggle")).forEach(el => { + el.querySelector('.text-right').setAttribute('hidden', ''); + el.querySelector('.text-left').removeAttribute('hidden'); + }); Array.from(rightMenu).forEach(el => el.removeAttribute("open")); } } @@ -22,6 +26,10 @@ function closeUserControls() { function openRightMenu() { let rightMenu = document.querySelectorAll(".jsRightMenu"); Array.from(rightMenu).forEach(el => el.setAttribute("open", "")); + Array.from(document.querySelectorAll(".jsOffsiteToggle")).forEach(el => { + el.querySelector('.text-left').setAttribute('hidden', ''); + el.querySelector('.text-right').removeAttribute('hidden'); + }); Array.from(document.querySelectorAll(".views-container")).forEach(vC => vC.classList.toggle("sidebar-is-closed") ); @@ -72,8 +80,7 @@ document.addEventListener("DOMContentLoaded", function() { closeLeftMenu(); } if ( - !event.target.className.includes("jsMobileSidebarOpenButton") && - !event.target.className.includes("jsOffsiteToggle") + !event.target.closest(".jsOffsiteToggle") ) { closeRightMenu(); } diff --git a/src/styles/content/_index.scss b/src/styles/content/_index.scss index 24316ea..d935a63 100644 --- a/src/styles/content/_index.scss +++ b/src/styles/content/_index.scss @@ -75,6 +75,9 @@ main { color: white; background: var(--color-heading); } + solid-link:not([active]):hover { + background: #e4e4e4; + } } &.jsRightMenu:not([open]) { diff --git a/src/styles/header/_index.scss b/src/styles/header/_index.scss index 3b9f0eb..9d57b10 100644 --- a/src/styles/header/_index.scss +++ b/src/styles/header/_index.scss @@ -53,7 +53,7 @@ header { margin-left: -9px; } - &:hover { + &:hover, &:focus { background: white; } diff --git a/src/views/page-admin.pug b/src/views/page-admin.pug index c37c7bc..cd4353a 100644 --- a/src/views/page-admin.pug +++ b/src/views/page-admin.pug @@ -19,12 +19,14 @@ include partials/admin/page-admin-communities.pug #admin-users-create(hidden, data-view="admin-users-create", no-render) include partials/admin/page-admin-users-create.pug - nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') + nav.jsRightMenu.text-disable-selection.sidebar.whitespace-normal(role='navigation') .segment.whitespace-normal.text-color-heading.text-bold ul - li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle - span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall - a(data-trans='admin.menuRight.fold') + li.segment.lg-full.sm-full.padding-small.text-normal.jsOffsiteToggle + span.icon.icon-arrow-left.icon-xsmall.margin-left-xxsmall.text-left + span.text-right(hidden, style='float:right;') + span.icon.icon-arrow-right.icon-xsmall.margin-right-xxsmall + a(data-trans='admin.menuRight.fold') if (endpoints.users || (endpoints.get && endpoints.get.users)) solid-link.segment.lg-full.sm-full(next='admin-communities') li.segment.lg-full.sm-full.padding-medium diff --git a/src/views/page-circle.pug b/src/views/page-circle.pug index 7af750e..8e0abbe 100644 --- a/src/views/page-circle.pug +++ b/src/views/page-circle.pug @@ -11,12 +11,14 @@ #circle-polls(hidden, data-view="circle-polls") include partials/circle/page-circle-polls.pug -nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') +nav.jsRightMenu.text-disable-selection.sidebar.whitespace-normal(role='navigation') solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='circle-chat') ul - li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle - span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall - a(data-trans='circle.menuRight.fold') + li.segment.lg-full.sm-full.padding-small.text-normal.jsOffsiteToggle + span.icon.icon-arrow-left.icon-xsmall.margin-left-xxsmall.text-left + span.text-right(hidden, style='float:right;') + span.icon.icon-arrow-right.icon-xsmall.margin-right-xxsmall + a(data-trans='circle.menuRight.fold') solid-route.segment.lg-full.sm-full(name='circle-chat') li.segment.lg-full.sm-full.padding-medium span.icon.ci-chat.icon-xlarge.margin-right-medium diff --git a/src/views/page-project.pug b/src/views/page-project.pug index cdd30bf..1da5cf2 100644 --- a/src/views/page-project.pug +++ b/src/views/page-project.pug @@ -7,12 +7,14 @@ #project-picture(hidden, data-view="project-picture") include partials/project/page-project-picture.pug -nav.jsRightMenu.sidebar.whitespace-normal(role='navigation') +nav.jsRightMenu.text-disable-selection.sidebar.whitespace-normal(role='navigation') solid-router.segment.whitespace-normal.text-color-heading.text-bold(default-route='project-chat') ul - li.segment.lg-full.sm-full.padding-small.text-right.text-normal.jsOffsiteToggle - span.icon.icon-arrow-right.xxsmall.margin-right-xxsmall - a(data-trans='project.menuRight.fold') + li.segment.lg-full.sm-full.padding-small.text-normal.jsOffsiteToggle + span.icon.icon-arrow-left.icon-xsmall.margin-left-xxsmall.text-left + span.text-right(hidden, style='float:right;') + span.icon.icon-arrow-right.icon-xsmall.margin-right-xxsmall + a(data-trans='project.menuRight.fold') solid-route.segment.lg-full.sm-full(name='project-chat') li.segment.lg-full.sm-full.padding-medium span.icon.ci-chat.icon-xlarge.margin-right-medium diff --git a/src/views/partials/header.pug b/src/views/partials/header.pug index 017615e..7f779b2 100644 --- a/src/views/partials/header.pug +++ b/src/views/partials/header.pug @@ -61,7 +61,7 @@ div li.border-bottom.border-color-grey solid-link.segment.padding-small.text-hover(next='about' data-trans='header.about') li - button.segment.padding-small.text-hover.text-bold.text-color-heading(role='log out' onclick="document.querySelector('sib-auth').logout();" data-trans='header.logOut') + button.segment.padding-small.text-hover.text-semibold.text-color-heading(role='log out' onclick="document.querySelector('sib-auth').logout();" data-trans='header.logOut') button.segment.lg-hidden.icon-menu#toggleMainMenu