diff options
| author | Aldrik Ramaekers <aldrik@mailbox.org> | 2025-12-05 22:07:23 +0100 |
|---|---|---|
| committer | Aldrik Ramaekers <aldrik@mailbox.org> | 2025-12-05 22:07:23 +0100 |
| commit | 183ac879a0ee74d7bdfabb11c51a29e4a64f1e7f (patch) | |
| tree | 91527955a60919f0d1252c5546f7f05d3e2ee733 /templates/names_template.html | |
Diffstat (limited to 'templates/names_template.html')
| -rw-r--r-- | templates/names_template.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/templates/names_template.html b/templates/names_template.html new file mode 100644 index 00000000..03e617cd --- /dev/null +++ b/templates/names_template.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html lang="en"> + + <style> + .navbar a,a:active,a:hover { + color: black; + text-decoration: underline; + } + + .navbar a::before { + content: '>'; + margin-right: 5px; /* Space between > and link text */ + opacity: 0; /* Initially hidden */ + transition: opacity 0.0s; /* Smooth transition */ + } + + .navbar a::after { + content: '<'; + margin-left: 5px; /* Space between link text and < */ + opacity: 0; /* Initially hidden */ + transition: opacity 0.0s; /* Smooth transition */ + } + + .navbar a:hover::before, + .navbar a:hover::after { + opacity: 1; /* Show on hover */ + } + + p { text-align: center; max-width: 500px; margin:auto; } + .book { + margin-bottom: 30px; + } + + .book>p { + font-style: italic; + padding: 0; + } + a { + text-decoration: none; + } + a:hover { + text-decoration: underline; + } + h1,h2,h3,h4,h5 { text-align: center } + .navbar { + display: block; + margin-left: auto; + margin-right: auto + } + h3 { + margin: 0; + padding: 0; + } + body { + height: 100vh; + justify-content: center; + align-items: center; + margin: 0; + } + .navbar ul { + list-style-type: none; + text-align: center; + padding: 0; + display: flex; + width: 600px; + margin: auto; + } + a,a:active,a:hover { + color: black; + } + + .navbar ul>li { + flex: 1; + } + .navbar a,.navbar a:hover,.navbar a:active { + color: black; + } + </style> + + <head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Ramaekers - Laeven family</title> + </head> + <body> + <main> + <br> + <div class="navbar"> + <ul> + <li><a href="index.html"> Home </a></li> + <li><a href="names.html"> Names </a></li> + <li><a href="photos.html"> Photos </a></li> + <li><a href="info.html"> Info </a></li> + <li><a href="literature.html"> Literature </a></li> + </ul> + </div> + <br> + {{NAME_LIST}} + <br> + </main> + </body> +</html> |