generated from hjess/PythonTemplateProject
1cb9e066ab
All checks were successful
Build, Push, and Deploy to Nomad / docker-nomad (push) Successful in 33s
105 lines
3.1 KiB
HTML
105 lines
3.1 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<title>{% block title %}PortugalFAQ{% endblock %}</title>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
|
|
<link rel="stylesheet" href="/static/css/main.css">
|
|
<style>
|
|
|
|
/* Modal background with blur effect */
|
|
.modal {
|
|
display: none; /* Hidden by default */
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.3); /* Semi-transparent dark background */
|
|
backdrop-filter: blur(8px); /* Blurs everything behind the modal */
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 999999; /* Ensure it stays on top */
|
|
}
|
|
|
|
/* Modal content */
|
|
.modal-content {
|
|
background-color: #fff;
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
|
|
width: 400px;
|
|
text-align: center;
|
|
z-index: 50000; /* Content stays above the blurred overlay */
|
|
}
|
|
.open {
|
|
transform: rotate(15deg); /* Rotates button 15 degrees */
|
|
}
|
|
.open_inv {
|
|
transform: rotate(-15deg); /* Rotates button 15 degrees */
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body class="is-preload">
|
|
<!-- Wrapper -->
|
|
<div id="wrapper">
|
|
<!-- Main -->
|
|
<div id="main">
|
|
<div class="inner">
|
|
<!-- Header -->
|
|
<header id="header">
|
|
<a href="/" class="logo">
|
|
<strong>{{ page_title }}</strong> af {{ author }}
|
|
</a>
|
|
</header>
|
|
|
|
<!-- Content -->
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Sidebar -->
|
|
<div id="sidebar">
|
|
<div class="inner">
|
|
{% include 'navigation.html' %}
|
|
<!-- Footer -->
|
|
<footer id="footer">
|
|
<p class="copyright">
|
|
© Henriks lille hjørne: <a href="https://lifefaq.i80.dk">LifeFAQ</a>
|
|
</p>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Scripts -->
|
|
<script src="/static/js/jquery.min.js"></script>
|
|
<script src="/static/js/browser.min.js"></script>
|
|
<script src="/static/js/breakpoints.min.js"></script>
|
|
<script src="/static/js/util.js"></script>
|
|
<script src="/static/js/main.js"></script>
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<script>
|
|
// Open a specific modal
|
|
function openModal(modalId) {
|
|
document.getElementById(modalId).style.display = 'flex';
|
|
}
|
|
|
|
// Close a specific modal
|
|
function closeModal(modalId) {
|
|
document.getElementById(modalId).style.display = 'none';
|
|
}
|
|
|
|
// Ensure all modals are hidden on page load
|
|
window.onload = () => {
|
|
const modals = document.querySelectorAll('.modal'); // Select all modals
|
|
modals.forEach(modal => {
|
|
modal.style.display = 'none';
|
|
});
|
|
};
|
|
</script>
|
|
</body>
|
|
</html> |