WIP: ThemeProblemSolver #7
@ -19,8 +19,8 @@
|
|||||||
</ItemGroup>
|
</ItemGroup>
|
||||||
|
|
||||||
<ItemGroup>
|
<ItemGroup>
|
||||||
<Reference Include="Oqtane.Client"><HintPath>..\..\oqtane.framework-dev\Oqtane.Server\bin\Debug\net9.0\Oqtane.Client.dll</HintPath></Reference>
|
<Reference Include="Oqtane.Client"><HintPath>..\..\oqtane.framework\Oqtane.Server\bin\Debug\net9.0\Oqtane.Client.dll</HintPath></Reference>
|
||||||
<Reference Include="Oqtane.Shared"><HintPath>..\..\oqtane.framework-dev\Oqtane.Server\bin\Debug\net9.0\Oqtane.Shared.dll</HintPath></Reference>
|
<Reference Include="Oqtane.Shared"><HintPath>..\..\oqtane.framework\Oqtane.Server\bin\Debug\net9.0\Oqtane.Shared.dll</HintPath></Reference>
|
||||||
</ItemGroup>
|
</ItemGroup>
|
||||||
|
|
||||||
<PropertyGroup>
|
<PropertyGroup>
|
||||||
|
|||||||
@ -10,7 +10,7 @@ namespace SZUAbsolventenverein.Theme.Website
|
|||||||
public Oqtane.Models.Theme Theme => new Oqtane.Models.Theme
|
public Oqtane.Models.Theme Theme => new Oqtane.Models.Theme
|
||||||
{
|
{
|
||||||
Name = "SZUAbsolventenverein Website",
|
Name = "SZUAbsolventenverein Website",
|
||||||
Version = "1.0.0",
|
Version = "1.0.10",
|
||||||
PackageName = "SZUAbsolventenverein.Theme.Website",
|
PackageName = "SZUAbsolventenverein.Theme.Website",
|
||||||
ThemeSettingsType = "SZUAbsolventenverein.Theme.Website.ThemeSettings, SZUAbsolventenverein.Theme.Website.Client.Oqtane",
|
ThemeSettingsType = "SZUAbsolventenverein.Theme.Website.ThemeSettings, SZUAbsolventenverein.Theme.Website.Client.Oqtane",
|
||||||
ContainerSettingsType = "SZUAbsolventenverein.Theme.Website.ContainerSettings, SZUAbsolventenverein.Theme.Website.Client.Oqtane",
|
ContainerSettingsType = "SZUAbsolventenverein.Theme.Website.ContainerSettings, SZUAbsolventenverein.Theme.Website.Client.Oqtane",
|
||||||
@ -19,7 +19,9 @@ namespace SZUAbsolventenverein.Theme.Website
|
|||||||
// obtained from https://cdnjs.com/libraries
|
// obtained from https://cdnjs.com/libraries
|
||||||
new Resource { ResourceType = ResourceType.Stylesheet, Url = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap.min.css", Integrity = "sha512-jnSuA4Ss2PkkikSOLtYs8BlYIeeIK1h99ty4YfvRPAlzr377vr3CXDb7sb7eEEBYjDtcYj+AjBH3FLv5uSJuXg==", CrossOrigin = "anonymous" },
|
new Resource { ResourceType = ResourceType.Stylesheet, Url = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap.min.css", Integrity = "sha512-jnSuA4Ss2PkkikSOLtYs8BlYIeeIK1h99ty4YfvRPAlzr377vr3CXDb7sb7eEEBYjDtcYj+AjBH3FLv5uSJuXg==", CrossOrigin = "anonymous" },
|
||||||
new Resource { ResourceType = ResourceType.Stylesheet, Url = "~/Theme.css" },
|
new Resource { ResourceType = ResourceType.Stylesheet, Url = "~/Theme.css" },
|
||||||
new Resource { ResourceType = ResourceType.Script, Url = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js", Integrity = "sha512-7Pi/otdlbbCR+LnW+F7PwFcSDJOuUJB3OxtEHbg4vSMvzvJjde4Po1v4BR9Gdc9aXNUNFVUY+SK51wWT8WF0Gg==", CrossOrigin = "anonymous" }
|
new Resource { ResourceType = ResourceType.Script, Url = "https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js", Integrity = "sha512-7Pi/otdlbbCR+LnW+F7PwFcSDJOuUJB3OxtEHbg4vSMvzvJjde4Po1v4BR9Gdc9aXNUNFVUY+SK51wWT8WF0Gg==", CrossOrigin = "anonymous" },
|
||||||
|
new Resource { ResourceType = ResourceType.Script, Url = "~/menu.js"}
|
||||||
|
|
|||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,30 +1,85 @@
|
|||||||
@namespace SZUAbsolventenverein.Theme.Website
|
@namespace SZUAbsolventenverein.Theme.Website
|
||||||
@inherits ThemeBase
|
@inherits ThemeBase
|
||||||
@inject ISettingService SettingService
|
@inject ISettingService SettingService
|
||||||
|
|
||||||
<div class="wrapper d-flex flex-column min-vh-100">
|
<main role="main">
|
||||||
<main role="main" class="flex-fill">
|
<nav class="navbar navbar-dark bg-primary fixed-top app-navbar">
|
||||||
|
<!-- Logo links -->
|
||||||
|
<div class="d-flex align-items-center gap-2 app-navbar-left">
|
||||||
|
<Logo />
|
||||||
|
</div>
|
||||||
|
|
||||||
<nav class="navigation">
|
<!-- Versteckte Checkbox zum Steuern des Menüs (nur HTML, kein Blazor) -->
|
||||||
<div class="container d-flex justify-content-between align-items-center">
|
<input type="checkbox" id="nav-toggle" class="nav-toggle" />
|
||||||
<a class="navbar-brand" href="https://www.szu-home.at/">
|
|
||||||
<img src="Images/szu-Logo.png" alt="Logo" class="img-fluid" style="max-height: 60px;" />
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<Menu Orientation="Horizontal" />
|
<!-- Burger-Icon, das die Checkbox toggelt -->
|
||||||
|
<label for="nav-toggle" class="nav-toggle-label">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</label>
|
||||||
|
|
||||||
<div class="controls ms-auto">
|
<!-- Menü-Container, der per :checked ein-/ausgeblendet wird -->
|
||||||
<div class="controls-group">
|
<div class="app-menu">
|
||||||
<UserProfile ShowRegister="@_register" />
|
<div class="app-menu-items">
|
||||||
<Login ShowLogin="@_login" />
|
@if (PageState?.Pages != null)
|
||||||
<ControlPanel LanguageDropdownAlignment="right" />
|
{
|
||||||
|
// Diese Seitennamen sollen NICHT im Menü erscheinen
|
||||||
|
var hiddenNames = new[]
|
||||||
|
{
|
||||||
|
"Login", "Register", "Reset", "Profile",
|
||||||
|
"Search", "Privacy", "Terms", "Not Found", "NotFound"
|
||||||
|
};
|
||||||
|
|
||||||
|
@foreach (var page in PageState.Pages
|
||||||
|
.Where(p => p.ParentId == null
|
||||||
|
&& p.IsNavigation
|
||||||
|
&& !p.IsDeleted
|
||||||
|
&& !hiddenNames.Contains(p.Name)))
|
||||||
|
{
|
||||||
|
<div class="nav-item">
|
||||||
|
<a class="nav-link text-white" href="@(@page.Path)">
|
||||||
|
@(@page.Name)
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
|
var children = PageState.Pages
|
||||||
|
.Where(c => c.ParentId == page.PageId
|
||||||
|
&& c.IsNavigation
|
||||||
|
&& !c.IsDeleted
|
||||||
|
&& !hiddenNames.Contains(c.Name));
|
||||||
|
|
||||||
|
if (children.Any())
|
||||||
|
{
|
||||||
|
<div class="app-submenu">
|
||||||
|
@foreach (var child in children)
|
||||||
|
{
|
||||||
|
<div class="nav-item">
|
||||||
|
<a class="nav-link text-white" href="@child.Path">
|
||||||
|
@child.Name
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- WICHTIG: Footer jetzt AUßERHALB von app-menu-items -->
|
||||||
|
<div class="app-menu-footer ">
|
||||||
|
<UserProfile ShowRegister="@_register" />
|
||||||
|
<Login ShowLogin="@_login" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Rechts: ControlPanel + User + Login -->
|
||||||
|
<div class="d-flex align-items-center gap-2 app-navbar-left">
|
||||||
|
<div class="d-flex align-items-center gap-2">
|
||||||
|
<ControlPanel/>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
@ -108,15 +163,9 @@
|
|||||||
</div>
|
</div>
|
||||||
<Pane Name="Bottom Full Width" />
|
<Pane Name="Bottom Full Width" />
|
||||||
</div>
|
</div>
|
||||||
|
<CookieConsent />
|
||||||
<footer class="footer">
|
|
||||||
<div class="text text-center">
|
|
||||||
<p>Impressum | Datenschutz | AGB</p>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
</div>
|
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
public override string Name => "Theme1";
|
public override string Name => "Theme1";
|
||||||
@ -141,8 +190,5 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private void ToggleDropdown()
|
|
||||||
{
|
|
||||||
_showDropdown = !_showDropdown;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,87 +1,35 @@
|
|||||||
/* Oqtane Styles */
|
/* ===========================
|
||||||
html, body {
|
Standard Layout
|
||||||
height: 100%;
|
=========================== */
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigation {
|
|
||||||
max-width: 80vw; /* oder max-width: 100%; */
|
|
||||||
margin: 0 auto;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
z-index: 1000;
|
|
||||||
background-color: #bbb;
|
|
||||||
padding: 1rem 0;
|
|
||||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
||||||
width: 80vw; /* Wichtig! */
|
|
||||||
left: 50%; /* horizontale Zentrierung mit transform */
|
|
||||||
transform: translateX(-50%);
|
|
||||||
border: 3px solid #75767B;
|
|
||||||
border-top: none;
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
padding-top: 100px; /* H<>he der fixierten Navigation kompensieren */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navigation .app-logo .img-fluid {
|
/* Login-Button (Mobile + Desktop) */
|
||||||
max-height: 60px;
|
.app-menu-footer .btn-login,
|
||||||
|
.app-menu-footer .login-btn,
|
||||||
|
.app-menu-footer button,
|
||||||
|
.app-menu-footer a {
|
||||||
|
background-color: #ffffff !important;
|
||||||
|
border: 1px solid #ccc !important;
|
||||||
|
color: #555 !important;
|
||||||
|
padding: 6px 14px !important;
|
||||||
|
border-radius: 6px !important;
|
||||||
|
font-weight: 500 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navigation .app-menu {
|
/* Hover-Effekt */
|
||||||
display: flex;
|
.app-menu-footer .btn-login:hover,
|
||||||
gap: 1rem;
|
.app-menu-footer .login-btn:hover,
|
||||||
}
|
.app-menu-footer button:hover,
|
||||||
|
.app-menu-footer a:hover {
|
||||||
.navigation .nav-item a {
|
background-color: #f2f2f2 !important;
|
||||||
color: black;
|
border-color: #bbb !important;
|
||||||
font-weight: normal;
|
color: #333 !important;
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navigation .nav-item a.active {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Footer */
|
|
||||||
.footer {
|
|
||||||
background-color: #bbb;
|
|
||||||
padding: 1rem 0;
|
|
||||||
text-align: center;
|
|
||||||
border: 3px solid #75767B;
|
|
||||||
border-top: none;
|
|
||||||
border-bottom: none;
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.wrapper {
|
|
||||||
max-width: 80vw; /* max. 80% der Viewport-Breite */
|
|
||||||
margin: 0 auto; /* horizontal zentrieren */
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
main.flex-fill {
|
|
||||||
flex: 1 0 auto; /* Flex-grow 1, flex-shrink 0, flex-basis auto */
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 0; /* Wichtig f<>r flexbox overflow */
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
width: 80vw; /* Fixe Breite 80% Viewport */
|
margin-top: 60px; /* ungefähr Höhe der Navbar */
|
||||||
margin: 0 auto;
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
border: 3px solid #75767B;
|
|
||||||
border-top: none;
|
|
||||||
border-bottom: none;
|
|
||||||
background-color: white;
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* App Logo */
|
/* App Logo */
|
||||||
@ -98,12 +46,18 @@ main.flex-fill {
|
|||||||
background-color: #ffffff !important;
|
background-color: #ffffff !important;
|
||||||
border-width: 0.5px !important;
|
border-width: 0.5px !important;
|
||||||
border-bottom-color: #ccc !important;
|
border-bottom-color: #ccc !important;
|
||||||
|
color: #000 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table .form-select {
|
.table .form-select {
|
||||||
background-color: #ffffff !important;
|
background-color: #ffffff !important;
|
||||||
border-width: 0.5px !important;
|
border-width: 0.5px !important;
|
||||||
border-bottom-color: #ccc !important;
|
border-bottom-color: #ccc !important;
|
||||||
|
color: #000 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-primary {
|
||||||
|
background-color: #b1b0b0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table .btn-primary {
|
.table .btn-primary {
|
||||||
@ -118,6 +72,10 @@ main.flex-fill {
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
background-color: grey;
|
||||||
|
}
|
||||||
|
|
||||||
.controls {
|
.controls {
|
||||||
z-index: 2000;
|
z-index: 2000;
|
||||||
padding-top: 15px;
|
padding-top: 15px;
|
||||||
@ -125,60 +83,242 @@ main.flex-fill {
|
|||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-menu .nav-item {
|
.footer {
|
||||||
font-size: 0.9rem;
|
padding-top: 15px;
|
||||||
padding-bottom: 0.5rem;
|
min-height: 40px;
|
||||||
white-space: nowrap;
|
text-align: center;
|
||||||
|
color: #ffffff;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* ===================================================
|
||||||
|
NAVBAR / BURGER / SIDEBAR
|
||||||
|
=================================================== */
|
||||||
|
|
||||||
|
/* Navbar als durchgehende Flex-Zeile */
|
||||||
|
.app-navbar {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap; /* NICHT umbrechen auf Desktop */
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-navbar-left,
|
||||||
|
.app-navbar-right {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* etwas Luft zwischen Logo und Menü */
|
||||||
|
.app-navbar-left {
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Versteckte Checkbox steuert die Sidebar */
|
||||||
|
.nav-toggle {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Burger-Icon (wird nur auf Mobil eingeblendet) */
|
||||||
|
.nav-toggle-label {
|
||||||
|
display: none; /* nur auf Mobil sichtbar */
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0.25rem 0.5rem;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-toggle-label span {
|
||||||
|
display: block;
|
||||||
|
width: 22px;
|
||||||
|
height: 2px;
|
||||||
|
margin: 4px 0;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menü-Container */
|
||||||
|
.app-menu {
|
||||||
|
display: flex;
|
||||||
|
background-color: #b1b0b0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Bereich für die Seitenlinks – Basis: horizontales Flex */
|
||||||
|
.app-menu-items {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.75rem;
|
||||||
|
align-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Bereich für Login/Register */
|
||||||
|
.app-menu-footer {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Untermenü (Kinder-Seiten) etwas eingerückt */
|
||||||
|
.app-submenu {
|
||||||
margin-left: 1rem;
|
margin-left: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-menu .nav-item a {
|
/* Nav-Items */
|
||||||
border-radius: 4px;
|
.app-menu .nav-item {
|
||||||
height: 3rem;
|
padding-bottom: 0.25rem;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
line-height: 3rem;
|
|
||||||
padding-left: 1rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-menu .nav-item a.active {
|
/* Hover-/Active-Style für Links */
|
||||||
background-color: rgba(255,255,255,0.25);
|
.app-menu .nav-link {
|
||||||
color: white;
|
padding: 6px 12px;
|
||||||
}
|
|
||||||
|
|
||||||
.app-menu .nav-item a:hover {
|
|
||||||
background-color: rgba(255,255,255,0.1);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.app-menu .nav-link .oi {
|
|
||||||
width: 1.5rem;
|
|
||||||
font-size: 1.1rem;
|
|
||||||
vertical-align: text-top;
|
|
||||||
top: -2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-toggler {
|
|
||||||
background-color: #fff;
|
|
||||||
border: 2px solid #75767B;
|
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 0.5rem 0.75rem;
|
transition: background-color 0.2s ease, color 0.2s ease;
|
||||||
margin: .5rem;
|
|
||||||
box-shadow: 0 2px 6px rgba(0,0,0,0.08);
|
|
||||||
transition: background 0.2s, box-shadow 0.2s, border-color 0.2s;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-toggler:hover, .navbar-toggler:focus {
|
.app-menu .nav-link:hover {
|
||||||
background-color: #f0f0f0;
|
background-color: #4a4a4a;
|
||||||
border-color: #444;
|
color: #ffffff !important;
|
||||||
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
}
|
||||||
outline: none;
|
|
||||||
|
.app-menu .nav-link.active {
|
||||||
|
background-color: #3b3b3b;
|
||||||
|
color: #ffffff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* ===========================
|
||||||
|
DESKTOP (ab 768px)
|
||||||
|
=========================== */
|
||||||
|
@media (min-width: 1000px) {
|
||||||
|
|
||||||
|
/* Navbar ist Referenz für die absolute Zentrierung */
|
||||||
|
.app-navbar {
|
||||||
|
display: flex !important;
|
||||||
|
flex-wrap: nowrap !important;
|
||||||
|
align-items: center !important;
|
||||||
|
justify-content: flex-start !important;
|
||||||
|
position: relative !important;
|
||||||
|
min-height: 60px; /* optional: fixe Höhe */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menü nur als Container für den Footer */
|
||||||
|
.app-menu {
|
||||||
|
display: flex !important;
|
||||||
|
flex-direction: row !important;
|
||||||
|
align-items: center !important;
|
||||||
|
flex: 1 1 auto !important;
|
||||||
|
gap: 0.75rem !important;
|
||||||
|
position: static !important;
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* NAV-LINKS: exakt in der Mitte der ganzen Navbar / Seite */
|
||||||
|
.app-menu-items {
|
||||||
|
position: absolute !important;
|
||||||
|
left: 50% !important;
|
||||||
|
top: 50% !important;
|
||||||
|
transform: translate(-50%, -50%) !important;
|
||||||
|
display: flex !important;
|
||||||
|
flex-direction: row !important;
|
||||||
|
flex-wrap: nowrap !important;
|
||||||
|
gap: 0.75rem !important;
|
||||||
|
width: auto !important;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Login/User bleiben im Menü, aber rechts */
|
||||||
|
.app-menu-footer {
|
||||||
|
display: flex !important;
|
||||||
|
gap: 0.75rem !important;
|
||||||
|
margin-left: auto !important; /* schiebt Footer nach rechts */
|
||||||
|
padding: 0 !important;
|
||||||
|
border: none !important;
|
||||||
|
background: none !important;
|
||||||
|
width: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-menu .nav-item {
|
||||||
|
display: inline-block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===========================
|
||||||
|
MOBILE (unter 768px)
|
||||||
|
=========================== */
|
||||||
|
|
||||||
|
@media (max-width: 1000px) {
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Platz unter der Navbar */
|
||||||
|
.content {
|
||||||
|
position: relative;
|
||||||
|
top: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Burger sichtbar machen */
|
||||||
|
.nav-toggle-label {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sidebar-Wrapper rechts */
|
||||||
|
.app-menu {
|
||||||
|
position: fixed;
|
||||||
|
top: 80px; /* Abstand von oben (über der Navbar + Burger) */
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 70%;
|
||||||
|
max-width: 280px;
|
||||||
|
background-color: #b1b0b0;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
padding: 1rem;
|
||||||
|
gap: 0.5rem;
|
||||||
|
transform: translateX(100%);
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
z-index: 1500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Seitenlinks vertikal + scrollbar + zentriert */
|
||||||
|
.app-menu-items {
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
gap: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Footer (Login/Register) fixiert unten */
|
||||||
|
.app-menu-footer {
|
||||||
|
width: 100%;
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
border-top: 1px solid rgba(255, 255, 255, 0.25);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column; /* untereinander statt nebeneinander */
|
||||||
|
gap: 0.5rem; /* Abstand zwischen Host und Logout */
|
||||||
|
justify-content: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Sidebar öffnen/schließen über Checkbox */
|
||||||
|
.nav-toggle:checked ~ .app-menu {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-menu .nav-link {
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
font-size: clamp(12px, 3.5vw, 15px);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -0,0 +1,31 @@
|
|||||||
|
{
|
||||||
|
(function () {
|
||||||
|
function initMobileNavClose() {
|
||||||
|
var toggle = document.getElementById("nav-toggle");
|
||||||
|
if (!toggle) return;
|
||||||
|
|
||||||
|
var elements = document.querySelectorAll(".app-menu a, .app-menu button");
|
||||||
|
elements.forEach(function (el) {
|
||||||
|
el.addEventListener("click", function () {
|
||||||
|
if (window.innerWidth <= 1000) {
|
||||||
|
toggle.checked = false; // Men<65> schlie<69>en
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Beim ersten Laden
|
||||||
|
document.addEventListener("DOMContentLoaded", initMobileNavClose);
|
||||||
|
|
||||||
|
// Falls Oqtane/Blazor sp<73>ter neu rendert, kannst du das bei Bedarf nochmal aufrufen
|
||||||
|
window.initMobileNavClose = initMobileNavClose;
|
||||||
|
})();
|
||||||
|
"exclude" [
|
||||||
|
"**/bin",
|
||||||
|
"**/bower_components",
|
||||||
|
"**/jspm_packages",
|
||||||
|
"**/node_modules",
|
||||||
|
"**/obj",
|
||||||
|
"**/platforms"
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -2,7 +2,7 @@
|
|||||||
<package xmlns="http://schemas.microsoft.com/packaging/2010/07/nuspec.xsd">
|
<package xmlns="http://schemas.microsoft.com/packaging/2010/07/nuspec.xsd">
|
||||||
<metadata>
|
<metadata>
|
||||||
<id>$projectname$</id>
|
<id>$projectname$</id>
|
||||||
<version>1.0.0</version>
|
<version>1.0.10</version>
|
||||||
<authors>SZUAbsolventenverein</authors>
|
<authors>SZUAbsolventenverein</authors>
|
||||||
<owners>SZUAbsolventenverein</owners>
|
<owners>SZUAbsolventenverein</owners>
|
||||||
<title>Website</title>
|
<title>Website</title>
|
||||||
|
|||||||
@ -2,6 +2,6 @@
|
|||||||
set TargetFramework=%1
|
set TargetFramework=%1
|
||||||
set ProjectName=%2
|
set ProjectName=%2
|
||||||
|
|
||||||
XCOPY "..\Client\bin\Debug\%TargetFramework%\%ProjectName%.Client.Oqtane.dll" "..\..\oqtane.framework-dev\Oqtane.Server\bin\Debug\%TargetFramework%\" /Y
|
XCOPY "..\Client\bin\Debug\%TargetFramework%\%ProjectName%.Client.Oqtane.dll" "..\..\oqtane.framework\Oqtane.Server\bin\Debug\%TargetFramework%\" /Y
|
||||||
XCOPY "..\Client\bin\Debug\%TargetFramework%\%ProjectName%.Client.Oqtane.pdb" "..\..\oqtane.framework-dev\Oqtane.Server\bin\Debug\%TargetFramework%\" /Y
|
XCOPY "..\Client\bin\Debug\%TargetFramework%\%ProjectName%.Client.Oqtane.pdb" "..\..\oqtane.framework\Oqtane.Server\bin\Debug\%TargetFramework%\" /Y
|
||||||
XCOPY "..\Client\wwwroot\*" "..\..\oqtane.framework-dev\Oqtane.Server\wwwroot\" /Y /S /I
|
XCOPY "..\Client\wwwroot\*" "..\..\oqtane.framework\Oqtane.Server\wwwroot\" /Y /S /I
|
||||||
@ -3,6 +3,6 @@
|
|||||||
TargetFramework=$1
|
TargetFramework=$1
|
||||||
ProjectName=$2
|
ProjectName=$2
|
||||||
|
|
||||||
cp -f "../Client/bin/Debug/$TargetFramework/$ProjectName$.Client.Oqtane.dll" "../../oqtane.framework-dev/Oqtane.Server/bin/Debug/$TargetFramework/"
|
cp -f "../Client/bin/Debug/$TargetFramework/$ProjectName$.Client.Oqtane.dll" "../../oqtane.framework/Oqtane.Server/bin/Debug/$TargetFramework/"
|
||||||
cp -f "../Client/bin/Debug/$TargetFramework/$ProjectName$.Client.Oqtane.pdb" "../../oqtane.framework-dev/Oqtane.Server/bin/Debug/$TargetFramework/"
|
cp -f "../Client/bin/Debug/$TargetFramework/$ProjectName$.Client.Oqtane.pdb" "../../oqtane.framework/Oqtane.Server/bin/Debug/$TargetFramework/"
|
||||||
Kocoder
commented
Trailing $ wie bei #6 Trailing $ wie bei https://git.kocoder.xyz/Diplomarbeit-Absolventenverein/Theme.SZUAbsolventenverein/pulls/6
|
|||||||
cp -rf "../Server/wwwroot/"* "../../oqtane.framework-dev/Oqtane.Server/wwwroot/"
|
cp -rf "../Server/wwwroot/"* "../../oqtane.framework/Oqtane.Server/wwwroot/"
|
||||||
@ -3,5 +3,5 @@ set TargetFramework=%1
|
|||||||
set ProjectName=%2
|
set ProjectName=%2
|
||||||
|
|
||||||
del "*.nupkg"
|
del "*.nupkg"
|
||||||
"..\..\oqtane.framework-dev\oqtane.package\nuget.exe" pack %ProjectName%.nuspec -Properties targetframework=%TargetFramework%;projectname=%ProjectName%
|
"..\..\oqtane.framework\oqtane.package\nuget.exe" pack %ProjectName%.nuspec -Properties targetframework=%TargetFramework%;projectname=%ProjectName%
|
||||||
XCOPY "*.nupkg" "..\..\oqtane.framework-dev\Oqtane.Server\wwwroot\Packages\" /Y
|
XCOPY "*.nupkg" "..\..\oqtane.framework\Oqtane.Server\wwwroot\Packages\" /Y
|
||||||
@ -1,5 +1,5 @@
|
|||||||
TargetFramework=$1
|
TargetFramework=$1
|
||||||
ProjectName=$2
|
ProjectName=$2
|
||||||
|
|
||||||
"..\..\oqtane.framework-dev\oqtane.package\nuget.exe" pack %ProjectName%.nuspec -Properties targetframework=%TargetFramework%;projectname=%ProjectName%
|
"..\..\oqtane.framework\oqtane.package\nuget.exe" pack %ProjectName%.nuspec -Properties targetframework=%TargetFramework%;projectname=%ProjectName%
|
||||||
cp -f "*.nupkg" "..\..\oqtane.framework-dev\Oqtane.Server\Packages\"
|
cp -f "*.nupkg" "..\..\oqtane.framework\Oqtane.Server\Packages\"
|
||||||
@ -2,7 +2,7 @@ Microsoft Visual Studio Solution File, Format Version 12.00
|
|||||||
# Visual Studio Version 17
|
# Visual Studio Version 17
|
||||||
VisualStudioVersion = 17.13.35825.156 d17.13
|
VisualStudioVersion = 17.13.35825.156 d17.13
|
||||||
MinimumVisualStudioVersion = 10.0.40219.1
|
MinimumVisualStudioVersion = 10.0.40219.1
|
||||||
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Oqtane.Server", "..\oqtane.framework-dev\Oqtane.Server\Oqtane.Server.csproj", "{3AB6FCC9-EFEB-4C0E-A2CF-8103914C5196}"
|
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Oqtane.Server", "..\oqtane.framework\Oqtane.Server\Oqtane.Server.csproj", "{3AB6FCC9-EFEB-4C0E-A2CF-8103914C5196}"
|
||||||
EndProject
|
EndProject
|
||||||
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "SZUAbsolventenverein.Theme.Website.Client", "Client\SZUAbsolventenverein.Theme.Website.Client.csproj", "{AA8E58A1-CD09-4208-BF66-A8BB341FD669}"
|
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "SZUAbsolventenverein.Theme.Website.Client", "Client\SZUAbsolventenverein.Theme.Website.Client.csproj", "{AA8E58A1-CD09-4208-BF66-A8BB341FD669}"
|
||||||
EndProject
|
EndProject
|
||||||
|
|||||||
Reference in New Issue
Block a user
Ich weiß nicht wie sich das Tildezeichen hier verhält. Kann auf Prod eventuell zu Problemen führen, die auf Dev nicht auftreten