more commits..
This commit is contained in:
pika
parent
6dda02141e
commit
7823be6481
20 changed files with 1835 additions and 631 deletions
|
|
@ -17,18 +17,11 @@
|
|||
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/modal.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/context-menu.css') }}">
|
||||
|
||||
<!-- Classless CSS Framework -->
|
||||
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/digitallytailored/classless@latest/classless.min.css"> -->
|
||||
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/modal.css') }}">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/context-menu.css') }}">
|
||||
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/mobile-menu.css') }}">
|
||||
<!-- Font Awesome Icons -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
||||
<!-- Classless CSS Framework -->
|
||||
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/digitallytailored/classless@latest/classless.min.css"> -->
|
||||
|
||||
{% block extra_css %}{% endblock %}
|
||||
<!-- JavaScript -->
|
||||
|
|
@ -68,98 +61,112 @@
|
|||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="{{ url_for('dashboard.index') }}">
|
||||
<i class="fas fa-folder-open mr-2"></i>
|
||||
Flask Files
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<!-- Sidebar Navigation -->
|
||||
<aside class="sidebar">
|
||||
<a href="{{ url_for('dashboard.index') }}" class="sidebar-brand">
|
||||
<i class="fas fa-folder-open"></i>
|
||||
Flask Files
|
||||
</a>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarContent">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
{% if current_user.is_authenticated %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('dashboard.index') }}">
|
||||
<i class="fas fa-tachometer-alt mr-1"></i> Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('files.browser') }}">
|
||||
<i class="fas fa-folder mr-1"></i> My Files
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('files.upload') }}">
|
||||
<i class="fas fa-upload mr-1"></i> Upload
|
||||
</a>
|
||||
</li>
|
||||
{% if current_user.is_admin %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('admin.index') }}">
|
||||
<i class="fas fa-cog mr-1"></i> Admin
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" data-toggle="dropdown">
|
||||
<i class="fas fa-user-circle mr-1"></i> {{ current_user.username }}
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-right">
|
||||
<a class="dropdown-item" href="{{ url_for('auth.profile') }}">
|
||||
<i class="fas fa-id-card mr-2"></i> Profile
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
<a class="dropdown-item" href="{{ url_for('auth.logout') }}">
|
||||
<i class="fas fa-sign-out-alt mr-2"></i> Logout
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('auth.login') }}">
|
||||
<i class="fas fa-sign-in-alt mr-1"></i> Login
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="{{ url_for('auth.register') }}">
|
||||
<i class="fas fa-user-plus mr-1"></i> Register
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Flash Messages -->
|
||||
<div class="container mt-4">
|
||||
{% with messages = get_flashed_messages(with_categories=true) %}
|
||||
{% if messages %}
|
||||
{% for category, message in messages %}
|
||||
<div class="alert alert-{{ category if category != 'message' else 'info' }} alert-dismissible fade show">
|
||||
{{ message }}
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
<ul class="sidebar-nav">
|
||||
{% if current_user.is_authenticated %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('dashboard.index') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint == 'dashboard.index' else '' }}">
|
||||
<i class="fas fa-tachometer-alt"></i>
|
||||
Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('files.browser') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint == 'files.browser' else '' }}">
|
||||
<i class="fas fa-folder"></i>
|
||||
My Files
|
||||
</a>
|
||||
</li>
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('files.upload') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint == 'files.upload' else '' }}">
|
||||
<i class="fas fa-upload"></i>
|
||||
Upload
|
||||
</a>
|
||||
</li>
|
||||
{% if current_user.is_admin %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('admin.index') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint.startswith('admin.') else '' }}">
|
||||
<i class="fas fa-cog"></i>
|
||||
Admin
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('auth.logout') }}" class="sidebar-nav-link">
|
||||
<i class="fas fa-sign-out-alt"></i>
|
||||
Logout
|
||||
</a>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('auth.login') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint == 'auth.login' else '' }}">
|
||||
<i class="fas fa-sign-in-alt"></i>
|
||||
Login
|
||||
</a>
|
||||
</li>
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ url_for('auth.register') }}"
|
||||
class="sidebar-nav-link {{ 'active' if request.endpoint == 'auth.register' else '' }}">
|
||||
<i class="fas fa-user-plus"></i>
|
||||
Register
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main role="main" class="container mt-3">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
<div class="main-wrapper">
|
||||
<div class="main-content">
|
||||
{% with messages = get_flashed_messages(with_categories=true) %}
|
||||
{% if messages %}
|
||||
<div class="flash-messages">
|
||||
{% for category, message in messages %}
|
||||
<div class="flash-message {{ category }}">
|
||||
<div class="flash-icon">
|
||||
{% if category == 'success' %}
|
||||
<i class="fas fa-check-circle"></i>
|
||||
{% elif category == 'danger' or category == 'error' %}
|
||||
<i class="fas fa-exclamation-circle"></i>
|
||||
{% elif category == 'warning' %}
|
||||
<i class="fas fa-exclamation-triangle"></i>
|
||||
{% else %}
|
||||
<i class="fas fa-info-circle"></i>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="flash-content">{{ message }}</div>
|
||||
<button class="flash-close">×</button>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer mt-auto py-3 bg-light">
|
||||
<div class="container text-center">
|
||||
<span class="text-muted">© 2023 Flask Files. All rights reserved.</span>
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<span>© {{ current_year }} Flask Files. All rights reserved.</span>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<!-- Include mobile menu for authenticated users -->
|
||||
{% if current_user.is_authenticated %}
|
||||
{% include 'components/mobile_menu.html' %}
|
||||
{% endif %}
|
||||
|
||||
<!-- Add this right before the closing </body> tag -->
|
||||
<div id="upload-overlay" class="upload-overlay">
|
||||
|
|
@ -226,7 +233,42 @@
|
|||
<!-- Custom JavaScript -->
|
||||
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
|
||||
|
||||
<!-- Add our new script files -->
|
||||
<script src="{{ url_for('static', filename='js/modal.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='js/browser.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='js/context-menu.js') }}"></script>
|
||||
|
||||
<!-- Mobile menu script -->
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const mobileFab = document.getElementById('mobile-fab');
|
||||
const mobileMenu = document.getElementById('mobile-menu');
|
||||
|
||||
if (mobileFab && mobileMenu) {
|
||||
mobileFab.addEventListener('click', function () {
|
||||
this.classList.toggle('active');
|
||||
mobileMenu.classList.toggle('active');
|
||||
});
|
||||
|
||||
// Add delay for each menu item to create staggered animation
|
||||
const menuItems = document.querySelectorAll('.mobile-menu-item');
|
||||
menuItems.forEach((item, index) => {
|
||||
item.style.transitionDelay = `${index * 0.05}s`;
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
{% block scripts %}{% endblock %}
|
||||
|
||||
<script>
|
||||
// Close flash messages
|
||||
document.querySelectorAll('.flash-close').forEach(btn => {
|
||||
btn.addEventListener('click', function () {
|
||||
this.closest('.flash-message').remove();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue