Tweaked moblile layout

HaWeb/README.md

@@ -96,4 +96,5 @@ KOmmentare verschobem 202 Anhang
 935 leeren lettertext löschen
 
 doppel- empfänder sender 876
-Evtl finetuning von note
+Evtl finetuning von note
+Button für forschungbibliografie

HaWeb/Views/Home/Index.cshtml

@@ -3,16 +3,16 @@
     ViewData["SEODescription"] = "Johann Georg Hamann: Kommentierte Edition der Werke und Briefe. Herausgegeben von Janina Reibold und Leonard Keidel.";
 }
 
-<div class="ha-static">
+<div class="ha-static pt-4 md:pt-8">
-    <div class="border border-solid border-gray-300 px-12 py-6 unhyphenate mb-6 desktop:mb-10">
+    <div class="border border-solid border-gray-300 px-4 py-3 md:px-12 md:py-6 unhyphenate mb-6 desktop:mb-10">
         <p>Die Ausgabe ist ein Projekt der Theodor Springmann Stiftung in Kooperation mit dem Germanistischen Seminar der Universität Heidelberg.
         <p><a asp-controller="Home" asp-action="Kontakt" class="dark:text-slate-50 text-hamannSlate-900">Kontakt</a>
     </div>
     <div class="desktop:flex desktop:flex-row desktop:items-stretch desktop:gap-x-10">
 
-        <div class="border border-solid border-gray-300 px-9 py-6 mb-6 desktop:mb-0 desktop:basis-1/2 desktop:grow-1 desktop:shrink-1">
+        <div class="border border-solid border-gray-300 px-4 py-3 md:px-9 md:py-6 mb-6 desktop:mb-0 desktop:basis-1/2 desktop:grow-1 desktop:shrink-1">
             <a asp-controller="Index" asp-action="Index" class="!no-underline !hover:no-underline">
-            <div class="flex flex-row gap-x-3 pb-1">
+            <div class="flex flex-row gap-x-3 pb-1 md:min-h-[4.5rem]">
                 <img src="/img/HKB.png" class="w-10 h-10 desktop:w-16 desktop:h-16 mr-2 border dark:border-none border-gray-300 shadow-sm" alt="HKB-Logo" />
                 <h2 class="!mt-0 !mb-0">Kommentierte Briefausgabe</h2>
             </div>
@@ -25,9 +25,9 @@
             <p><a asp-controller="Edition" asp-action="Editionsgeschichte" class="dark:text-slate-50 text-hamannSlate-900">Editionsgeschichte</a>
         </div>
 
-        <div class="border border-solid border-gray-300 px-9 py-6 mb-10 desktop:mb-0 desktop:basis-1/2 desktop:grow-1 desktop:shrink-1">
+        <div class="border border-solid border-gray-300 px-4 py-3 md:px-9 md:py-6 mb-10 desktop:mb-0 desktop:basis-1/2 desktop:grow-1 desktop:shrink-1">
             <a asp-controller="HKW" asp-action="Index" class="!no-underline !hover:no-underline">
-            <div class="flex flex-row gap-x-3 pb-1">
+            <div class="flex flex-row gap-x-3 pb-1 md:min-h-[4.5rem]">
                 <img src="/img/HKW.png" class="w-10 h-10 desktop:w-16 desktop:h-16 mr-2 border dark:border-none border-gray-300 shadow-sm" alt="HKW-Logo" />
                 <h2 class="!mt-0 !mb-0">Historisch-kritische und kommen&shy;tierte Edition ausgewählter Werke</h2>
             </div>

HaWeb/Views/Shared/_HKBMenu.cshtml

@@ -31,12 +31,15 @@
             </button>
         </div>
         <div class="ha-topnav " id="ha-topnav">
+
             <a class="ha-active-default" asp-controller="Index" asp-action="Index">
                 Suche & Briefauswahl
             </a>
+
             <a asp-controller="Briefe" asp-action="Index">
                 Briefansicht
             </a>
+
             <div class="ha-topnav-dropdown">
                 <a href="/HKB/Register" class="cursor-default ha-menu-arrowsymbol pointer-events-none">
                     Register
@@ -47,6 +50,7 @@
                     <a asp-controller="Register" asp-action="Forschung">Forschungsbibliographie</a>
                 </div>
             </div>
+
              <div class="ha-topnav-dropdown">
                 <a href="/HKB/Edition" class="cursor-default ha-menu-arrowsymbol pointer-events-none !mr-0" >
                 Edition
@@ -59,6 +63,11 @@
                     <a asp-controller="Edition" asp-action="Editionsgeschichte">Editionsgeschichte</a>
                 </div>
             </div>
+
+            <a class="md:!hidden" asp-controller="HKW" asp-action="Index">
+                <img class="inline relative w-4 h-4 -top-1 mr-2" src="/img/HKW.png" alt="HKW-Logo" /> Kritische Werkausgabe (HKW) →
+            </a>
+
         </div>
     </nav>
     <div class="switchsites">

HaWeb/Views/Shared/_HKWLayout.cshtml

@@ -1,24 +1,21 @@
 <!DOCTYPE html>
-<html lang="de" id="top">
+<html class="h-full w-full" lang="de" id="top">
 
 <head>
 @await Html.PartialAsync("/Views/Shared/_Head.cshtml")
 </head>
 
