From 0945a3a9fc5155fb354230f5b8c6f09bbb00b37a Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Pasquier Date: Tue, 6 Apr 2021 13:58:24 +0200 Subject: [PATCH] fix: mobile white submenu --- src/locales/en.json | 1 + src/locales/es.json | 1 + src/locales/fr.json | 1 + src/styles/left-nav/_index.scss | 13 +++++++++---- src/views/partials/menu-left.pug | 2 ++ 5 files changed, 14 insertions(+), 4 deletions(-) diff --git a/src/locales/en.json b/src/locales/en.json index 428112d..cde20c6 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -25,6 +25,7 @@ "jobBoard": "Job offers", "profileDirectory": "Profiles directory", "projects": "Projects", + "closeMenu": "Close menu", "projectsBrowse": "Browse projects", "projectCreate": "Create project", "circles": "Circles", diff --git a/src/locales/es.json b/src/locales/es.json index e22a1f2..a393f2b 100644 --- a/src/locales/es.json +++ b/src/locales/es.json @@ -25,6 +25,7 @@ "jobBoard": "Ofertas de trabajo", "profileDirectory": "Directorio de miembrxs", "projects": "Proyectos", + "closeMenu": "Cerrar menú", "projectsBrowse": "Examinar los proyectos", "projectCreate": "Crea un proyecto", "circles": "Círculos", diff --git a/src/locales/fr.json b/src/locales/fr.json index 25ba3bd..e58d485 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -25,6 +25,7 @@ "jobBoard": "Offres de mission", "profileDirectory": "Annuaire des membres", "projects": "Projets", + "closeMenu": "Fermer le menu", "projectsBrowse": "Parcourir les projets", "projectCreate": "Créer un projet", "circles": "Cercles", diff --git a/src/styles/left-nav/_index.scss b/src/styles/left-nav/_index.scss index 6dc5c91..0288baf 100644 --- a/src/styles/left-nav/_index.scss +++ b/src/styles/left-nav/_index.scss @@ -116,10 +116,12 @@ nav#main__menu { margin-right: 5px; } - /* For the icon and the small sub-sub-menu*/ - &:not(:hover) .menu-options, - &:not(:hover) .menu-admin { - display: none; + @media (min-width: 768.01px) { + + &:not(:hover) .menu-options, + &:not(:hover) .menu-admin { + display: none; + } } .menu-options { @@ -140,6 +142,9 @@ nav#main__menu { height: 9vh; top: 0; text-align: center; + position: fixed; + top: 50px; + height: calc(100% - 50px); } } } diff --git a/src/views/partials/menu-left.pug b/src/views/partials/menu-left.pug index a523d5e..ffe7fca 100644 --- a/src/views/partials/menu-left.pug +++ b/src/views/partials/menu-left.pug @@ -33,6 +33,7 @@ solid-router#navbar-router(default-route='dashboard') div.menu-options.segment.jsMenuOption div.menu-icon.icon.icon-small.icon-options-vertical div.menu-admin.segment.bg-color-white.shadow.text-color-secondary.padding-xxsmall.whitespace-normal.hidden.jsMenuAdmin + span.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall.lg-hidden(data-trans="menuLeft.closeMenu" onclick="this.parentElement.classList.toggle('hidden', true)") solid-link.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall(next=`admin-${component.route}` data-trans="menuLeft.circlesBrowse") solid-link.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall(next=`admin-${component.route}-create` data-trans="menuLeft.circleCreate") solid-badge.badge(data-type="Mention" data-rdf-type="hd:circle") @@ -99,6 +100,7 @@ solid-router#navbar-router(default-route='dashboard') div.menu-options.segment.jsMenuOption div.menu-icon.icon.icon-small.icon-options-vertical div.menu-admin.segment.bg-color-white.shadow.text-color-secondary.padding-xxsmall.whitespace-normal.hidden.jsMenuAdmin + span.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall.lg-hidden(data-trans="menuLeft.closeMenu" onclick="this.parentElement.classList.toggle('hidden', true)") solid-link.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall(next=`admin-${component.route}` data-trans="menuLeft.projectsBrowse") solid-link.segment.full.one-line-ellipsis.padding-xxsmall.sm-padding-xsmall(next=`admin-${component.route}-create` data-trans="menuLeft.projectCreate") solid-badge.badge(data-type="Mention" data-rdf-type="hd:project")