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

Fix forum look

Browse Source
This commit is contained in:
DariusIII
2026-04-07 13:15:16 +02:00
parent 277bb653e2
commit 03e36f7c48
7 changed files with 148 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/forum/blade-tailwind/js/forum.js
+56 -34
View File
@@ -1,5 +1,5 @@
import feather from 'feather-icons';
import { createApp, ref, reactive, watch } from 'vue/dist/vue.esm-bundler.js';
import { createApp, ref, reactive, watch, computed } from 'vue/dist/vue.esm-bundler.js';
import axios from 'axios';
import Pickr from '@simonwep/pickr';
import draggable from 'vuedraggable/src/vuedraggable';
@@ -7,7 +7,7 @@ import draggable from 'vuedraggable/src/vuedraggable';
import '@simonwep/pickr/dist/themes/classic.min.css';
window.axios = axios;
window.Vue = { createApp, ref, reactive, watch };
window.Vue = { createApp, ref, reactive, watch, computed };
window.VueDraggable = draggable;
// Initialize dark mode theme from main app settings
@@ -52,24 +52,48 @@ document.addEventListener('DOMContentLoaded', function () {
createApp({
setup() {
const isCollapsed = ref(true);
const isManageDropdownCollapsed = ref(true);
const isUserDropdownCollapsed = ref(true);
window.addEventListener('click', event => {
const ignore = ['navbar-toggler', 'navbar-toggler-icon', 'dropdown-toggle'];
if (ignore.some(className => event.target.classList.contains(className))) return;
if (!isCollapsed.value) isCollapsed.value = true;
if (!isManageDropdownCollapsed.value) isManageDropdownCollapsed.value = true;
if (!isUserDropdownCollapsed.value) isUserDropdownCollapsed.value = true;
});
return {
isCollapsed,
isManageDropdownCollapsed,
isUserDropdownCollapsed,
};
}
}).mount('.v-navbar');
function findModal(key)
{
const pendingApprovalElement = document.getElementById('pending-approval');
if (pendingApprovalElement) {
createApp({
setup() {
const allIds = JSON.parse(pendingApprovalElement.dataset.allIds || '[]');
const selectedIds = ref([]);
const selectAll = computed({
get: () => allIds.length > 0 && selectedIds.value.length === allIds.length,
set: (val) => {
selectedIds.value = val ? [...allIds] : [];
}
});
return {
selectedIds,
selectAll
};
}
}).mount(pendingApprovalElement);
}
function findModal(key) {
const modal = document.querySelector(`[data-modal=${key}]`);
if (!modal) throw `Attempted to open modal '${key}' but no such modal found.`;
@@ -77,48 +101,46 @@ document.addEventListener('DOMContentLoaded', function () {
return modal;
}
function openModal(modal)
{
setTimeout(function()
{
function openModal(modal) {
setTimeout(function () {
modal.classList.remove('hidden');
modal.classList.add('flex');
}, 200);
}
document.querySelectorAll('[data-open-modal]').forEach(item =>
{
item.addEventListener('click', event =>
{
function closeModal(modal) {
setTimeout(function () {
modal.classList.remove('flex');
modal.classList.add('hidden');
}, 200);
}
document.addEventListener('click', event => {
const openTrigger = event.target.closest('[data-open-modal]');
if (openTrigger) {
event.preventDefault();
openModal(findModal(openTrigger.dataset.openModal));
return;
}
openModal(findModal(event.currentTarget.dataset.openModal));
});
});
document.querySelectorAll('[data-close-modal]').forEach(modalClose =>
{
modalClose.addEventListener('click', event =>
{
const closeTrigger = event.target.closest('[data-close-modal]');
if (closeTrigger) {
event.preventDefault();
const modal = closeTrigger.closest('[data-modal]');
if (modal) closeModal(modal);
return;
}
setTimeout(function()
{
modalClose.closest('[data-modal]').classList.remove('flex');
modalClose.closest('[data-modal]').classList.add('hidden');
}, 200);
});
});
document.querySelectorAll('[data-dismiss]').forEach(item =>
{
item.addEventListener('click', event => event.currentTarget.parentElement.style.display = 'none');
const dismissTrigger = event.target.closest('[data-dismiss]');
if (dismissTrigger) {
const target = dismissTrigger.parentElement;
if (target) target.style.display = 'none';
}
});
const hash = window.location.hash.substr(1);
if (hash.startsWith('modal='))
{
openModal(findModal(hash.replace('modal=','')));
if (hash.startsWith('modal=')) {
openModal(findModal(hash.replace('modal=', '')));
}
feather.replace();
resources/forum/blade-tailwind/views/category/manage.blade.php
+16 -12
View File
@@ -13,21 +13,25 @@
@endcan
</div>
<div id="manage-categories">
<draggable-category-list :categories="state.categories"></draggable-category-list>
@if ($categories->isEmpty())
<p class="py-4 text-center text-gray-500 dark:text-gray-400">{{ trans('forum::categories.none') }}</p>
@else
<div id="manage-categories">
<draggable-category-list :categories="state.categories"></draggable-category-list>
<transition name="fade">
<div v-show="state.changesApplied" class="bg-green-100 dark:bg-green-900/30 mb-4 text-green-700 dark:text-green-300 border border-green-200 dark:border-green-800 mt-3 px-4 py-3 rounded transition-colors" role="alert">
{{ trans('forum::general.changes_applied') }}
<transition name="fade">
<div v-show="state.changesApplied" class="bg-green-100 dark:bg-green-900/30 mb-4 text-green-700 dark:text-green-300 border border-green-200 dark:border-green-800 mt-3 px-4 py-3 rounded transition-colors" role="alert">
{{ trans('forum::general.changes_applied') }}
</div>
</transition>
<div class="flex justify-end py-3">
<button type="button" class="bg-blue-500 dark:bg-blue-600 text-white rounded py-2 px-8 hover:cursor-pointer hover:bg-blue-400 dark:hover:bg-blue-500 disabled:opacity-50 transition-colors" :disabled="state.isSavingDisabled" @click="onSave">
{{ trans('forum::general.save') }}
</button>
</div>
</transition>
<div class="flex justify-end py-3">
<button type="button" class="bg-blue-500 dark:bg-blue-600 text-white rounded py-2 px-8 hover:cursor-pointer hover:bg-blue-400 dark:hover:bg-blue-500 disabled:opacity-50 transition-colors" :disabled="state.isSavingDisabled" @click="onSave">
{{ trans('forum::general.save') }}
</button>
</div>
</div>
@endif
<script type="text/x-template" id="draggable-category-list-template">
<draggable
resources/forum/blade-tailwind/views/category/modals/create.blade.php
+19
View File
@@ -23,6 +23,25 @@
<label for="is-private" class="text-gray-700 dark:text-gray-300">{{ trans('forum::categories.make_private') }}</label>
</div>
</div>
@if (!config('forum.general.content_approval.threads.enable_globally'))
<div class="mb-3">
<div>
<input type="checkbox" name="thread_approval_enabled" id="thread-approval-enabled" value="1" class="rounded border-gray-300 dark:border-gray-600 text-blue-500 dark:text-blue-400 focus:ring-blue-500 dark:focus:ring-blue-400 dark:bg-gray-700" {{ old('thread_approval_enabled') ? 'checked' : '' }}>
<label for="thread-approval-enabled" class="text-gray-700 dark:text-gray-300">{{ trans('forum::categories.enable_thread_approval') }}</label>
</div>
</div>
@endif
@if (!config('forum.general.content_approval.posts.enable_globally'))
<div class="mb-3">
<div>
<input type="checkbox" name="post_approval_enabled" id="post-approval-enabled" value="1" class="rounded border-gray-300 dark:border-gray-600 text-blue-500 dark:text-blue-400 focus:ring-blue-500 dark:focus:ring-blue-400 dark:bg-gray-700" {{ old('post_approval_enabled') ? 'checked' : '' }}>
<label for="post-approval-enabled" class="text-gray-700 dark:text-gray-300">{{ trans('forum::categories.enable_post_approval') }}</label>
</div>
</div>
@endif
@include ('forum::category.partials.inputs.color')
@slot('actions')
resources/forum/blade-tailwind/views/category/modals/edit.blade.php
+21
View File
@@ -26,6 +26,27 @@
<label class="form-check-label text-gray-700 dark:text-gray-300" for="is-private">{{ trans('forum::categories.make_private') }}</label>
</div>
</div>
@if (!config('forum.general.content_approval.threads.enable_globally'))
<div class="mb-3">
<div>
<input type="hidden" name="thread_approval_enabled" value="0" />
<input class="rounded border-gray-300 dark:border-gray-600 text-blue-500 dark:text-blue-400 focus:ring-blue-500 dark:focus:ring-blue-400 dark:bg-gray-700" type="checkbox" name="thread_approval_enabled" id="thread-approval-enabled" value="1" {{ $category->thread_approval_enabled ? 'checked' : '' }}>
<label class="text-gray-700 dark:text-gray-300" for="thread-approval-enabled">{{ trans('forum::categories.enable_thread_approval') }}</label>
</div>
</div>
@endif
@if (!config('forum.general.content_approval.posts.enable_globally'))
<div class="mb-3">
<div>
<input type="hidden" name="post_approval_enabled" value="0" />
<input class="rounded border-gray-300 dark:border-gray-600 text-blue-500 dark:text-blue-400 focus:ring-blue-500 dark:focus:ring-blue-400 dark:bg-gray-700" type="checkbox" name="post_approval_enabled" id="post-approval-enabled" value="1" {{ $category->post_approval_enabled ? 'checked' : '' }}>
<label class="text-gray-700 dark:text-gray-300" for="post-approval-enabled">{{ trans('forum::categories.enable_post_approval') }}</label>
</div>
</div>
@endif
@if ($privateAncestor != null)
<div class="alert alert-primary" role="alert">
{!! trans('forum::categories.access_controlled_by_private_ancestor', ['category' => "<a href=\"{$privateAncestor->route}\">{$privateAncestor->title}</a>"]) !!}
resources/forum/blade-tailwind/views/layouts/main.blade.php
+33 -6
View File
@@ -51,23 +51,46 @@
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200 transition-colors" href="{{ route('forum.unread') }}">{{ trans('forum::threads.unread_updated') }}</a>
</li>
@endauth
@can ('moveCategories')
<li>
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200 transition-colors" href="{{ route('forum.category.manage') }}">{{ trans('forum::general.manage') }}</a>
@if (Gate::allows('moveCategories') || Gate::allows('approveThreads') || Gate::allows('approvePosts'))
<li class="nav-item dropdown relative">
<a class="dropdown-toggle text-gray-500 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200 transition-colors flex items-center gap-1" href="#" id="manageDropdownMenuLink" @click="isManageDropdownCollapsed = !isManageDropdownCollapsed">
{{ trans('forum::general.manage') }}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-3 h-3">
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
</svg>
</a>
<div class="border dark:border-gray-600 absolute z-50 left-0 bg-white dark:bg-gray-800 rounded-md w-56 divide-y dark:divide-gray-600 shadow-lg" :class="{ hidden: isManageDropdownCollapsed }" aria-labelledby="manageDropdownMenuLink">
@can ('moveCategories')
<a class="block px-4 py-2 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" href="{{ route('forum.category.manage') }}">
{{ trans('forum::categories.manage') }}
</a>
@endcan
@can ('approveThreads')
<a class="block px-4 py-2 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" href="{{ route('forum.pending-approval.threads') }}">
{{ trans('forum::threads.pending_approval') }}
</a>
@endcan
@can ('approvePosts')
<a class="block px-4 py-2 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" href="{{ route('forum.pending-approval.posts') }}">
{{ trans('forum::posts.pending_approval') }}
</a>
@endcan
</div>
</li>
@endcan
@endif
</ul>
<ul class="navbar-nav flex gap-4 flex-col md:flex-row">
@if (Auth::check())
<li class="nav-item dropdown relative">
<a class="dropdown-toggle text-gray-500 dark:text-gray-400 flex items-center gap-1 hover:text-gray-800 dark:hover:text-gray-200 transition-colors" href="#" id="navbarDropdownMenuLink" @click="isUserDropdownCollapsed = !isUserDropdownCollapsed">
<a class="dropdown-toggle text-gray-500 dark:text-gray-400 flex items-center gap-1 hover:text-gray-800 dark:hover:text-gray-200 transition-colors" href="#" id="userDropdownMenuLink" @click="isUserDropdownCollapsed = !isUserDropdownCollapsed">
{{ $username }}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-3 h-3">
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
</svg>
</a>
<div class="border dark:border-gray-600 absolute left-0 bg-white dark:bg-gray-800 rounded-md w-44 divide-y dark:divide-gray-600 shadow-lg" :class="{ hidden: isUserDropdownCollapsed }" aria-labelledby="navbarDropdownMenuLink">
<div class="border dark:border-gray-600 absolute z-50 left-0 bg-white dark:bg-gray-800 rounded-md w-44 divide-y dark:divide-gray-600 shadow-lg" :class="{ hidden: isUserDropdownCollapsed }" aria-labelledby="userDropdownMenuLink">
<a class="block px-4 py-2 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors" href="{{ url('/logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
Log out
</a>
@@ -97,5 +120,9 @@
</div>
@yield('footer')
<script>
window.defaultCategoryColor = '{{ config('forum.frontend.default_category_color') }}';
</script>
</body>
</html>
resources/forum/blade-tailwind/views/thread/partials/list.blade.php
+3
View File
@@ -27,6 +27,9 @@
@if ($thread->trashed())
<x-forum::badge type="danger">{{ trans('forum::general.deleted') }}</x-forum::badge>
@endif
@if (!$thread->isApproved)
<x-forum::badge type="warning">{{ trans('forum::general.pending_approval') }}</x-forum::badge>
@endif
<x-forum::badge :style="(isset($category) && $category->color_light_mode) ? 'background: '.$category->color_light_mode .';' : null">
{{ trans('forum::general.replies') }}:
{{ $thread->reply_count }}
vite.config.js
-2
View File
@@ -9,8 +9,6 @@ export default defineConfig({
input: [
'resources/css/app.css',
'resources/js/app.js',
'resources/forum/livewire-tailwind/css/forum.css',
'resources/forum/livewire-tailwind/js/forum.js',
'resources/forum/blade-tailwind/css/forum.css',
'resources/forum/blade-tailwind/js/forum.js',
],