-<body class="w-full ">
+<body class="h-full w-full">
-    <div class="relative min-h-screen">
+    <div class="flex flex-col h-full">
-        <div class="pb-24">
+    @await Html.PartialAsync("/Views/Shared/_HKWMenu.cshtml")
-            @await Html.PartialAsync("/Views/Shared/_HKWMenu.cshtml")
+    <main role="main" class="mb-6 w-full desktop:max-w-screen-desktop mx-auto grow">
-            <main role="main" class="pb-3 w-full desktop:max-w-screen-desktop mx-auto h-full">
+        @RenderBody()
-                @RenderBody()
+    </main>
-            </main>
+    <div class="w-full">
-        </div>
+        @await Html.PartialAsync("/Views/Shared/_Footer.cshtml")
-        <div class="absolute bottom-0 w-full">
-            @await Html.PartialAsync("/Views/Shared/_Footer.cshtml")
-            </div>
-        </div>
-        @await Html.PartialAsync("/Views/Shared/_ScrollButton.cshtml")
     </div>
+    </div>
+    @await Html.PartialAsync("/Views/Shared/_ScrollButton.cshtml")
     @await RenderSectionAsync("JavaScript", false)
 </body>
-</html>
+</html>

HaWeb/Views/Shared/_HKWMenu.cshtml

@@ -67,6 +67,10 @@
                     <a asp-controller="Register" asp-action="Forschung" asp-route-id="EDITIONEN">Bibliographie Hamann-Editionen</a>
                 </div>
             </div>
+
+            <a class="md:!hidden" asp-controller="Index" asp-action="Index">
+                <img class="inline relative w-4 h-4 -top-1 mr-2" src="/img/HKB.png" alt="HKB-Logo" /> Kommentierte Briefausgabe (HKB) →
+            </a>
         </div>
     </nav>
     <div class="switchsites">

HaWeb/Views/Shared/_HomeLayout.cshtml

@@ -1,36 +1,32 @@
 <!DOCTYPE html>
-<html lang="de" id="top">
+<html class="h-full w-full" lang="de" id="top">
 
 <head>
 @await Html.PartialAsync("/Views/Shared/_Head.cshtml")
 </head>
 
-<body class="w-full ">
+<body class="h-full w-full">
-    <div class="relative min-h-screen">
+    <div class="flex flex-col h-full">
-        <div class="pb-24">
+    <header class="w-100 font-serif mb-10 pb-4 pt-4 flex flex-col justify-center bg-slate-50 border-t-[5px] border-gray-300 dark:border-gray-900">
-            <header class="w-100 font-serif mb-10 pb-4 pt-4 flex flex-col justify-center bg-slate-50 border-t-[5px] border-gray-300 dark:border-gray-900">
+        <nav class="w-auto text-xl md:text-3xl text-black hover:text-black mx-auto">
-                <nav class="w-auto text-xl md:text-3xl text-black hover:text-black mx-auto">
+            <a asp-controller="Home" asp-action="Index">
-                    <a asp-controller="Home" asp-action="Index">
+                <span class="sm:hidden">Johan Georg Hamann<br/>Kommentierte Edition der Briefe & Werke</span> 
-                        <span class="sm:hidden">Johan Georg Hamann<br/>Kommentierte Edition der Briefe & Werke</span> 
+                <span class="hidden sm:inline align-baseline">Johann Georg Hamann: Kommentierte Edition der Briefe und Werke</span>
-                        <span class="hidden sm:inline align-baseline">Johann Georg Hamann: Kommentierte Edition der Briefe und Werke</span>
+            </a>
-                    </a>
+            <div class="w-auto mt-2 md:mt-4 overflow-hidden whitespace-nowrap text-ellipsis text-base md:text-lg">
-                    <div class="w-auto mt-2 md:mt-4 overflow-hidden whitespace-nowrap text-ellipsis text-base md:text-lg">
+                <a class="sm:hidden" href="/Edition/Mitwirkende">Hrsg. v. Leonard Keidel und Janina Reibold</a>
-                        <a class="sm:hidden" href="/Edition/Mitwirkende">Hrsg. v. Leonard Keidel und Janina Reibold</a>
+                <a class="hidden sm:inline" href="/Edition/Mitwirkende">Herausgegeben von Leonard Keidel und Janina Reibold</a>
-                        <a class="hidden sm:inline" href="/Edition/Mitwirkende">Herausgegeben von Leonard Keidel und Janina Reibold</a>
-                    </div>
-                </nav>  
-            </header>
-            <main role="main" class="pb-3 w-full desktop:max-w-screen-desktop mx-auto h-full">
-                @* Placeholder Main *@
-                @RenderBody()
-            </main>
-        </div>
-            <div class="absolute bottom-0 w-full">
-                @await Html.PartialAsync("/Views/Shared/_Footer.cshtml")
             </div>
-        </div>
+        </nav>  
-        @await Html.PartialAsync("/Views/Shared/_ScrollButton.cshtml")
+    </header>
+    <main role="main" class="mb-6 w-full desktop:max-w-screen-desktop mx-auto grow">
+        @RenderBody()
+    </main>
+    <div class="w-full">
+        @await Html.PartialAsync("/Views/Shared/_Footer.cshtml")
     </div>
+    </div>
+    @await Html.PartialAsync("/Views/Shared/_ScrollButton.cshtml")
     @await RenderSectionAsync("JavaScript", false)
 </body>
-</html>
+</html>

HaWeb/wwwroot/css/header.css

@@ -95,7 +95,7 @@
   }
 
   header .switchsites {
-    @apply absolute right-0 -bottom-11 
+    @apply hidden md:block absolute right-0 -bottom-11 
   }
 
   header .switchsites .switchsitesbtn {