I have this login page, which is linked to by the index.html file login page html:
<!DOCTYPE html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="login.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tauri App</title>
<script type="module" src="login.js" defer></script>
<style>
.logo.vanilla:hover {
filter: drop-shadow(0 0 2em #ffe21c);
}
</style>
</head>
<body>
<div class="container">
<h1>Wilkommen zu *kein Name*!</h1>
<div class="login_form">
<form action="action_page.php" method="post">
<div class="imgcontainer">
<img src="..../assets/img_avatar2.png" alt="Avatar" class="avatar">
</div>
<div class="container">
<label for="uname"><b>Benutzername</b></label>
<input type="text" placeholder="Benutzername eingeben" name="uname" required>
<label for="psw"><b>Passwort</b></label>
<input type="password" placeholder="Passwort eingeben" name="psw" required>
<button type="submit">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember"> Remember me
</label>
</div>
<div class="container" style="background-color:#f1f1f1">
<a href="/src/index.html">
<button type="button" class="cancelbtn"">Abbrechen</button>
</a>
<span class="psw"><a href="#">Passwort</a> vergessen?</span>
</div>
</form>
</div>
</body>
index page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="styles.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Tauri App</title>
<script type="module" src="/main.js" defer></script>
<style>
.logo.vanilla:hover {
filter: drop-shadow(0 0 2em #ffe21c);
}
</style>
</head>
<body>
<div class="login_form">
<a href="./ui/login/login.html">Login</a>
</div>
</body>
</html>
The Tauri app starts on the index file, which has a hyperlink to "./ui/login/login.html" (The login page) When I click on the link to the login page, everything works fine. The login page itself also has a hyperlink, for the Cancel button (Abbrechen), which leads back to the homepage. However, when this link is used, it's as if the CSS was never there. (the CSS is not applied, and background color, text styling, etc. just ceases to exist) Also, the hyperlink stops working.
screenshots:
start of app (no hyperlink to index page): (https://i.stack.imgur.com/dUimz.png) when hyperlink to index page is used: (https://i.stack.imgur.com/ZG5zA.png)
Is it possible that there is a typo with
<a href="/src/index.html">and that it should link to<a href="index.html">instead?