218 lines
12 KiB
HTML
218 lines
12 KiB
HTML
{{define "base"}}
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{{block "title" .}}CMC Sales{{end}}</title>
|
|
|
|
<!-- Tailwind CSS CDN -->
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
cmcblue: '#4686c3',
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
/* Additional CSS to assist with more complicated transitions for the nav bar items */
|
|
.navbar-dropdown {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
transition: opacity 80ms ease, visibility 80ms ease;
|
|
}
|
|
.group:hover .navbar-dropdown,
|
|
.group:focus-within .navbar-dropdown {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
}
|
|
</style>
|
|
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
|
<!-- HTMX -->
|
|
<script src="https://unpkg.com/htmx.org@1.9.10"></script>
|
|
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="/static/css/style.css">
|
|
|
|
{{block "head" .}}{{end}}
|
|
</head>
|
|
<body class="min-h-screen flex flex-col">
|
|
<!-- Cute Light Blue Navigation -->
|
|
<nav class="bg-cmcblue shadow flex items-center justify-between px-4 py-2" role="navigation" aria-label="main navigation">
|
|
<div class="flex items-center space-x-2">
|
|
<a class="flex items-center space-x-2 text-white font-bold text-lg" href="/">
|
|
<span><i class="fas fa-flask text-cmcblue bg-white rounded p-1"></i></span>
|
|
<span>CMC Sales</span>
|
|
</a>
|
|
<span class="mx-4 h-8 w-px bg-white opacity-40"></span>
|
|
</div>
|
|
<div class="flex-1 flex items-center">
|
|
<ul class="flex space-x-2">
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/enquiries/index">
|
|
<span>Enquiries</span>
|
|
<span><i class="ml-1 fas fa-envelope text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/enquiries/index">Enquiry Register</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/go/quotes">Quotes Expiring</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/documents/index">
|
|
<span>Documents</span>
|
|
<span><i class="ml-1 fas fa-file-alt text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/documents/index">Documents Index</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/jobs/index">
|
|
<span>Jobs</span>
|
|
<span><i class="ml-1 fas fa-briefcase text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/jobs/reports">Reports</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/jobs/index">Job List</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/shipments/index">
|
|
<span>Shipments</span>
|
|
<span><i class="ml-1 fas fa-truck text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-64 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/index">All Shipments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/index/import">Import Shipments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/index/direct">Direct Shipments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/index/export">Export Shipments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/index/local">Local Shipments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/shipments/reports">Monthly Deferred GST</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/freight_forwarders">Freight Forwarders</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/customers/index">
|
|
<span>Customers</span>
|
|
<span><i class="ml-1 fas fa-users text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-56 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/customers/index">Customer Index</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/customers/add">Add Customer</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/industries/index">Industries</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/purchase_orders/index">
|
|
<span>POs</span>
|
|
<span><i class="ml-1 fas fa-file-invoice text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/purchase_orders/index">PO Index</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/invoices/index">
|
|
<span>Invoices</span>
|
|
<span><i class="ml-1 fas fa-receipt text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-56 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/invoices/index">Invoices Index</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/invoices/printView">Print View</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/products/index">
|
|
<span>Products</span>
|
|
<span><i class="ml-1 fas fa-box text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/products/index">Product Index</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/products/add">Add Product</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/principles/index">
|
|
<span>Principles</span>
|
|
<span><i class="ml-1 fas fa-user-tie text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-56 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/principles/index">Principle Index</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/attachments/index">Attachments</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/principles/add">Add Principle</a></li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/enquiries/search" id="searchLink">
|
|
<span>Search</span>
|
|
<span><i class="ml-1 fas fa-search text-white"></i></span>
|
|
</a>
|
|
</li>
|
|
<li class="relative group">
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/pages/about">
|
|
<span>Help</span>
|
|
<span><i class="ml-1 fas fa-question-circle text-white"></i></span>
|
|
</a>
|
|
<ul class="navbar-dropdown absolute left-0 top-[calc(100%_-_2px)] w-48 bg-white shadow-lg rounded z-10">
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/pages/bug">Raise a bug</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="https://gitlab.com/minimalist.software/cmc-sales/issues">Issue tracker</a></li>
|
|
<li><a class="block px-4 py-2 text-cmcblue hover:bg-cmcblue/10" href="/pages/about">About</a></li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a class="flex items-center space-x-1 text-white px-2 py-1 bg-cmcblue cursor-pointer rounded transition duration-200 ease-in-out" href="/admin">
|
|
<span>Admin</span>
|
|
<span><i class="ml-1 fas fa-cog text-white"></i></span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="flex items-center space-x-2">
|
|
<span><i class="fas fa-user text-cmcblue bg-white rounded p-1"></i></span>
|
|
<span class="text-white">{{if .User}}{{.User}}{{else}}Guest{{end}}</span>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<section class="section flex-1">
|
|
<div class="container p-4">
|
|
{{block "content" .}}{{end}}
|
|
</div>
|
|
</section>
|
|
<!-- Footer -->
|
|
<footer class="bg-slate-500 text-white text-center py-2 text-sm mt-8 w-full">
|
|
<strong>CMC Sales</strong> © {{ currentYear }}
|
|
</footer>
|
|
|
|
<!-- Custom JS -->
|
|
<script src="/static/js/app.js"></script>
|
|
|
|
<!-- Navbar toggle script -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
|
|
|
|
$navbarBurgers.forEach( el => {
|
|
el.addEventListener('click', () => {
|
|
const target = el.dataset.target;
|
|
const $target = document.getElementById(target);
|
|
el.classList.toggle('is-active');
|
|
$target.classList.toggle('is-active');
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
|
|
{{block "scripts" .}}{{end}}
|
|
</body>
|
|
</html>
|
|
{{end}} |