fix(frontend): added missing js file include for proper bootstrap functionality

feat(frontend): redone navbar
This commit is contained in:
REDCODE
2025-07-15 03:12:41 +02:00
parent 5282dea339
commit d763f640e1
3 changed files with 35 additions and 5 deletions

View File

@@ -20,6 +20,7 @@
<body>
<Routes @rendermode="InteractiveServer"/>
<script src="_framework/blazor.web.js"></script>
<script src="lib/js/bootstrap.bundle.min.js"></script>
</body>
</html>

View File

@@ -1,7 +1,7 @@
@inherits LayoutComponentBase
<div class="navbar">
<div class="container-xxl">
<div class="navbar navbar-expand-sm">
<div class="container-xl">
<a class="mx-2 navbar-brand" href="">
<img src="img/MilkyShotLogoWhite.svg" alt="Milky Shot Logo" class="logo mx-2" href=""/>
<span class="text m-1">Milky Shot</span>
@@ -10,7 +10,7 @@
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<ul class="navbar-nav me-auto mb-2 mb-xl-0">
<li class="nav-item">
<a class="nav-link" href="#">Cosplayers</a>
</li>
@@ -21,6 +21,35 @@
<a class="nav-link" href="#">Photos</a>
</li>
</ul>
@if (loggedIn) {
<button class="btn btn-outline-secondary mx-1">
Login
</button>
<button class="btn btn-outline-secondary mx-1">
Register
</button>
} else {
<form class="d-flex">
<input class="form-control mx-1" type="search" placeholder="Search anything..." aria-label="search"/>
<button class="btn btn-outline-success mx-1" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" class="bi bi-search-heart" viewBox="0 0 16 16">
<path d="M6.5 4.482c1.664-1.673 5.825 1.254 0 5.018-5.825-3.764-1.664-6.69 0-5.018"/>
<path d="M13 6.5a6.47 6.47 0 0 1-1.258 3.844q.06.044.115.098l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1-.1-.115h.002A6.5 6.5 0 1 1 13 6.5M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11"/>
</svg>
</button>
</form>
<div class="mx-2">placeholder-user@(username)</div>
<button class="btn btn-outline-light">
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" class="bi bi-person" viewBox="0 0 16 16">
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6m2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0m4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4m-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10s-3.516.68-4.168 1.332c-.678.678-.83 1.418-.832 1.664z"/>
</svg>
</button>
}
</div>
</div>
</div>
</div>
@code{
bool loggedIn = false;
string username = "Guest";
}

View File

@@ -6,7 +6,7 @@
font-size: 1.1rem;
align-items: center;
flex-direction: row;
filter: drop-shadow(0 0 0.15rem var(--bs-primary));
filter: drop-shadow(0 0 0.1rem var(--bs-light));
}
.logo{