Sidebar nav styling changes (#751)

* Sidebar nav styling changes

* revert

Author: reakaleek

src/Elastic.Markdown/Slices/Layout/_TableOfContents.cshtml

@@ -6,7 +6,7 @@
 			{
 				<div class="mb-4">
 					<div class="font-bold mb-2">On this page</div>
-					<ul class="block w-full relative">
+					<ul class="block w-full relative font-body">
 						<div class="toc-progress-indicator absolute top-0 h-0 left-2 w-[1px] bg-blue-elastic transition-all duration-200 ease-out "></div>
 						@foreach (var item in Model.PageTocItems)
 						{

src/Elastic.Markdown/Slices/Layout/_TocTree.cshtml

@@ -1,14 +1,14 @@
 @using Elastic.Markdown.Helpers
 @inherits RazorSlice<NavigationViewModel>
-<div class="pt-6 pb-20">
+<div class="pt-6 pb-20 font-body">
 
 	@{
 		var current = Model.TopLevelItems.FirstOrDefault(i => i.Id == Model.Tree.Id);
 	} 
 
 	@if (Model.Features.IsPrimaryNavEnabled)
 	{
-		<details class="block group border-b-1 border-grey-20 pb-6">
+		<details class="block group border-b-1 border-grey-20 pb-8 font-sans">
 			<summary class="inline-grid md:grid grid-cols-[1fr_auto] cursor-pointer font-semibold gap-2 hover:text-black">
 				<span>
 					@current?.Group.Index?.NavigationTitle

src/Elastic.Markdown/Slices/Layout/_TocTreeNav.cshtml

@@ -11,7 +11,7 @@
 	if (item is FileNavigation file && Model.SubTree.Index?.FileName != file.File.FileName)
 	{
 		var f = file.File;
-		<li class="flex group/li @(item.Depth == topLevelFile ? "font-semibold py-6 not-last:border-b-1 border-grey-20" : "ml-5 lg:ml-4 mt-4 lg:mt-3")">
+		<li class="flex group/li @(item.Depth == topLevelFile ? "font-semibold py-8 not-last:border-b-1 border-grey-20" : "ml-5 lg:ml-4 mt-4 lg:mt-3")">
 				<a
 					hx-get="@f.Url"
 					hx-select-oob="@Htmx.GetHxSelectOob(Model.Features, Model.CurrentDocument.UrlPathPrefix, Model.CurrentDocument.Url, f.Url)"
@@ -35,7 +35,7 @@
 		var g = folder.Group;
 		// const int initialExpandLevel = 3;
 		// var shouldInitiallyExpand = g.Depth <= initialExpandLevel;
-		<li class="flex flex-wrap group-navigation @(g.Depth == topLevelGroup ? "py-6 not-last:border-b-1 border-grey-20" : "mt-4 lg:mt-3")">
+		<li class="flex flex-wrap group-navigation @(g.Depth == topLevelGroup ? "py-8 not-last:border-b-1 border-grey-20" : "mt-4 lg:mt-3")">
 			<div class="peer flex items-start gap-1">
 				<label for="@id" class="group/label">
 					<svg
@@ -60,7 +60,7 @@
 					href="@(g.Index?.Url ?? "")"
 					@Htmx.GetHxAttributes(Model.Features, Model.CurrentDocument.UrlPathPrefix, Model.CurrentDocument.Url, g.Index?.Url ?? "")
 					id="page-@(g.Index?.Id ?? id)"
-					class="sidebar-link @(g.Depth == topLevelGroup ? "font-semibold mb-1" : "")">
+					class="sidebar-link @(g.Depth == topLevelGroup ? "font-semibold font-sans mb-1 text-base" : "")">
 					@(g.Index?.NavigationTitle ?? "Untitled")
 				</a>
 			</div>