Liftweb snippet for rendering sitemap as navbar with W3.CSS

example.html

<div class="w3-top">
  <div data-lift="W3Navbar?basecol=w3-green;hovercol=w3-hover-black;selectcol=w3-teal">...</div>
</div>

W3Navbar.scala

import net.liftweb.http._
import net.liftweb.sitemap.MenuItem

import scala.xml.NodeSeq

class W3Navbar {

  def ifSelectedColor(kid: MenuItem, color: String): String = {
    kid.current match {
      case true => color
      case false => ""
    }
  }

  def render(in: NodeSeq): NodeSeq = {
    val basecolor = S.attr("basecol") openOr "w3-orange"
    val hovercolor = S.attr("hovercol") openOr "w3-hover-amber"
    val selectedcolor = S.attr("selectcol") openOr "w3-deep-orange"

    val menuEntries =
      (for {sm <- LiftRules.siteMap; req <- S.request} yield sm.buildMenu(req.location).lines) openOr Nil

    <div class={"w3-bar w3-card-4 " + basecolor}>
      {for (item <- menuEntries) yield {
      var styles = item.cssClass openOr ""

      item.kids match {
        case Nil =>
            <a class={hovercolor + " w3-button w3-bar-item " + styles + " " + ifSelectedColor(item, selectedcolor)} href={item.uri}>
              {item.text}
            </a>

        case kids =>
          <div class={styles + " w3-dropdown-hover " + basecolor}>
            <button class={hovercolor + " w3-button " + basecolor} href="#">
              {item.text}
            </button>
            <div class={"w3-dropdown-content w3-bar-block w3-card-4 " + basecolor}>
              {for (kid <- kids) yield {
              <a class={hovercolor + " w3-button w3-bar-item " + styles + " " + ifSelectedColor(kid, selectedcolor)} href={kid.uri}>
                {kid.text}
              </a>
              }}
            </div>
          </div>
      }
    }}
    </div>

  }
}