html - Bootstrap CDN overwrites despite loading order in Jade, Stylus -
i using stylus , jade frontend. convenience getting bootstrap cdn source , overwriting few rules here , there. of rules okay, can't seem overwrite rule in navbar. changed background-color
fine can't change links in dropdown.
my layout.jade
looks this:
include mixins doctype html head title #{title} - project name link(href='//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css', rel='stylesheet') // js imports script(src='//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js') script(src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js') script(src='https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js') link(rel='stylesheet', href='/stylesheets/style.css') body +nav("project name", "dropdown_menu") +nav_item( "/") home +nav_item( "/about" ) +nav_item( "/" ) contact +nav_item_dropdown( "#" )( label="dropdown") +nav_item( "#" ) action +nav_item( "#" ) action +nav_item( "#" ) else here +nav_divider +nav_header nav header +nav_item( "#" ) separated link +nav_item( "#" ) 1 more separated link header h1 messaging .container .jumbotron h1 hello! .container .row .main-content.col-md-8 block content .sidebar.col-md-4 block sidebar footer p running on node express, jade , stylus
i run own stylesheet last make sure overwrite isn't working. i'm not sure how happen seems right me. bootstrap js
scripts call overwrite when load?
my mixins.jade
follows:
//- navbar mixins mixin nav(name, id, style) - var style = (typeof style === 'undefined') ? "default" : style nav( role="navigation", class=["navbar", "navbar-" + style] ) .navbar-header button.navbar-toggle.collapsed( type="button", data-toggle="collapse", data-target="#" + id, aria-expanded="false", aria-controls="navbar") span.sr-only toggle navigation span.icon-bar span.icon-bar span.icon-bar a.navbar-brand(href="#")= name .collapse.navbar-collapse( id=id ) ul.nav.navbar-nav block mixin nav_item(href, active) li(class=active): a( href=href ) block mixin nav_item_dropdown(href, active) li(class=["dropdown", active]) a.dropdown-toggle( href=href, data-toggle="dropdown", role="button", aria-expanded="false" )= attributes.label span.caret ul.dropdown-menu( role="menu" ) block mixin nav_divider li.divider mixin nav_header li.dropdown-header block //- end navbar mixins
Comments
Post a Comment