Import from internal git

WebServer/Components/Organism/ContentViewer.razor

@@ -0,0 +1,24 @@
+<pre>
+    <code class="@Language">
+        @ChildContent
+    </code>
+</pre>
+
+
+@code{
+    [Inject] private IJSRuntime _js { get; set; }
+    [Parameter] public RenderFragment ChildContent { get; set; }
+    [Parameter] public string Language { get; set; } = "yaml";
+    
+    protected override async Task OnAfterRenderAsync(bool firstRender) 
+        => await _js.InvokeVoidAsync("highlightSnippet");
+}
+
+<style>
+       
+    pre{
+        width: 750px;
+        height: 500px;
+    }   
+    
+</style>

WebServer/Components/Organism/SpecList.razor

@@ -0,0 +1,32 @@
+@using WebServer.Components.Molecule
+@using Core
+@rendermode InteractiveServer
+
+<input class="filter" @onchange=Filter/>
+<div class="specs d-flex flex-row flex-wrap justify-content-start">
+    @foreach(var i in _specs.Count == 0 ? Data : _specs)
+    {
+        <div class="m-2">
+            <NavigationCard DisplayName=@i.GetFileName() Link=@($"/details/{i.GetFolder()}/{i.GetFileName()}") />
+        </div>
+    }
+</div>
+
+@code {
+
+    [Parameter] public List<Location> Data { get; set; }
+    private List<Location> _specs = [];
+    
+    private void Filter(ChangeEventArgs e)
+    {
+        string filter = e.Value?.ToString() ?? string.Empty;
+        _specs = Data.Where(s => s.Path.Contains(filter)).ToList();
+        StateHasChanged();
+    }
+}
+
+<style>
+    .filter{
+        border-radius: 4px;
+    }
+</style>