Skip to content

Commit

Permalink
Add resources/views/vendor/hyde/components
Browse files Browse the repository at this point in the history
  • Loading branch information
Baris Tosun committed Feb 24, 2024
1 parent 33fa0f4 commit 5e82d43
Show file tree
Hide file tree
Showing 30 changed files with 378 additions and 0 deletions.
46 changes: 46 additions & 0 deletions resources/views/vendor/hyde/components/article-excerpt.blade.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
@php /** @var \Hyde\Pages\MarkdownPost $post */ @endphp
<article class="mt-4 mb-8" itemscope itemtype="https://schema.org/Article">
<meta itemprop="identifier" content="{{ $post->identifier }}">
@if(Hyde::hasSiteUrl())
<meta itemprop="url" content="{{ Hyde::url('posts/' . $post->identifier) }}">
@endif

<header>
<a href="{{ $post->getRoute() }}" class="block w-fit">
<h2 class="text-2xl font-bold text-gray-700 hover:text-gray-900 dark:text-gray-200 dark:hover:text-white transition-colors duration-75">
{{ $post->data('title') ?? $post->title }}
</h2>
</a>
</header>

<footer>
@isset($post->date)
<span class="opacity-75">
<span itemprop="dateCreated datePublished">
{{ $post->date->short }}</span>{{ isset($post->author) ? ',' : '' }}
</span>
@endisset
@isset($post->author)
<span itemprop="author" itemscope itemtype="https://schema.org/Person">
<span class="opacity-75">by</span>
<span itemprop="name">
{{ $post->author->name ?? $post->author->username }}
</span>
</span>
@endisset
</footer>

@if($post->data('description') !== null)
<section role="doc-abstract" aria-label="Excerpt">
<p class="leading-relaxed my-1">
{{ $post->data('description') }}
</p>
</section>
@endisset

<footer>
<a href="{{ $post->getRoute() }}"
class="text-indigo-500 hover:underline font-medium">
Read post</a>
</footer>
</article>
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
@foreach(MarkdownPost::getLatestPosts() as $post)
@include('hyde::components.article-excerpt')
@endforeach
16 changes: 16 additions & 0 deletions resources/views/vendor/hyde/components/breadcrumbs.blade.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
@if (count($breadcrumbs) > 1)
<nav {{ $attributes->merge(['aria-label' => 'breadcrumb']) }}>
<ol class="flex">
@foreach ($breadcrumbs as $path => $title)
<li>
@if (! $loop->last)
<a href="{{ $path }}" class="hover:underline">{{ $title }}</a>
<span class="px-1" aria-hidden="true">&gt;</span>
@else
<a href="{{ $path }}" aria-current="page">{{ $title }}</a>
@endif
</li>
@endforeach
</ol>
</nav>
@endif
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
@php
$document = \Hyde\Framework\Features\Documentation\SemanticDocumentationArticle::make($page);
@endphp

<article id="document" itemscope itemtype="https://schema.org/Article" @class([
'mx-auto lg:ml-8 max-w-3xl p-12 md:px-16 max-w-[1000px] min-h-[calc(100vh_-_4rem)]',
config('markdown.prose_classes', 'prose dark:prose-invert'),
'torchlight-enabled' => $document->hasTorchlight()])>
@yield('content')

