diff --git a/static/js/main.js b/static/js/main.js index 5bb8ca6..3c0dab8 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -1,82 +1,81 @@ "use strict"; +// side navigation bar +function toggleSidebar() { + document.getElementById("side-nav").classList.toggle("toggle-active"); + document.getElementById("main").classList.toggle("toggle-active"); + document.getElementById("top-navbar").classList.toggle("toggle-active"); + document.querySelector(".manage-wrap").classList.toggle("toggle-active"); +} + +// ################################# +// popup + +var c = 0; +function pop() { + if (c == 0) { + document.getElementById("popup-box").style.display = "block"; + c = 1; + } else { + document.getElementById("popup-box").style.display = "none"; + c = 0; + } +} + +// const popupMessagesButtons = document.querySelectorAll('popup-btn-messages') + +// popupMessagesButtons.forEach(button, () => { +// button.addEventListener('click', () => { +// document.getElementById('popup-box-messages').style.display = 'none'; +// }) +// }) + +// const popupMessagesButtom = document.getElementById('popup-btn-messages') +// popupMessagesButtom.addEventListener('click', () => { +// document.getElementById('popup-box-messages').style.display = 'none'; +// }) +// ################################## + +// Example starter JavaScript for disabling form submissions if there are invalid fields +// Fetch all the forms we want to apply custom Bootstrap validation styles to +var forms = document.getElementsByClassName("needs-validation"); + +// Loop over them and prevent submission +Array.prototype.filter.call(forms, function (form) { + form.addEventListener( + "submit", + function (event) { + if (form.checkValidity() === false) { + event.preventDefault(); + event.stopPropagation(); + } + form.classList.add("was-validated"); + }, + false + ); +}); +// ################################## + +// extend and collapse +function showCourses(btn) { + var btn = $(btn); + + if (collapsed) { + btn.html('Collapse '); + $(".hide").css("max-height", "unset"); + $(".white-shadow").css({ background: "unset", "z-index": "0" }); + } else { + btn.html('Expand '); + $(".hide").css("max-height", "150"); + $(".white-shadow").css({ + background: "linear-gradient(transparent 50%, rgba(255,255,255,.8) 80%)", + "z-index": "2", + }); + } + collapsed = !collapsed; +} + $(document).ready(function () { - // side navigation bar - function toggleSidebar() { - document.getElementById("side-nav").classList.toggle("toggle-active"); - document.getElementById("main").classList.toggle("toggle-active"); - document.getElementById("top-navbar").classList.toggle("toggle-active"); - document.querySelector(".manage-wrap").classList.toggle("toggle-active"); - } - - // ################################# - // popup - - var c = 0; - function pop() { - if (c == 0) { - document.getElementById("popup-box").style.display = "block"; - c = 1; - } else { - document.getElementById("popup-box").style.display = "none"; - c = 0; - } - } - - // const popupMessagesButtons = document.querySelectorAll('popup-btn-messages') - - // popupMessagesButtons.forEach(button, () => { - // button.addEventListener('click', () => { - // document.getElementById('popup-box-messages').style.display = 'none'; - // }) - // }) - - // const popupMessagesButtom = document.getElementById('popup-btn-messages') - // popupMessagesButtom.addEventListener('click', () => { - // document.getElementById('popup-box-messages').style.display = 'none'; - // }) - // ################################## - - // Example starter JavaScript for disabling form submissions if there are invalid fields - // Fetch all the forms we want to apply custom Bootstrap validation styles to - var forms = document.getElementsByClassName("needs-validation"); - - // Loop over them and prevent submission - Array.prototype.filter.call(forms, function (form) { - form.addEventListener( - "submit", - function (event) { - if (form.checkValidity() === false) { - event.preventDefault(); - event.stopPropagation(); - } - form.classList.add("was-validated"); - }, - false - ); - }); - // ################################## - - // extend and collapse - function showCourses(btn) { - var btn = $(btn); - - if (collapsed) { - btn.html('Collapse '); - $(".hide").css("max-height", "unset"); - $(".white-shadow").css({ background: "unset", "z-index": "0" }); - } else { - btn.html('Expand '); - $(".hide").css("max-height", "150"); - $(".white-shadow").css({ - background: - "linear-gradient(transparent 50%, rgba(255,255,255,.8) 80%)", - "z-index": "2", - }); - } - collapsed = !collapsed; - } - $("#primary-search").focus(function () { $("#top-navbar").attr("class", "dim"); $("#side-nav").css("pointer-events", "none"); diff --git a/templates/core/dashboard.html b/templates/core/dashboard.html index 47fa5e1..716f066 100644 --- a/templates/core/dashboard.html +++ b/templates/core/dashboard.html @@ -59,15 +59,15 @@ display: block; } - .full-screen { + .expand { transform: translateY(100%); position: fixed; bottom: 0; + top: 3rem; left: 0; right: 0; + width: 100%; z-index: 999; - max-width: 100%; - max-height: 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; background-color: #fff; @@ -80,7 +80,7 @@ overflow: auto; } - .full-screen .fa-expand-alt { + .expand .fa-expand-alt { display: block; } @@ -571,12 +571,12 @@