From cfd77d1c2abca28c346af4697fb92db98a42f40a Mon Sep 17 00:00:00 2001 From: Simounet Date: Sun, 19 Jan 2020 12:50:08 +0100 Subject: Sticky nav on entry action button click --- app/Resources/static/themes/material/css/nav.scss | 5 +++++ app/Resources/static/themes/material/index.js | 8 ++++++++ .../Resources/views/themes/material/Entry/entry.html.twig | 4 ++-- web/wallassets/material.css | 2 +- web/wallassets/material.js | 2 +- 5 files changed, 17 insertions(+), 4 deletions(-) diff --git a/app/Resources/static/themes/material/css/nav.scss b/app/Resources/static/themes/material/css/nav.scss index 147f163f..b7288278 100644 --- a/app/Resources/static/themes/material/css/nav.scss +++ b/app/Resources/static/themes/material/css/nav.scss @@ -131,6 +131,11 @@ nav { display: none; } +.entry-nav-top--sticky { + position: sticky; + top: 0; +} + @media (min-width: 993px) { .button-collapse { display: none; diff --git a/app/Resources/static/themes/material/index.js b/app/Resources/static/themes/material/index.js index 2926cad1..4b194d00 100755 --- a/app/Resources/static/themes/material/index.js +++ b/app/Resources/static/themes/material/index.js @@ -17,6 +17,13 @@ import './js/shortcuts/entry'; /* Theme style */ import './css/index.scss'; +const stickyNav = () => { + const nav = $('.js-entry-nav-top'); + $('[data-toggle="actions"]').click(() => { + nav.toggleClass('entry-nav-top--sticky'); + }); +}; + $(document).ready(() => { // sideNav $('.button-collapse').sideNav(); @@ -36,6 +43,7 @@ $(document).ready(() => { initFilters(); initExport(); initRandom(); + stickyNav(); const toggleNav = (toShow, toFocus) => { $('.nav-panel-actions').hide(100); diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig index ecd85a84..8cbed436 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig @@ -8,7 +8,7 @@
-