<header id="document-header" class="flex items-center flex-wrap justify-between prose-h1:mb-3">
{{ $document->renderHeader() }}
</header>
<section id="document-main-content" itemprop="articleBody">
{{ $document->renderBody() }}
</section>
<footer id="document-footer" class="flex items-center flex-wrap mt-8 prose-p:my-3 justify-between text-[90%]">
{{ $document->renderFooter() }}
</footer>
</article>
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
<p class="edit-page-link">
<a href="{{ $href }}">
{{ config('docs.edit_source_link_text', 'Edit page') }}
</a>
</p>
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<nav id="mobile-navigation" class="bg-white dark:bg-gray-800 md:hidden flex justify-between w-full h-16 z-40 fixed left-0 top-0 p-4 leading-8 shadow-lg">
<strong class="px-2 mr-auto">
@if(DocumentationPage::home() !== null)
<a href="{{ DocumentationPage::home() }}">
{{ config('docs.sidebar.header', 'Documentation') }}
</a>
@else
{{ config('docs.sidebar.header', 'Documentation') }}
@endif
</strong>
<ul class="flex items-center">
<li class="h-8 flex mr-1">
<x-hyde::navigation.theme-toggle-button class="opacity-75 hover:opacity-100"/>
</li>
<li class="h-8 flex">
@include('hyde::components.docs.sidebar-toggle-button')
</li>
</ul>
</nav>
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
<div id="hyde-search">
<noscript>
The search feature requires JavaScript to be enabled in your browser.
</noscript>
<input {{ $attributes->merge(['class' => 'w-full rounded text-base leading-normal bg-gray-100 dark:bg-gray-700 py-2 px-3']) }} type="search" name="search" id="search-input" placeholder="Search..." autocomplete="off" autofocus>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<script src="https://cdn.jsdelivr.net/npm/hydesearch@0.2.1/dist/HydeSearch.min.js" defer></script>
<script>
window.addEventListener('load', function () {
const searchIndexLocation = '{{ Hyde::relativeLink(ltrim(DocumentationPage::outputDirectory().'/search.json', '/')) }}';
const Search = new HydeSearch(searchIndexLocation);
Search.init();
});
</script>
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<button id="searchMenuButton" x-on:click="searchWindowOpen = ! searchWindowOpen"
:title="searchWindowOpen ? 'Close search window' : 'Open search window'; $nextTick(() => { setTimeout(() => { document.getElementById('search-input').focus(); }); });"
class="absolute right-4 top-4 mr-4 z-10 opacity-75 hover:opacity-100 hidden md:block"
aria-label="Toggle search window">
<span x-show="! searchWindowOpen">
Search <svg class="float-left mr-1 dark:fill-white" xmlns="http://www.w3.org/2000/svg" height="24"
viewBox="0 0 24 24" width="24" role="presentation">
<path d="M0 0h24v24H0z" fill="none"/>
<path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>
</span>
<span x-show="searchWindowOpen">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
</svg>
</span>
</button>
<button id="searchMenuButtonMobile" x-on:click="searchWindowOpen = ! searchWindowOpen"
:title="searchWindowOpen ? 'Close search window' : 'Open search window'; $nextTick(() => { setTimeout(() => { document.getElementById('search-input').focus(); }); });"
class="block md:hidden fixed bottom-4 right-4 z-10 rounded-full p-2 opacity-75 hover:opacity-100 fill-black bg-gray-200 dark:fill-gray-200 dark:bg-gray-700"
aria-label="Toggle search menu">
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24" role="presentation">
<path d="M0 0h24v24H0z" fill="none"/>
<path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/>
</svg>
</button>

<div id="search-window-container" x-show="searchWindowOpen" x-cloak role="dialog"
class="z-30 fixed top-0 left-0 w-screen h-screen flex flex-col items-center px-8 py-24 md:py-16">
<aside x-on:click.away="searchWindowOpen = false" id="searchMenu"
class="prose dark:prose-invert bg-white dark:bg-gray-800 z-50 p-4 rounded-lg overflow-y-hidden min-h-[300px] max-h-[75vh] w-[70ch] max-w-full cursor-auto ">
<header class="flex justify-between pb-3 mb-3 border-b dark:border-gray-700 md:hidden">
<strong>Search the documentation site</strong>
<button @click="searchWindowOpen = false" title="Close search window" class="opacity-75 hover:opacity-100"
aria-label="Close search window">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
</svg>
</button>
</header>
<div>
<x-hyde::docs.search-input/>
</div>
<footer class="mt-auto -mb-2 leading-4 text-center font-mono hidden sm:flex justify-center">
<small>
Press <code><kbd title="Forward slash">/</kbd></code> to open search window.
Use <code><kbd title="Escape key">esc</kbd></code> to close.
</small>
</footer>
</aside>

