Skip to content

Commit 2823988

Browse files
committed
Split into multiple views
1 parent 1aef2a7 commit 2823988

File tree

4 files changed

+58
-55
lines changed

4 files changed

+58
-55
lines changed
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
@inherits RazorSlice<LayoutViewModel>
2+
<ol class="flex-1 mb-6" itemscope="" itemtype="https://schema.org/BreadcrumbList">
3+
<li class="inline text-ink text-sm hover:text-ink leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
4+
<a itemprop="item" href="@Model.UrlPathPrefix/">
5+
<span itemprop="name" class="hover:text-ink">Elastic</span>
6+
</a>
7+
<meta itemprop="position" content="1">
8+
</li>
9+
@foreach (var item in Model.Parents.Reverse().Skip(1))
10+
{
11+
<li class="inline text-gray-500 text-sm leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
12+
<span class="px-1">/</span>
13+
<a itemprop="item" href="@item.Url">
14+
<span itemprop="name" class="hover:text-ink">@item.NavigationTitle</span>
15+
</a>
16+
<meta itemprop="position" content="2">
17+
</li>
18+
}
19+
</ol>
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
@inherits RazorSlice<LayoutViewModel>
2+
<header class="sticky top-0 bg-blue-developer max-w-screen px-6 pb-6 flex items-center justify-center">
3+
<div class="container flex flex-wrap lg:flex-nowrap">
4+
<div class="h-10 mt-6 basis-full lg:basis-auto">
5+
<a href="@Model.UrlPathPrefix/">
6+
<img src="@Model.Static("logo-elastic-horizontal-color-reverse.svg")" alt="Elastic" class="h-10">
7+
</a>
8+
</div>
9+
<form role="search" class="hidden lg:block grow basis-full lg:basis-auto shrink-0 mt-6 lg:mx-10 h-10" autocomplete="off">
10+
<label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
11+
<div class="relative h-10">
12+
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none ml-2">
13+
<svg class="w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
14+
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/>
15+
</svg>
16+
</div>
17+
<div class="rounded-full bg-linear-65 from-pink/[.4] to-teal/[.4] p-[2px] h-10">
18+
<input type="search" id="default-search" class="flex items-center h-full w-full p-2 ps-10 text-center bg-[#081335] rounded-full focus-visible:outline-[blue]/[.3] focus-visible:outline-2 truncate text-ellipsis text-white" placeholder="Try searching a document here..." required/>
19+
</div>
20+
</div>
21+
</form>
22+
<div class="flex grow lg:flex-none h-10 mt-6">
23+
<a href="https://cloud.elastic.co/registration" class="grow select-none cursor-pointer text-white text-nowrap bg-blue-elastic hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-semibold rounded-sm px-6 py-2.5 me-3 focus:outline-none h-10 flex items-center justify-center">Start free trial</a>
24+
<a href="https://elastic.co/contact" class="grow cursor-pointer text-white text-nowrap border-2 border-white focus:ring-4 focus:outline-none focus:ring-blue-300 font-semibold rounded-sm px-6 py-2.5 text-center h-10 flex items-center justify-center">Contact Sales</a>
25+
</div>
26+
</div>
27+
</header>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
@inherits RazorSlice<LayoutViewModel>
2+
<aside class="hidden lg:block">
3+
<nav id="pages-nav" class="sticky top-22 w-80 z-10 max-h-[calc(100vh-var(--spacing)*22)] overflow-y-auto">
4+
@(new HtmlString(Model.NavigationHtml))
5+
</nav>
6+
</aside>

src/Elastic.Markdown/Slices/_Layout.cshtml

