Files
noil-client/templates/base.html
2025-08-11 10:19:12 +02:00

92 lines
5.1 KiB
HTML

<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}noil - Edit File Trees Like Text{% endblock %}</title>
<meta name="description" content="{% block description %}noil: The file manager that gives you full control. Edit file operations like text, preview changes, and apply them with confidence.{% endblock %}">
<link rel="stylesheet" href="/static/css/output.css">
<script src="/static/js/htmx.min.js" defer></script>
<script defer data-domain="noil.kjuulh.io" src="https://plausible.front.kjuulh.io/js/script.file-downloads.hash.outbound-links.pageview-props.tagged-events.js"></script>
<script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>
{% block head %}{% endblock %}
</head>
<body class="min-h-screen bg-zinc-950 text-gray-100 antialiased">
<nav class="fixed top-0 w-full bg-zinc-950 border-b border-gray-800 z-50">
<div class="container mx-auto px-4 sm:px-6 py-3 sm:py-4">
<div class="flex items-center justify-between">
<a href="/" class="flex items-center space-x-2">
<span class="text-2xl font-bold bg-gradient-to-r from-emerald-400 to-teal-400 bg-clip-text text-transparent">noil</span>
</a>
<div class="hidden md:flex items-center space-x-6 lg:space-x-8">
<a href="#features" class="text-gray-300 hover:text-white transition-colors">Features</a>
<a href="#installation" class="text-gray-300 hover:text-white transition-colors">Installation</a>
<a href="#configuration" class="text-gray-300 hover:text-white transition-colors">Configuration</a>
<a href="https://git.kjuulh.io/kjuulh/noil" target="_blank" class="text-gray-300 hover:text-white transition-colors flex items-center space-x-1">
<span>Source</span>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
</svg>
</a>
</div>
<button id="mobile-menu-toggle" class="md:hidden text-gray-300 hover:text-white">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
</div>
</div>
<div id="mobile-menu" class="hidden md:hidden bg-zinc-900 border-t border-gray-800">
<div class="container mx-auto px-4 sm:px-6 py-4 space-y-3">
<a href="#features" class="block text-gray-300 hover:text-white transition-colors">Features</a>
<a href="#installation" class="block text-gray-300 hover:text-white transition-colors">Installation</a>
<a href="#configuration" class="block text-gray-300 hover:text-white transition-colors">Configuration</a>
<a href="https://git.kjuulh.io/kjuulh/noil" target="_blank" class="block text-gray-300 hover:text-white transition-colors">Source</a>
</div>
</div>
</nav>
<main class="pt-16">
{% block content %}{% endblock %}
</main>
<footer class="bg-zinc-900 border-t border-gray-800 mt-16 sm:mt-24">
<div class="container mx-auto px-4 sm:px-6 py-6 sm:py-8">
<div class="flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0">
<div class="text-gray-400 text-sm text-center md:text-left">
© 2024 noil. Built with Rust.
</div>
<div class="flex space-x-4 sm:space-x-6">
<a href="https://git.kjuulh.io/kjuulh/noil" target="_blank" class="text-gray-400 hover:text-white transition-colors">
Git
</a>
<a href="https://git.kjuulh.io/kjuulh/noil/issues" target="_blank" class="text-gray-400 hover:text-white transition-colors">
Issues
</a>
</div>
</div>
</div>
</footer>
<script>
document.getElementById('mobile-menu-toggle').addEventListener('click', function() {
document.getElementById('mobile-menu').classList.toggle('hidden');
});
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
const mobileMenu = document.getElementById('mobile-menu');
if (!mobileMenu.classList.contains('hidden')) {
mobileMenu.classList.add('hidden');
}
});
});
</script>
{% block scripts %}{% endblock %}
</body>
</html>