bootstrap-layout
Version:
Bootstrap layout with sidebar navigation, sidebar skins, sidebar transition, custom scrollbars, sidebar menus and other advanced features and utilities
142 lines (125 loc) • 7.57 kB
HTML
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>{{ title }} | Bootstrap Layout</title>
{% include 'layouts/_header.html' %}
</head>
<body class="layout-container ls-top layout-sidebar-l3-md-up">
<div class="layout-content" data-scrollable>
<!-- Sidebar toggle -->
<button class="navbar-toggler hidden-lg-up" type="button" data-toggle="sidebar" data-target="#sidebar"><span class="material-icons">menu</span></button>
<div class="container-fluid">
{% block page %}{% endblock %}
</div>
</div>
<!-- Sidebar -->
<div class="sidebar sidebar-left sidebar-visible-md-up sidebar-size-3 sidebar-dark bg-primary" id="sidebar" data-scrollable>
<!-- Brand -->
<a href="{{ path or '' }}index.html" class="sidebar-brand sidebar-brand-bg sidebar-brand-border">Bootstrap Layout</a>
<div class="sidebar-block" style="height: 20px;">
<iframe src="https://ghbtns.com/github-btn.html?user=themekit&repo=bootstrap-layout&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe>
</div>
<ul class="sidebar-menu sm-active-button-bg sm-bordered">
<li class="sidebar-menu-item{% if slug === 'home' %} active{% endif %}">
<a class="sidebar-menu-button" href="{{ path or '' }}index.html">Installation</a>
</li>
</ul>
<div class="sidebar-heading">Components</div>
<ul class="sidebar-menu sm-active-button-bg">
<li class="sidebar-menu-item{% if slug === 'layout/index' or slug === 'layout/nested' %} open{% endif %}">
<a href="#" class="sidebar-menu-button" data-toggle="sidebar-collapse">Layout</a>
<ul class="sidebar-submenu sm-condensed">
<li class="sidebar-menu-item{% if slug === 'layout/index' %} active{% endif %}">
<a href="{{ path or '' }}layout/index.html" class="sidebar-menu-button">Layout component</a>
</li>
<li class="sidebar-menu-item{% if slug === 'layout/nested' %} active{% endif %}">
<a href="{{ path or '' }}layout/nested.html" class="sidebar-menu-button">Nested layouts</a>
</li>
</ul>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/index' or slug === 'sidebar/toggle' or slug === 'sidebar/position' or slug === 'sidebar/size' or slug === 'sidebar/visibility' or slug === 'sidebar/layout' or slug === 'sidebar/skins' %} open{% endif %}">
<a href="#" class="sidebar-menu-button" data-toggle="sidebar-collapse">Sidebar</a>
<ul class="sidebar-submenu sm-condensed">
<li class="sidebar-menu-item{% if slug === 'sidebar/index' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/index.html" class="sidebar-menu-button">Sidebar component</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/toggle' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/toggle.html" class="sidebar-menu-button">Sidebar toggle</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/position' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/position.html" class="sidebar-menu-button">Sidebar position</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/size' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/size.html" class="sidebar-menu-button">Sidebar size</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/visibility' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/visibility.html" class="sidebar-menu-button">Sidebar visibility</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/layout' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/layout.html" class="sidebar-menu-button">Sidebar layout</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/skins' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/skins.html" class="sidebar-menu-button">Sidebar skins</a>
</li>
</ul>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/brand' or slug === 'sidebar/text' or slug === 'sidebar/utilities' %} open{% endif %}">
<a href="#" class="sidebar-menu-button" data-toggle="sidebar-collapse">Sidebar elements</a>
<ul class="sidebar-submenu sm-condensed">
<li class="sidebar-menu-item{% if slug === 'sidebar/brand' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/brand.html" class="sidebar-menu-button">Sidebar brand</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/text' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/text.html" class="sidebar-menu-button">Sidebar text</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar/utilities' %} active{% endif %}">
<a href="{{ path or '' }}sidebar/utilities.html" class="sidebar-menu-button">Sidebar utilities</a>
</li>
</ul>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/index' or slug === 'sidebar-menu/icons' or slug === 'sidebar-menu/utilities' or slug === 'sidebar-menu/submenu' or slug === 'sidebar-menu/collapse' or slug === 'sidebar-menu/dropdown' %} open{% endif %}">
<a href="#" class="sidebar-menu-button" data-toggle="sidebar-collapse">Sidebar menus</a>
<ul class="sidebar-submenu sm-condensed">
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/index' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/index.html" class="sidebar-menu-button">Sidebar menu</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/icons' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/icons.html" class="sidebar-menu-button">Sidebar menu icons</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/utilities' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/utilities.html" class="sidebar-menu-button">Sidebar menu utilities</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/submenu' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/submenu.html" class="sidebar-menu-button">Sidebar submenu</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/collapse' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/collapse.html" class="sidebar-menu-button">Sidebar collapse</a>
</li>
<li class="sidebar-menu-item{% if slug === 'sidebar-menu/dropdown' %} active{% endif %}">
<a href="{{ path or '' }}sidebar-menu/dropdown.html" class="sidebar-menu-button">Sidebar dropdown</a>
</li>
</ul>
</li>
</ul>
<div class="sidebar-heading">Extensions</div>
<ul class="sidebar-menu sm-active-button-bg">
<li class="sidebar-menu-item{% if slug === 'scrollbars' %} active{% endif %}">
<a class="sidebar-menu-button" href="{{ path or '' }}scrollbars.html">Scrollable</a>
</li>
</ul>
<div class="sidebar-block sidebar-b-b sidebar-p-b">
<a target="_blank" href="https://github.com/themekit/bootstrap-layout" class="btn btn-block bg-white">Source on Github</a>
</div>
<div class="sidebar-block">
{% markdown %}[](https://badge.fury.io/js/bootstrap-layout){% endmarkdown %}
</div>
<p class="sidebar-p-b">Get help directly from our team via our Slack channel. <br><a href="http://themekit-slack-invite.stamplayapp.com" target="_blank" class="sidebar-link">Request invite</a></p>
</div>
<!-- // END Sidebar -->
{% include 'layouts/_footer.html' %}
{% block footer %}{% endblock %}
</body>
</html>