Lines changed: 6 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -10,67 +10,18 @@
1010
<meta name="viewport" content="width=device-width, initial-scale=1.0">
1111
<meta name="robots" content="@(Model.AllowIndexing ? "index, follow" : "noindex, nofollow")">
1212
</head>
13-
1413
<body class="text-ink">
15-
@* <section class="h-9 bg-black"></section> *@
16-
<header class="sticky top-0 bg-blue-developer max-w-screen px-6 pb-6 flex items-center justify-center">
17-
<div class="container flex flex-wrap lg:flex-nowrap">
18-
<div class="h-10 mt-6 basis-full lg:basis-auto">
19-
<a href="@Model.UrlPathPrefix/">
20-
<img src="@Model.Static("logo-elastic-horizontal-color-reverse.svg")" alt="Elastic" class="h-10">
21-
</a>
22-
</div>
23-
<form role="search" class="hidden lg:block grow basis-full lg:basis-auto shrink-0 mt-6 lg:mx-10 h-10" autocomplete="off">
24-
<label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
25-
<div class="relative h-10">
26-
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none ml-2">
27-
<svg class="w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
28-
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/>
29-
</svg>
30-
</div>
31-
<div class="rounded-full bg-linear-65 from-pink/[.4] to-teal/[.4] p-[2px] h-10">
32-
<input type="search" id="default-search" class="flex items-center h-full w-full p-2 ps-10 text-center bg-[#081335] rounded-full focus-visible:outline-[blue]/[.3] focus-visible:outline-2 truncate text-ellipsis text-white" placeholder="Try searching a document here..." required/>
33-
</div>
34-
</div>
35-
</form>
36-
<div class="flex grow lg:flex-none h-10 mt-6">
37-
<a href="https://cloud.elastic.co/registration" class="grow select-none cursor-pointer text-white text-nowrap bg-blue-elastic hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-semibold rounded-sm px-6 py-2.5 me-3 focus:outline-none h-10 flex items-center justify-center">Start free trial</a>
38-
<a href="https://elastic.co/contact" class="grow cursor-pointer text-white text-nowrap border-2 border-white focus:ring-4 focus:outline-none focus:ring-blue-300 font-semibold rounded-sm px-6 py-2.5 text-center h-10 flex items-center justify-center">Contact Sales</a>
39-
</div>
40-
</div>
41-
</header>
14+
@(await RenderPartialAsync(_Header.Create(Model)))
4215
<div class="container mx-auto flex">
43-
<aside class="hidden lg:block">
44-
<nav id="pages-nav" class="sticky top-22 w-80 z-10 max-h-[calc(100vh-var(--spacing)*22)] overflow-y-auto">
45-
@(new HtmlString(Model.NavigationHtml))
46-
</nav>
47-
</aside>
16+
@await RenderPartialAsync(_PagesNav.Create(Model))
4817
<main class="markdown-content w-full max-w-screen pt-6 pb-6 px-6">
49-
<ol class="flex-1 mb-6" itemscope="" itemtype="https://schema.org/BreadcrumbList">
50-
<li class="inline text-ink text-sm hover:text-ink leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
51-
<a itemprop="item" href="@Model.UrlPathPrefix/">
52-
<span itemprop="name" class="hover:text-ink">Elastic</span>
53-
</a>
54-
<meta itemprop="position" content="1">
55-
</li>
56-
@foreach (var item in Model.Parents.Reverse().Skip(1))
57-
{
58-
<li class="inline text-gray-500 text-sm leading-[1.2em] tracking-[-0.02em]" itemprop="itemListElement" itemscope="" itemtype="https://schema.org/ListItem">
59-
<span class="px-1">/</span>
60-
<a itemprop="item" href="@item.Url">
61-
<span itemprop="name" class="hover:text-ink">@item.NavigationTitle</span>
62-
</a>
63-
<meta itemprop="position" content="2">
64-
</li>
65-
}
66-
</ol>
18+
@await RenderPartialAsync(_Breadcrumbs.Create(Model))
6719
@await RenderBodyAsync()
6820
</main>
6921
<aside>
70-
@* <nav id="pages-nav-2" class="sticky top-22 w-60 overflow-x-hidden z-10 max-h-[calc(100vh-var(--spacing)*22)] overflow-y-auto"> *@
71-
@* @(new HtmlString(Model.NavigationHtml)) *@
72-
@* </nav> *@
73-
hello
22+
<nav id="toc-nav" class="sticky top-22 w-80 z-10 max-h-[calc(100vh-var(--spacing)*22)] overflow-y-auto">
23+
TODO
24+
</nav>
7425
</aside>
7526
</div>
7627
<script src="@Model.Static("main.js")"></script>

0 commit comments

Comments
 (0)