style
    /*css taken from bootstrap site */
    /* Body and structure
    -------------------------------------------------- */
    body {
      position: relative;
      background-color: #fff;
      padding-top: 90px;
      background-position: 0 40px;
    }


    /* Subnav */
    .subnav {
      width: 100%;
      height: 36px;
      background-color: #eeeeee; /* Old browsers */
      background-repeat: repeat-x; /* Repeat the gradient */
      background-image: -moz-linear-gradient(top, #f5f5f5 0%, #eeeeee 100%); /* FF3.6+ */
      background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
      background-image: -webkit-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* Chrome 10+,Safari 5.1+ */
      background-image: -ms-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* IE10+ */
      background-image: -o-linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* Opera 11.10+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
      background-image: linear-gradient(top, #f5f5f5 0%,#eeeeee 100%); /* W3C */
      border: 1px solid #e5e5e5;
      -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
              border-radius: 4px;
    }
    .subnav .nav {
      margin-bottom: 0;
    }
    .subnav .nav > li > a {
      margin: 0;
      padding-top:    11px;
      padding-bottom: 11px;
      border-left: 1px solid #f5f5f5;
      border-right: 1px solid #e5e5e5;
      -webkit-border-radius: 0;
         -moz-border-radius: 0;
              border-radius: 0;
    }
    .subnav .nav > .active > a,
    .subnav .nav > .active > a:hover {
      padding-left: 13px;
      color: #777;
      background-color: #e9e9e9;
      border-right-color: #ddd;
      border-left: 0;
      -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
         -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
              box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
    }
    .subnav .nav > .active > a .caret,
    .subnav .nav > .active > a:hover .caret {
      border-top-color: #777;
    }
    .subnav .nav > li:first-child > a,
    .subnav .nav > li:first-child > a:hover {
      border-left: 0;
      padding-left: 12px;
      -webkit-border-radius: 4px 0 0 4px;
         -moz-border-radius: 4px 0 0 4px;
              border-radius: 4px 0 0 4px;
    }
    .subnav .nav > li:last-child > a {
      border-right: 0;
    }
    .subnav .dropdown-menu {
      -webkit-border-radius: 0 0 4px 4px;
         -moz-border-radius: 0 0 4px 4px;
              border-radius: 0 0 4px 4px;
    }

    /* Fixed subnav on scroll, but only for 980px and up (sorry IE!) */
    @media (min-width: 980px) {
      .subnav-fixed {
        position: fixed;
        top: 40px;
        left: 0;
        right: 0;
        z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
        border-color: #d5d5d5;
        border-width: 0 0 1px; /* drop the border on the fixed edges */
        -webkit-border-radius: 0;
           -moz-border-radius: 0;
                border-radius: 0;
        -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
           -moz-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
                box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
      }
      .subnav-fixed .nav {
        width: 938px;
        margin: 0 auto;
        padding: 0 1px;
      }
      .subnav .nav > li:first-child > a,
      .subnav .nav > li:first-child > a:hover {
        -webkit-border-radius: 0;
           -moz-border-radius: 0;
                border-radius: 0;
      }
    }

    /* Responsive Docs
    -------------------------------------------------- */
    @media (max-width: 480px) {

      /* Reduce padding above jumbotron */
      body {
        padding-top: 70px;
      }

      /* Change up some type stuff */
      h2 {
        margin-top: 27px;
      }
      h2 small {
        display: block;
        line-height: 18px;
      }
      h3 {
        margin-top: 18px;
      }
    }


    @media (max-width: 768px) {

      /* Remove any padding from the body */
      body {
        padding-top: 0;
      }

      /* Subnav */
      .subnav {
        position: static;
        top: auto;
        z-index: auto;
        width: auto;
        height: auto;
        background: #fff; /* whole background property since we use a background-image for gradient */
        -webkit-box-shadow: none;
           -moz-box-shadow: none;
                box-shadow: none;
      }
      .subnav .nav > li {
        float: none;
      }
      .subnav .nav > li > a {
        border: 0;
      }
      .subnav .nav > li + li > a {
        border-top: 1px solid #e5e5e5;
      }
      .subnav .nav > li:first-child > a,
      .subnav .nav > li:first-child > a:hover {
          -webkit-border-radius: 4px 4px 0 0;
             -moz-border-radius: 4px 4px 0 0;
                  border-radius: 4px 4px 0 0;
      }

    }




    @media (min-width: 768px) and (max-width: 980px) {

      /* Remove any padding from the body */
      body {
        padding-top: 0;
      }
    }



    /* LARGE DESKTOP SCREENS */
    @media (min-width: 1210px) {

      /* Update subnav container */
      .subnav-fixed .nav {
        width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */
      }

    }

    .subnav-fixed-ie {
        position: fixed;
        top: 40px;
        left: 0;
        right: 0;
        z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
        border-color: #d5d5d5;
        border-width: 0 0 1px; /* drop the border on the fixed edges */
        -webkit-border-radius: 0;
           -moz-border-radius: 0;
                border-radius: 0;
        -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
           -moz-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
                box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
      }
      .subnav-fixed-ie .nav {
        width: 938px;
        margin: 0 auto;
        padding: 0 1px;
      }
      .subnav-ie .nav > li:first-child > a,
      .subnav-ie .nav > li:first-child > a:hover {
        -webkit-border-radius: 0;
           -moz-border-radius: 0;
                border-radius: 0;
      }

      .settings .plugin{
        margin-top:10px;
      }
      .settings .plugin-body{
        min-height: 550px;
      }
    .plugin-head .tools {
        top: -15px;
        position: relative;
        cursor: pointer;
    }
    div.thumbnail:hover {
        border-color: #0088cc;
        -webkit-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
        -moz-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
        box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
        cursor: pointer;
    }


-var pluginName = "";

mixin renderNav()
    ul.nav.nav-pills
        - each plugin in plugins
            -var isCurPlugin = req.params.plugin == plugin.id;
            li(class='#{isCurPlugin ? "active" : ""}'): a(href="#{getURL(req, plugin.id)}") #{plugin.name["en_US"]}
            -if(isCurPlugin) pluginName = plugin.name["en_US"]


.subnav
    mixin renderNav()

.row
    .span12
        .plugin
            .navbar-inner.title.plugin-head
                .header #{pluginName}
                !=tools
            .plugin-body
                .content !{pluginHtml}
if showTools
    script
        require(["_", "util", "modal"],function () {
            settingPermissionsModal = new Rocket.Modal({
                id: "editPlugin",
                title: "Manage Permissions",
                width: 0.7
            }),
            settingPermissionsModalBody = settingPermissionsModal.getBody();

            $(".plugin .tools a.edit").click(function (e) {
                var tgt = $(e.currentTarget), id = tgt.data("id");
                e.preventDefault();
                var options = {
                    url: Rocket.Util.getOrigin() + Rocket.PageValues.getPageFriendlyURL() + "/managePlugin/settings/" + id ,
                    data: {redirect: location.href,
                        mode: "exclusive"},
                    success: function (responseData) {
                        if (responseData) {
                            settingPermissionsModal.show();
                            settingPermissionsModalBody.html(responseData);

                        }
                    }
                };
                Rocket.ajax(options);

            });
        });

:script
    require([""],function () {
        // fix sub nav on scroll
        var $win = $(window)
            , $nav = $('.subnav')
            , navTop = $('.subnav').length && $('.subnav').offset().top - 40
            , isFixed = 0

        processScroll();

        // hack sad times - holdover until rewrite for 2.1
        $nav.on('click', function () {
            if (!isFixed) setTimeout(function () {
                $win.scrollTop($win.scrollTop() - 47)
            }, 10)
        })

        $win.on('scroll', processScroll)

        function processScroll() {
            var i, scrollTop = $win.scrollTop()
            if (scrollTop >= navTop && !isFixed) {
                isFixed = 1
                $nav.addClass('subnav-fixed');
            } else if (scrollTop <= navTop && isFixed) {
                isFixed = 0
                $nav.removeClass('subnav-fixed');
            }
        }
    });