Implement templating to avoid copy/paste HTML code. #7

This commit is contained in:
Ian Renton
2025-10-02 11:16:38 +01:00
parent 10f8d9b4ed
commit cc1a7a9b8c
17 changed files with 105 additions and 117 deletions

47
views/webpage_base.tpl Normal file
View File

@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>(S)pothole</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
<link rel="icon" type="image/png" href="img/icon-512.png">
<link rel="alternate icon" type="image/png" href="img/icon-192.png">
<link rel="alternate icon" type="image/png" href="img/icon-32.png">
<link rel="alternate icon" type="image/png" href="img/icon-16.png">
<link rel="alternate icon" type="image/x-icon" href="img/favicon.ico">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment@2.29.4/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
crossorigin="anonymous"></script>
<script src="/js/code.js"></script>
</head>
<body>
<div class="container">
<nav class="navbar navbar-expand-lg navbar-light justify-content-between p-0 border-bottom" style="background-color: white;">
<a class="navbar-brand" href="/">
<img src="/img/logo.png" width="192" height="60" alt="Spothole">
</a>
<ul class="nav nav-pills">
<li class="nav-item"><a href="/about" class="nav-link">About</a></li>
<li class="nav-item"><a href="/apidocs" class="nav-link">API</a></li>
</ul>
</nav>
<main>
{{!base}}
</main>
</div>
</body>
</html>