0.0
No commit activity in last 3 years
No release in over 3 years
active navbar is used to set the active menu link, a link becomes active when you click on it.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
2026
 Dependencies

Development

~> 1.7
~> 10.0
 Project Readme

Activenavbar Gem Version Gem Total Downloads

active navbar is used to set the active navbar link, a navbar link becomes active when you click on it.

Installation

The simplest way to install is to use Bundler.

Add this line to your application's Gemfile:

gem 'activenavbar', '~> 1.0.4'

And then execute:

$ bundle

Or install it yourself as:

$ gem install activenavbar

Method

navbar_link(label, path, active_class)
  • label: the link label.
  • path: the link path or controller path.
  • active_class: the style sheet active class.

Usage

Assume we have home, food and beverage page, and have navbar for each page below:

%ul
  %li
    = link_to "Home", homes_path
  %li
    = link_to "Food", foods_path
  %li
    = link_to "Beverage", beverages_path

Assume we have style sheet for navbar below:

ul {
  list-style-type: none;
  overflow: hidden;
}

li {
  float: left;
}

.nav > li > a {
  border-right: 1px solid #A80000;
  padding: 5px;
  color: #000;
}

.nav .active > a,
.nav .active > a:focus {
  color: red;
}

Now we want a navbar link becomes active when we click on it:

%ul
  = navbar_link "Home", root_path, "active"
  = navbar_link '<span class="glyphicon glyphicon-heart"></span> Food', foods_path, "active"
  = navbar_link "Beverage", beverages_path, "active"

Well, Home link becomes active when we click on Home link.

HTML output:

<ul>
  <li class="active"><a href="/">Home</a></li>
  <li class=""><a href="/foods"><span class="glyphicon glyphicon-heart"></span>Food</a></li>
  <li class=""><a href="/beverages">Beverage</a></li>
</ul>

License

MIT License

Copyright (c) 2014 - Present, Bunlong VAN ( Maintainer )