Replace barnav woo by that of shop

Hello, I’m looking to modify the “barnav” of the skeleton woo and replace it by the one of the skeleton shop, more precisely I’d like to apply this principle that I find very practical, of a barnav that decreases in size when you scroll down the page.
I identified with the inspector that it is a modification made by the file: scss/template/_header.scss, in the html doc of the inspector it is called “class=’’’’” on line 4 when it is whole and “class=’‘scrolled’’” on line 15 when it is folded.
I found that the default template for the animation is in: scss/template/_extensions.scss
I also found where to change the settings in: css-compiled/template.css
So I created a scss folder in woo and copied and pasted in :_header.scss and _extensions.scss, then I copied and pasted the template.css file into woo’s css.
I then added two lines in: woo/templates/partials/base.html.twig to indicate the files to be used mentioned above, and then I tried to delete pieces of the woo base.html.twig file to replace them by pieces of the shop base.html.twig file, but I can’t get anything.

I am aware that I am not a master, but it is exciting so I try things, and by deduction I learn a little more every day, sometimes it works, and other times my lack of education in this field calls me to order, and blocks me in a dead end, I hope you will be tolerant and understand me.
Despite this, I have a plan in what I am looking for, and within my organization, I am only aiming for the must-have steps of what I would like for my future site.
What I mean is that I won’t ask questions endlessly and in every direction, just to play with Grav’s features.
On the contrary, after several weeks, my vision has been refined and I can now see the main lines of what I want, so my questions will not go beyond these few main lines. And if it can be useful to the understanding of what I want to go towards, I can expose them but I don’t know where in the forum, you will tell me.

To come back to my request for help, I don’t necessarily ask for the ready-made solution, but rather for an indication of where to look and where to modify, then I’ll do some tests.
Thanks in advance. Jef

@jefrey, There are a few things you’ll need to do:

  • You need to mimic the tree of elements around the navbar
  • You need to copy the required css/scss from Shop to Woo. Particularly the css for class “scrolled”.
  • You need to copy the javascript that detects the scrolling and adds/removes class “scrolled” to element <header>.
    You can find this javascript in user/themes/antimatter/js/antimatter.js
    And don’t forget to load the js file in Twig…