PHPackages                             caiovilanova/cvil-responsive-menu - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. caiovilanova/cvil-responsive-menu

ActiveLibrary[Utility & Helpers](/categories/utility)

caiovilanova/cvil-responsive-menu
=================================

This feature is a set of html, css and js files that create a responsive menu navbar useful for most websites.

1.0.1(3y ago)05MITCSS

Since Jun 15Pushed 3y ago1 watchersCompare

[ Source](https://github.com/caiovilanova/cvil-responsive-menu)[ Packagist](https://packagist.org/packages/caiovilanova/cvil-responsive-menu)[ Docs](http://www.caiovilanova.com)[ RSS](/packages/caiovilanova-cvil-responsive-menu/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (1)DependenciesVersions (2)Used By (0)

Cvil Responsive Menu @caiovilanova
==================================

[](#cvil-responsive-menu--caiovilanova)

\[EN-US\] This feature is a set of html, css and js files that create a responsive menu navbar useful for most websites.

\[PT-BR\] Esta ferramenta é um conjunto de arquivos html, css e js que criam uma navbar com menu responsivo útil para a maioria dos websites.

Installation
------------

[](#installation)

\[EN-US\] CVIL Responsive Menu is available via Composer:

\[PT-BR\] CVIL Menu Responsivo está disponível via Composer:

```
"caiovilanova/cvil-responsive-menu": "1.0.*"

```

or run

```
composer require caiovilanova/cvil-responsive-menu

```

Documentation
-------------

[](#documentation)

#### CSS cvil-menu.css

[](#css-cvil-menucss)

\[EN-US\] This file uses media query to set the screen resolution that adapts desktop to mobile design. It is easily possible to customize the menu by changing the color variables. The navbar is defined with position:absolute but can easily be changed to position:fixed without changing the behavior of the menu.

\[PT-BR\] Este arquivo utiliza media query para definir a resolução de tela que adpata o design de desktop para mobile. É facilmente possível personalizar o menu alterando as variáveis de cor. A navbar está definida com position:absolute mas pode facilmente ser trocado por position:fixed sem alterar o comportamento do menu.

#### JAVASCRIPT cvil-menu.js

[](#javascript-cvil-menujs)

\[EN-US\] This file listens for the menu button and, if enabled, applies styles that (1) remove scrolling from the page; (2) apply a background color to the transparent navbar and (3) Display the list of links filling the entire screen.

\[PT-BR\] Este arquivo ouve o botão do menu e, se ativado, aplica estilos que (1) removem o scrolling da página; (2) aplica uma cor de fundo na navbar transparente e (3) Exibe a lista de links preenchendo todo display.

```
const navbar = document.querySelector('.navbar');
const menuButton = document.querySelector('.navbar-button');
const menuList = document.querySelector('.navbar-list');

menuButton.addEventListener('click', function() {
    navbar.classList.toggle('navbar-mobile-active');
    menuList.classList.toggle('navbar-list-mobile-active');
    document.body.classList.toggle('noScrolling');
});
```

### HTML

[](#html)

\[EN-US\] Deployment in HTML:

\[PT-BR\] Implantação no HTML:

```

        BRAND

            About us
            Services
            Products
            Contact

```

Contributing
------------

[](#contributing)

Contributions are welcome and will be fully credited. We accept contributions via Pull Requests on Github. **Important: Create topic branches, One pull request per feature**

Credits
-------

[](#credits)

- [Caio Vilanova](https://github.com/caiovilanova) (Developer)

License
-------

[](#license)

The MIT License (MIT). Please see [License File](https://github.com/caiovilanova/cvil-responsive-menu/blob/main/LICENSE) for more information.

###  Health Score

21

—

LowBetter than 19% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity4

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity47

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Unknown

Total

1

Last Release

1427d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/9c2c7c4d52d5b3445e36364c3a37d153af6b6f64cc8a1af49c5834df31aba0c1?d=identicon)[caiovilanova](/maintainers/caiovilanova)

---

Top Contributors

[![caiovilanova](https://avatars.githubusercontent.com/u/31299585?v=4)](https://github.com/caiovilanova "caiovilanova (3 commits)")

---

Tags

Caio Vilanovacaiovilanovaresponsive menumenu mobilehtml css navbarresponsive navbar

### Embed Badge

![Health badge](/badges/caiovilanova-cvil-responsive-menu/health.svg)

```
[![Health](https://phpackages.com/badges/caiovilanova-cvil-responsive-menu/health.svg)](https://phpackages.com/packages/caiovilanova-cvil-responsive-menu)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)