How to make a condition for active menus in gulp-file-include?

S

Sanyok R2021-07-20 14:58:30

gulp.js

Sanyok R, 2021-07-20 14:58:30

Tell me how to pass data to navbar depending on the page?

<!DOCTYPE html>
<html lang="ru" data-color-mode="dark">
<head>
  ...
</head>
<body class="layout">
  
  @@include('header.html')
  @@include('navbar.html')
  @@include('main.html')
  @@include('footer.html')

</body>
</html>

The navbar block - which, depending on the page, changes the active class.

<div class="navbar">
  <div class="navbar__list">
    <a href="#" class="navbar__item active">Главная</a>
    <a href="#" class="navbar__item">О нас</a>
    <a href="#" class="navbar__item">Услуги</a>
    <a href="#" class="navbar__item">Контакты</a>
  </div>
</div>

Thanks for the answer

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

D

dan_mk, 2021-07-22
@dan_mk

<nav>
  <ul>
    <li class="@@activeclassHome">Home</li>
    <li class="@@activeclassAbout">About</li>
  </ul>
</nav>

@@include('_header.html', {activeclassHome": "active", "activeclassAbout": ""})
@@include('_header.html', {activeclassHome": "", "activeclassAbout": "active" })
stackoverflow
can of course be possible to compare variables through @@if in order to apply the required class, but I won’t say for sure