added some style for small-devices
This commit is contained in:
@@ -24,13 +24,13 @@
|
||||
<body class="font-sans">
|
||||
<main class="side-panel panel">
|
||||
{% include 'header.html' %}
|
||||
{% include 'side_menu.html'%}
|
||||
<div class="content">
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
{% include 'footer.html' %}
|
||||
</main>
|
||||
{% include 'side_menu.html'%}
|
||||
|
||||
<script>
|
||||
//side menu
|
||||
@@ -38,17 +38,22 @@
|
||||
const sideToggle = document.querySelector('.side-toggle');
|
||||
const sideMenu = document.querySelector('.side-menu');
|
||||
const sideCloseButtons = document.querySelectorAll('.side-close');
|
||||
const toggleButton = document.querySelector('.menu_icon');
|
||||
|
||||
const content = document.querySelector('.content');
|
||||
const headermove = document.getElementById('header');
|
||||
|
||||
sideToggle.addEventListener('click', function() {
|
||||
sideMenu.classList.toggle('active');
|
||||
this.classList.toggle('menu-opened');
|
||||
content.classList.toggle('content-open');
|
||||
headermove.classList.toggle('header-move');
|
||||
});
|
||||
|
||||
sideCloseButtons.forEach(button => {
|
||||
button.addEventListener('click', function() {
|
||||
sideMenu.classList.remove('active');
|
||||
sideToggle.classList.remove('menu-opened');
|
||||
content.classList.remove('content-open');
|
||||
headermove.classList.remove('header-move');
|
||||
});
|
||||
});
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user