starred/newznab-tmux
1
0
Fork 0
mirror of https://github.com/NNTmux/newznab-tmux.git synced 2026-08-29 01:08:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve page transitions

Browse Source
This commit is contained in:
DariusIII
2026-03-04 12:15:28 +01:00
parent ee00cb2df8
commit cfc6dcfeb3
10 changed files with 49 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/alpine/components/cart-page.js
+17
View File
@@ -80,6 +80,23 @@ Alpine.data('cartPage', () => ({
// Multi-operations for browse pages (select all releases, download, cart, delete)
Alpine.data('releaseMultiOps', () => ({
allChecked: false,
showThumbs: false,
init() {
var attr = this.$el.getAttribute('data-show-thumbs');
this.showThumbs = attr === '1';
},
toggleThumbs() {
this.showThumbs = !this.showThumbs;
var url = new URL(window.location);
if (this.showThumbs) {
url.searchParams.set('thumbs', '1');
} else {
url.searchParams.delete('thumbs');
}
history.replaceState(null, '', url);
},
toggleAll() {
const boxes = document.querySelectorAll('.chkRelease');
resources/views/books/index.blade.php
+2 -2
View File
@@ -1,9 +1,9 @@
@extends('layouts.main')
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200">
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav aria-label="breadcrumb">
<ol class="flex items-center space-x-2 text-sm text-gray-600">
<li><a href="{{ url($site['home_link'] ?? '/') }}" class="hover:text-blue-600">Home</a></li>
resources/views/browse/index.blade.php
+8 -10
View File
@@ -43,7 +43,7 @@
</div>
@if($results->count() > 0)
<form id="nzb_multi_operations_form" method="get" x-data="releaseMultiOps">
<form id="nzb_multi_operations_form" method="get" x-data="releaseMultiOps" data-show-thumbs="{{ request()->query('thumbs', '0') === '1' ? '1' : '0' }}">
<div class="px-6 py-4 surface-panel-alt border-b">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-4">
<!-- Left Section -->
@@ -124,7 +124,7 @@
<th class="px-3 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Action</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
<tbody class="surface-panel divide-y divide-gray-200 dark:divide-gray-700">
@foreach($results as $result)
<tr class="hover:bg-gray-50 dark:bg-gray-900 dark:hover:bg-gray-700 transition">
<td class="px-3 py-4 whitespace-nowrap">
@@ -133,13 +133,12 @@
<td class="px-3 py-4">
<div class="flex items-start">
@php
$showThumbnails = request()->query('thumbs', '0') === '1';
$coverUrl = ($result->cover ?? false) ? $result->cover : ($showThumbnails ? getReleaseCover($result) : null);
$coverUrl = ($result->cover ?? false) ? $result->cover : getReleaseCover($result);
$hasValidCover = $coverUrl && !str_contains($coverUrl, 'no-cover.png');
@endphp
@if($hasValidCover)
<a href="{{ url('/details/' . $result->guid) }}" class="shrink-0">
<img src="{{ $coverUrl }}" class="w-12 h-16 object-cover rounded mr-3 shadow-sm hover:shadow-md transition" alt="Cover" loading="lazy">
<a href="{{ url('/details/' . $result->guid) }}" class="shrink-0 bg-gray-100 dark:bg-gray-700 rounded mr-3" x-show="showThumbs" x-cloak>
<img x-bind:src="showThumbs ? '{{ $coverUrl }}' : ''" class="w-12 h-16 object-cover rounded shadow-sm hover:shadow-md transition" alt="Cover" loading="lazy">
</a>
@endif
<div class="flex-1">
@@ -281,13 +280,12 @@
<input type="checkbox" class="chkRelease rounded border-gray-300 dark:border-gray-600 text-primary-600 dark:text-primary-500 focus:ring-primary-500 dark:bg-gray-700 mt-1" name="release[]" value="{{ $result->guid }}" @change="onCheckboxChange()">
<div class="flex-1 min-w-0">
@php
$showThumbs = request()->query('thumbs', '0') === '1';
$mCoverUrl = ($result->cover ?? false) ? $result->cover : ($showThumbs ? getReleaseCover($result) : null);
$mCoverUrl = ($result->cover ?? false) ? $result->cover : getReleaseCover($result);
$mHasCover = $mCoverUrl && !str_contains($mCoverUrl, 'no-cover.png');
@endphp
@if($mHasCover)
<a href="{{ url('/details/' . $result->guid) }}" class="block mb-2">
<img src="{{ $mCoverUrl }}" class="w-16 h-20 object-cover rounded-lg shadow-sm" alt="Cover" loading="lazy">
<a href="{{ url('/details/' . $result->guid) }}" class="block mb-2 bg-gray-100 dark:bg-gray-700 rounded-lg" x-show="showThumbs" x-cloak>
<img x-bind:src="showThumbs ? '{{ $mCoverUrl }}' : ''" class="w-16 h-20 object-cover rounded-lg shadow-sm" alt="Cover" loading="lazy">
</a>
@endif
<a href="{{ url('/details/' . $result->guid) }}" class="text-primary-600 dark:text-primary-400 hover:text-primary-800 dark:hover:text-primary-300 font-medium wrap-break-word text-base">
resources/views/components/view-toggle.blade.php
+8 -10
View File
@@ -82,11 +82,7 @@
$listUrl .= '?' . http_build_query($listParams);
}
// Build thumbnail toggle URL for list view
$thumbParams = $currentParams;
$showThumbnails = request()->query('thumbs', '0') === '1';
$thumbParams['thumbs'] = $showThumbnails ? '0' : '1';
$thumbUrl = request()->url() . '?' . http_build_query($thumbParams);
@endphp
<div class="flex items-center gap-2 text-sm">
@@ -105,15 +101,17 @@
@endif
<span class="font-semibold text-gray-800 dark:text-gray-200">List</span>
{{-- Thumbnail toggle in list view --}}
{{-- Thumbnail toggle in list view - client-side via Alpine --}}
@if($covgroup || $shows)
<span class="text-gray-400 dark:text-gray-500 ml-2">|</span>
<a href="{{ $thumbUrl }}"
class="inline-flex items-center gap-1 {{ $showThumbnails ? 'text-green-600 dark:text-green-400' : 'text-blue-600 dark:text-blue-400' }} hover:text-blue-800 dark:hover:text-blue-300"
title="{{ $showThumbnails ? 'Hide thumbnails' : 'Show thumbnails' }}">
<button type="button"
@click="toggleThumbs()"
class="inline-flex items-center gap-1 hover:text-blue-800 dark:hover:text-blue-300 cursor-pointer"
x-bind:class="showThumbs ? 'text-green-600 dark:text-green-400' : 'text-blue-600 dark:text-blue-400'"
x-bind:title="showThumbs ? 'Hide thumbnails' : 'Show thumbnails'">
<i class="fas fa-image text-xs"></i>
<span>{{ $showThumbnails ? 'Hide Thumbs' : 'Show Thumbs' }}</span>
</a>
<span x-text="showThumbs ? 'Hide Thumbs' : 'Show Thumbs'"></span>
</button>
@endif
@endif
</div>
resources/views/console/index.blade.php
+3 -3
View File
@@ -5,9 +5,9 @@
@endpush
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200">
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav class="flex" aria-label="Breadcrumb">
<ol class="inline-flex items-center space-x-1 md:space-x-3">
<li class="inline-flex items-center">
@@ -87,7 +87,7 @@
$totalFailed = collect($releases)->sum(fn($r) => (int)($r->failed_count ?? 0));
@endphp
<div class="bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden hover:shadow-lg transition-shadow">
<div class="surface-panel border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden hover:shadow-lg transition-shadow">
<div class="flex flex-row">
<!-- Console Cover -->
<div class="shrink-0">
resources/views/games/index.blade.php
+2 -2
View File
@@ -5,9 +5,9 @@
@endpush
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200">
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav aria-label="breadcrumb">
<ol class="flex items-center space-x-2 text-sm text-gray-600">
<li><a href="{{ url($site['home_link'] ?? '/') }}" class="hover:text-blue-600">Home</a></li>
resources/views/music/index.blade.php
+1 -1
View File
@@ -5,7 +5,7 @@
@endpush
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav aria-label="breadcrumb">
resources/views/partials/theme-init.blade.php
+5 -2
View File
@@ -2,7 +2,8 @@
Dark mode and color scheme initialization - MUST be included at the very top of <head>,
BEFORE any CSS/Vite tags, to prevent white flash on page load.
This tiny blocking script applies the 'dark' class and data-color-scheme to <html> synchronously
before the browser paints any content.
before the browser paints any content, and sets an inline background-color on <html> so the
first paint is never white (even before external CSS loads).
--}}
<script nonce="{{ csp_nonce() }}">
(function() {
@@ -14,9 +15,11 @@
var t = localStorage.getItem('theme') || 'light';
var scheme = localStorage.getItem('color_scheme') || 'blue';
@endauth
if (t === 'dark' || (t === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
var isDark = t === 'dark' || (t === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches);
if (isDark) {
d.classList.add('dark');
}
d.setAttribute('data-color-scheme', scheme);
d.style.backgroundColor = isDark ? '#0f172a' : '#f8fafc';
})();
</script>
resources/views/search/index.blade.php
+1 -1
View File
@@ -204,7 +204,7 @@
<th class="px-3 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Action</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
<tbody class="surface-panel divide-y divide-gray-200 dark:divide-gray-700">
@foreach($results as $result)
<tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition">
<td class="px-3 py-4 whitespace-nowrap">
resources/views/series/viewseries.blade.php
+2 -2
View File
@@ -1,9 +1,9 @@
@extends('layouts.main')
@section('content')
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm">
<div class="surface-panel rounded-xl shadow-sm">
<!-- Breadcrumb -->
<div class="px-6 py-4 border-b border-gray-200">
<div class="px-6 py-4 border-b border-gray-200 dark:border-gray-700">
<nav aria-label="breadcrumb">
<ol class="flex items-center space-x-2 text-sm text-gray-600">
<li><a href="{{ url($site['home_link'] ?? '/') }}" class="hover:text-blue-600">Home</a></li>