<div id="search-window-backdrop" title="Click to close search window"
class="w-screen h-screen cursor-pointer z-40 bg-black/50 absolute top-0"></div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<div id="sidebar-backdrop" x-cloak="" x-show="sidebarOpen" x-transition @click="sidebarOpen = false" title="Click to close sidebar" class="w-screen h-screen fixed top-0 left-0 cursor-pointer z-10 bg-black/50"></div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<div id="sidebar-brand" class="flex items-center justify-between h-16 py-4 px-2">
<strong class="px-2">
@if(DocumentationPage::home())
<a href="{{ DocumentationPage::home() }}">
{{ config('docs.sidebar.header', 'Documentation') }}
</a>
@else
{{ config('docs.sidebar.header', 'Documentation') }}
@endif
</strong>
<x-hyde::navigation.theme-toggle-button class="opacity-75 hover:opacity-100"/>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<p>
@if(is_bool(config('docs.sidebar.footer', true)))
<a href="{{ Hyde::relativeLink('index.html') }}">Back to home page</a>
@else
{{ Hyde::markdown(config('docs.sidebar.footer')) }}
@endif
</p>
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<button class="sidebar-group-toggle opacity-50 group-hover:opacity-100">
<svg class="sidebar-group-toggle-icon sidebar-group-toggle-icon-open" x-show="groupOpen" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 12L12 8L4 8L8 12Z" fill="currentColor" />
</svg>
<svg class="sidebar-group-toggle-icon sidebar-group-toggle-icon-closed" x-show="! groupOpen" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 8L8 12L8 4L12 8Z" fill="currentColor" />
</svg>
</button>
27 changes: 27 additions & 0 deletions resources/views/vendor/hyde/components/docs/sidebar-item.blade.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
@php /** @var \Hyde\Framework\Features\Navigation\NavItem $item */ @endphp
@props(['grouped' => false])
<li @class(['sidebar-item -ml-4 pl-4', $grouped
? 'active -ml-8 pl-8 bg-black/5 dark:bg-black/10'
: 'active bg-black/5 dark:bg-black/10' => $item->isCurrent()
]) role="listitem">
@if($item->isCurrent())
<a href="{{ $item->destination }}" aria-current="true" @class([$grouped
? '-ml-8 pl-4 py-1 px-2 block text-indigo-600 dark:text-indigo-400 dark:font-medium border-l-[0.325rem] border-indigo-500 transition-colors duration-300 ease-in-out hover:bg-black/10'
: '-ml-4 p-2 block hover:bg-black/5 dark:hover:bg-black/10 text-indigo-600 dark:text-indigo-400 dark:font-medium border-l-[0.325rem] border-indigo-500 transition-colors duration-300 ease-in-out'
])>
{{ $item->label }}
</a>

