mirror of
https://github.com/ceratic/MediaCollectorLibary.git
synced 2026-05-13 23:56:46 +02:00
searcg revamp 😧
This commit is contained in:
@@ -190,12 +190,18 @@
|
||||
<!-- Page Content -->
|
||||
<main class="flex min-h-screen">
|
||||
<!-- Left Sidebar -->
|
||||
<aside class="w-64 bg-slate-800 text-white shadow-lg hidden lg:block" x-data="{ collapsed: false }">
|
||||
<aside class="bg-slate-800 text-white shadow-lg hidden lg:block transition-all duration-300 ease-in-out" :class="collapsed ? 'w-16' : 'w-64'" x-data="{
|
||||
collapsed: JSON.parse(localStorage.getItem('leftSidebarCollapsed') || 'false'),
|
||||
toggle() {
|
||||
this.collapsed = !this.collapsed;
|
||||
localStorage.setItem('leftSidebarCollapsed', JSON.stringify(this.collapsed));
|
||||
}
|
||||
}">
|
||||
<div class="flex flex-col h-full">
|
||||
<!-- Sidebar Header -->
|
||||
<div class="flex items-center justify-between p-4 border-b border-slate-700">
|
||||
<div class="flex items-center justify-between p-4 border-b border-slate-700" :class="collapsed ? 'px-3' : 'p-4'">
|
||||
<h2 class="text-lg font-semibold" x-show="!collapsed">Library</h2>
|
||||
<button @click="collapsed = !collapsed" class="p-1 rounded-md hover:bg-slate-700">
|
||||
<button @click="toggle()" class="p-1 rounded-md hover:bg-slate-700">
|
||||
<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path x-show="!collapsed" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
<path x-show="collapsed" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
|
||||
@@ -267,7 +273,7 @@
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
||||
<!-- Collapsed State Icon -->
|
||||
<!-- Collapsed State Icons -->
|
||||
<div class="px-2 py-4" x-show="collapsed">
|
||||
<div class="space-y-2">
|
||||
<a href="{{ path_for('dashboard.index') }}" class="flex justify-center p-2 text-slate-300 hover:bg-slate-700 hover:text-white rounded-md" title="Dashboard">
|
||||
@@ -290,6 +296,39 @@
|
||||
</svg>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if is_media_type_visible('tvshows') %}
|
||||
<a href="{{ path_for('tvshows.index') }}" class="flex justify-center p-2 text-slate-300 hover:bg-slate-700 hover:text-white rounded-md" title="TV Shows">
|
||||
<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if is_media_type_visible('music') %}
|
||||
<a href="{{ path_for('music.index') }}" class="flex justify-center p-2 text-slate-300 hover:bg-slate-700 hover:text-white rounded-md" title="Music">
|
||||
<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19V6l12-3v13M9 19c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zm12-3c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zM9 10l12-3" />
|
||||
</svg>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if is_media_type_visible('adult') %}
|
||||
<div class="space-y-1">
|
||||
<div class="flex justify-center p-2 text-slate-300">
|
||||
<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
||||
</svg>
|
||||
</div>
|
||||
<a href="{{ path_for('adult.index') }}" class="flex justify-center p-2 text-slate-400 hover:bg-slate-700 hover:text-white rounded-md" title="Adult Videos">
|
||||
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="{{ path_for('actors.index') }}" class="flex justify-center p-2 text-slate-400 hover:bg-slate-700 hover:text-white rounded-md" title="Performers">
|
||||
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -331,12 +370,18 @@
|
||||
</div>
|
||||
|
||||
<!-- Right Sidebar -->
|
||||
<aside class="w-80 bg-white shadow-lg border-l border-gray-200 hidden xl:block" x-data="{ collapsed: false }">
|
||||
<aside class="bg-white shadow-lg border-l border-gray-200 hidden xl:block transition-all duration-300 ease-in-out" :class="collapsed ? 'w-12' : 'w-80'" x-data="{
|
||||
collapsed: JSON.parse(localStorage.getItem('rightSidebarCollapsed') || 'false'),
|
||||
toggle() {
|
||||
this.collapsed = !this.collapsed;
|
||||
localStorage.setItem('rightSidebarCollapsed', JSON.stringify(this.collapsed));
|
||||
}
|
||||
}">
|
||||
<div class="flex flex-col h-full">
|
||||
<!-- Sidebar Header -->
|
||||
<div class="flex items-center justify-between p-4 border-b border-gray-200">
|
||||
<div class="flex items-center justify-between p-4 border-b border-gray-200" :class="collapsed ? 'px-3' : 'p-4'">
|
||||
<h2 class="text-lg font-semibold text-gray-900" x-show="!collapsed">Details</h2>
|
||||
<button @click="collapsed = !collapsed" class="p-1 rounded-md hover:bg-gray-100">
|
||||
<button @click="toggle()" class="p-1 rounded-md hover:bg-gray-100">
|
||||
<svg class="h-5 w-5 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path x-show="!collapsed" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
|
||||
<path x-show="collapsed" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
|
||||
Reference in New Issue
Block a user