Add dark mode

This commit is contained in:
James Musselman 2023-11-30 01:32:08 -06:00
parent bcd45d9006
commit 2588ef9729
5 changed files with 72 additions and 36 deletions

View file

@ -1,20 +1,21 @@
<!DOCTYPE html>
<html lang="en_US">
<html lang="en_US" data-bs-theme="dark">
<head>
<title>Notatio</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="/static/favicon.ico" type="image/x-icon">
<!-- Font Awesome CSS for spinner -->
<link rel="stylesheet" type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" type="text/css"
<link rel="stylesheet" type="text/css"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
</head>
<body class="d-flex flex-column min-vh-100 ">
<nav class="navbar navbar-expand-lg navbar-light bg-light border-bottom p-2">
<nav class="navbar navbar-expand-lg border-bottom p-2">
<a class="navbar-brand" href="/">
<img src="/static/favicon.ico" alt="" width="24" height="24" class="d-inline-block align-text-top">
Notatio
@ -31,6 +32,10 @@
<li class="nav-item">
<a class="nav-link" href="#" data-bs-toggle="modal" data-bs-target="#signupModal">Sign up</a>
</li>
<li class="nav-item">
<button id="darkModeButton" class="btn">
<i id="darkModeIcon" class="fas fa-sun"></i>
</button>
</ul>
</div>
</nav>
@ -44,7 +49,7 @@
Notatio provides a user-friendly interface combined with robust features, making it the perfect choice for
developers, writers, and anyone who interacts with text on a daily basis.
</p>
<p><strong>Notatio is alpha software! Do not use it as your daily driver!</strong></p>
<p><strong>Notatio is <u>currently</u> an alpha software! Do not use it as your daily driver!</strong></p>
<h1 class="mt-4">Text Editor Comparison</h1>
<div class="table-responsive">
@ -206,7 +211,7 @@
</div>
</main>
<footer class="footer mt-auto">
<div class="container d-flex justify-content-center py-3 bg-light ">
<div class="container d-flex justify-content-center py-3">
<a href="https://codeberg.org/notatio/notatio#download" class="mx-2 text-muted">Download</a>
<a href="https://codeberg.org/notatio/notatio/wiki" class="mx-2 text-muted">Documentation</a>
<a href="https://codeberg.org/notatio/notatio/issues" class="mx-2 text-muted">Report Issues</a>
@ -215,6 +220,7 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="/static/build/index.js" type="text/javascript"></script>
<script src="/static/build/darkmode.js" type="text/javascript"></script>
</body>
</html>