@if(config('docs.table_of_contents.enabled', true))
<span class="sr-only">Table of contents</span>
{!! ($page->getTableOfContents()) !!}
@endif
@else
<a href="{{ $item->destination }}" @class([$grouped
? '-ml-8 pl-4 py-1 px-2 block border-l-[0.325rem] border-transparent transition-colors duration-300 ease-in-out hover:bg-black/10'
: 'block -ml-4 p-2 border-l-[0.325rem] border-transparent hover:bg-black/5 dark:hover:bg-black/10'
])>
{{ $item->label }}
</a>
@endif
</li>
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
@php /** @var \Hyde\Framework\Features\Navigation\DocumentationSidebar $sidebar */ @endphp
@if(! $sidebar->hasGroups())
<ul id="sidebar-items" role="list" class="pl-2">
@foreach ($sidebar->items as $item)
@include('hyde::components.docs.sidebar-item')
@endforeach
</ul>
@else
<ul id="sidebar-items" role="list">
@php ($collapsible = config('docs.sidebar.collapsible', true))
@foreach ($sidebar->getGroups() as $group)
<li class="sidebar-group" role="listitem" @if($collapsible) x-data="{ groupOpen: {{ $sidebar->isGroupActive($group) ? 'true' : 'false' }} }" @endif>
<header class="sidebar-group-header p-2 px-4 -ml-2 flex justify-between items-center @if($collapsible) group hover:bg-black/10 @endif" @if($collapsible) @click="groupOpen = ! groupOpen" @endif>
<h4 class="sidebar-group-heading text-base font-semibold @if($collapsible) cursor-pointer dark:group-hover:text-white @endif">{{ $sidebar->makeGroupTitle($group) }}</h4>
@if($collapsible)
@include('hyde::components.docs.sidebar-group-toggle-button')
@endif
</header>
<ul class="sidebar-group-items ml-4 px-2 mb-2" role="list" @if($collapsible) x-show="groupOpen" @endif>
@foreach ($sidebar->getItemsInGroup($group) as $item)
@include('hyde::components.docs.sidebar-item', ['grouped' => true])
@endforeach
</ul>
</li>
@endforeach
</ul>
@endif
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
<button id="sidebar-toggle" title="Toggle sidebar" aria-label="Toggle sidebar navigation menu" @click="sidebarOpen = ! sidebarOpen" :class="{'active' : sidebarOpen}">
<span class="icon-bar dark:bg-white h-0" role="presentation"></span>
<span class="icon-bar dark:bg-white h-0" role="presentation"></span>
<span class="icon-bar dark:bg-white h-0" role="presentation"></span>
<span class="icon-bar dark:bg-white h-0" role="presentation"></span>
</button>
15 changes: 15 additions & 0 deletions resources/views/vendor/hyde/components/docs/sidebar.blade.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<aside id="sidebar" x-cloak :class="sidebarOpen ? 'visible left-0' : 'invisible -left-64 md:visible md:left-0'" class="bg-gray-100 dark:bg-gray-800 dark:text-gray-200 h-screen w-64 fixed z-30 md:flex flex-col shadow-lg md:shadow-none transition-all duration-300">
<header id="sidebar-header" class="h-16">
@include('hyde::components.docs.sidebar-brand')
</header>
<nav id="sidebar-navigation" class="p-2 overflow-y-auto border-y border-gray-300 dark:border-[#1b2533] h-full">
@include('hyde::components.docs.sidebar-items', [
'sidebar' => \Hyde\Framework\Features\Navigation\DocumentationSidebar::create(),
])
</nav>
@if(config('docs.sidebar.footer', true) !== false)
<footer id="sidebar-footer" class="h-16 p-4 w-full bottom-0 left-0 text-center leading-8">
@include('hyde::components.docs.sidebar-footer-text')
</footer>
@endif
</aside>
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<small class="filepath not-prose"><span class="sr-only">Filepath: </span>{{ $path }}</small>
1 change: 1 addition & 0 deletions resources/views/vendor/hyde/components/link.blade.php
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<a {{ $attributes->merge(['href' => $href]) }}>{!! $slot !!}</a>
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<div class="dropdown-container relative" x-data="{ open: false }">
<button class="dropdown-button block my-2 md:my-0 md:inline-block py-1 text-gray-700 hover:text-gray-900 dark:text-gray-100"
x-on:click="open = ! open" @click.outside="open = false" @keydown.escape.window="open = false">
{{ $label }}
<svg class="inline transition-all dark:fill-white" x-bind:style="open ? { transform: 'rotate(180deg)' } : ''" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 10l5 5 5-5z"/></svg>
</button>
<div class="dropdown absolute shadow-lg bg-white dark:bg-gray-700 z-50 right-0" :class="open ? '' : 'hidden'" x-cloak="">
<ul class="dropdown-items px-3 py-2">
@isset($items)
@foreach ($items as $item)
<li class="whitespace-nowrap">
@include('hyde::components.navigation.navigation-link')
</li>
@endforeach
@else
{{ $slot }}
@endif
</ul>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<a href="{{ Routes::get('index') }}" class="font-bold px-4" aria-label="Home page">
{{ config('hyde.name', 'HydePHP') }}
</a>
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<a href="{{ $item }}" {!! $item->isCurrent() ? 'aria-current="page"' : '' !!} @class([
'block my-2 md:my-0 md:inline-block py-1 text-gray-700 hover:text-gray-900 dark:text-gray-100',
'border-l-4 border-indigo-500 md:border-none font-medium -ml-6 pl-5 md:ml-0 md:pl-0 bg-gray-100 dark:bg-gray-800 md:bg-transparent dark:md:bg-transparent' => $item->isCurrent()
])>{{ $item->label }}</a>
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
@if(Hyde::hasFeature('darkmode'))
<button @click="toggleTheme" {{ $attributes->merge(['class' => 'theme-toggle-button flex items-center px-2 py-1 hover:text-gray-700 dark:text-gray-200']) }} title="Toggle theme">
<span class="sr-only">Toggle dark theme</span>
<svg width="1.25rem" height="1.25rem" class="w-5 h-5 hidden dark:block" fill="#FFFFFF" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
<svg width="1.25rem" height="1.25rem" class="w-5 h-5 block dark:hidden" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
</button>
@endif
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@php /** @var \Hyde\Support\Paginator $paginator */ @endphp
<nav class="flex justify-center mt-4">
@if($paginator->previous())
<x-link :href="$paginator->previous()">&#8249;</x-link>
@else
<span class="opacity-75">&#8249;</span>
@endif

<div class="px-2">
@foreach($paginator->getPageLinks() as $pageNumber => $destination)
@if($paginator->currentPage() === $pageNumber)
<strong>{{ $pageNumber }}</strong>
@else
<x-link :href="$destination">{{ $pageNumber }}</x-link>
@endif
@endforeach
</div>

@if($paginator->next())
<x-link :href="$paginator->next()">&#8250;</x-link>
@else
<span class="opacity-75">&#8250;</span>
@endif
</nav>
Loading

0 comments on commit 5e82d43

Please sign in to comment.