add: fontawesome
fix: navbar (now sidebar)
This commit is contained in:
parent
ac5354a601
commit
0bb3d93704
6 changed files with 59 additions and 88 deletions
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
|
@ -0,0 +1 @@
|
||||||
|
fontawesome/
|
|
@ -3,11 +3,6 @@ body, #wrapper
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer
|
|
||||||
{
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-fill
|
.flex-fill
|
||||||
{
|
{
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
|
4
js/core-functions.js
Normal file
4
js/core-functions.js
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
$("#menu-toggle").click(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
$("#wrapper").toggleClass("toggled");
|
||||||
|
});
|
|
@ -17,31 +17,32 @@
|
||||||
{% block stylesheets %}
|
{% block stylesheets %}
|
||||||
{# do assets.addCss('https://unpkg.com/purecss@1.0.0/build/pure-min.css', 100) #}
|
{# do assets.addCss('https://unpkg.com/purecss@1.0.0/build/pure-min.css', 100) #}
|
||||||
{% do assets.addCss('https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', 100) %}
|
{% do assets.addCss('https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', 100) %}
|
||||||
{% do assets.addCss('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', 99) %}
|
{% do assets.addCss('theme://fontawesome/css/all.css', 99) %}
|
||||||
{% do assets.addCss('theme://css/custom.css', 96) %}
|
{% do assets.addCss('theme://css/custom.css', 96) %}
|
||||||
|
{% do assets.addCss('theme://css/sidebar.css', 96) %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block javascripts %}
|
{% block javascripts %}
|
||||||
{% do assets.addJs('jquery', 100) %}
|
{% do assets.addJs('jquery', 100) %}
|
||||||
{% do assets.addJs('https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js', 99) %}
|
{% do assets.addJs('https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js', 99) %}
|
||||||
|
{% do assets.addJs('theme://js/core-functions.js', 98) %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block assets deferred %}
|
{% block assets_css %}
|
||||||
{{ assets.css()|raw }}
|
{{ assets.css()|raw }}
|
||||||
{{ assets.js()|raw }}
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body id="top" class="{{ page.header.body_classes }}">
|
<body>
|
||||||
<div id="wrapper" class="d-flex flex-column">
|
<div id="wrapper" class="d-flex flex-column">
|
||||||
{% block body %}
|
|
||||||
<main class="container py-3 flex-fill">
|
|
||||||
{% block header %}
|
|
||||||
{% include 'partials/navbar.html.twig' %}
|
{% include 'partials/navbar.html.twig' %}
|
||||||
{% endblock %}
|
<div class="content-wrapper flex-fill">
|
||||||
|
<main class="container-fluid py-3 clearfix">
|
||||||
|
<div class="container">
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
|
</div>
|
||||||
</main>
|
</main>
|
||||||
{% endblock %}
|
</div>
|
||||||
|
<footer class="container-fluid w-100 bg-dark text-light py-3 content-wrapper">
|
||||||
{% block footer %}
|
{% block footer %}
|
||||||
<footer class="container-fluid bg-dark text-light py-3">
|
<footer class="container-fluid bg-dark text-light py-3">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
@ -55,10 +56,16 @@
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% block bottom %}
|
{% block bottom %}
|
||||||
{{ assets.js('bottom')|raw }}
|
{{ assets.js('bottom')|raw }}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
{% block assets_js deferred %}
|
||||||
|
{{ assets.js()|raw }}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,14 +1,9 @@
|
||||||
{% set logo = theme_var(mobile ? 'custom_logo_mobile' : 'custom_logo') %}
|
{% set logo = theme_var(mobile ? 'custom_logo_mobile' : 'custom_logo') %}
|
||||||
<a href="{{ home_url }}" class="navbar-brand mr-10">
|
<a href="{{ home_url }}" class="navbar-brand mr-10">
|
||||||
<div class="float-left">
|
|
||||||
{% if logo %}
|
{% if logo %}
|
||||||
{% set logo_file = (logo|first).name %}
|
{% set logo_file = (logo|first).name %}
|
||||||
<img src="{{ url('theme://images/logo/' ~ logo_file) }}" />
|
<img src="{{ url('theme://images/logo/' ~ logo_file) }}" />
|
||||||
{% else %}
|
{% else %}
|
||||||
<img src="{{ url('theme://images/ro-logo.svg') }}" />
|
<img src="{{ url('theme://images/ro-logo.svg') }}" />
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
|
||||||
<div class="ml-2 float-right">
|
|
||||||
Reitanlage<br>Oranienburg
|
|
||||||
</div>
|
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -1,50 +1,19 @@
|
||||||
{% macro loop(page) %}
|
<nav id="sidebar-wrapper" class="navbar bg-dark">
|
||||||
{% for p in page.children.visible %}
|
<div id="menu-toggle">
|
||||||
{% set current_page = (p.active or p.activeChild) ? 'selected' : '' %}
|
<div id="menu-toggle-icon">
|
||||||
{% if p.children.visible.count > 0 %}
|
<i class="fas fa-2x fa-bars"></i>
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="{{ p.url }}" role="button" aria-haspopup="true" aria-expanded="false">{{ p.menu }}</a>
|
|
||||||
<div class="dropdown-menu">
|
|
||||||
{{ _self.loop(p) }}
|
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</div>
|
||||||
{% else %}
|
<ul class="sidebar-nav">
|
||||||
<li class="nav-item">
|
<li class="sidebar-spacer"></li>
|
||||||
<a class="nav-link" href="{{ p.url }}">{{ p.menu }}</a>
|
<li class="sidebar-brand">
|
||||||
</li>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
{% endmacro %}
|
|
||||||
|
|
||||||
<nav class="navbar navbar-light navbar-expand-sm bg-light sticky-top">
|
|
||||||
<div class="container-fluid">
|
|
||||||
<div class="navbar-header">
|
|
||||||
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#collapsing_navbar">
|
|
||||||
<span class="navbar-toggler-icon"></span>
|
|
||||||
</button>
|
|
||||||
{% include 'partials/logo.html.twig' %}
|
{% include 'partials/logo.html.twig' %}
|
||||||
</div>
|
</li>
|
||||||
{% block header_navigation %}
|
|
||||||
<div class="navbar-collapse collapse" id="collapsing_navbar">
|
|
||||||
<ul class="nav navbar-nav">
|
|
||||||
{% if theme_config.dropdown.enabled %}
|
|
||||||
{{ _self.loop(pages) }}
|
|
||||||
{% else %}
|
|
||||||
{% for page in pages.children.visible %}
|
{% for page in pages.children.visible %}
|
||||||
{% set current_page = (page.active or page.activeChild) ? 'selected' : '' %}
|
{% set current_page = (page.active or page.activeChild) ? 'selected' : '' %}
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
<a class="nav-link" href="{{ page.url }}">{{ page.menu }}</a>
|
<a class="nav-link" href="{{ page.url }}" {{ current_page }}>{{ page.menu }}</a>
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
{% endif %}
|
|
||||||
{% for mitem in site.menu %}
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="{{ mitem.url }}">{{ mitem.text }}</a>
|
|
||||||
</li>
|
</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
|
||||||
{% endblock %}
|
|
||||||
</div>
|
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue