mirror of
https://github.com/sp-tarkov/forge.git
synced 2025-02-13 04:30:41 -05:00
add small screen control
also fix dropdown text colors
This commit is contained in:
parent
4ea50fb0ef
commit
96a0b82695
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
<a href="#{{ $filter }}"
|
<a href="#{{ $filter }}"
|
||||||
@click.prevent="$wire.set('{{ $filterName }}', '{{ $filter }}')"
|
@click.prevent="$wire.set('{{ $filterName }}', '{{ $filter }}')"
|
||||||
class="flex items-center gap-2 bg-slate-100 px-4 py-2 text-sm text-slate-700 hover:bg-slate-800/5 hover:text-black focus-visible:bg-slate-800/10 focus-visible:text-black focus-visible:outline-none dark:bg-slate-800 dark:text-slate-300 dark:hover:bg-slate-100/5 dark:hover:text-white dark:focus-visible:bg-slate-100/10 dark:focus-visible:text-white {{ strval($filter) === strval($currentFilter) ? "font-bold text-cyan-500 dark:text-cyan-500" : "" }}"
|
class="flex items-center gap-2 bg-slate-100 px-4 py-2 text-sm hover:bg-slate-800/5 focus-visible:bg-slate-800/10 focus-visible:text-black focus-visible:outline-none dark:bg-slate-800 dark:hover:bg-slate-100/5 dark:focus-visible:bg-slate-100/10 dark:focus-visible:text-white {{ strval($filter) === strval($currentFilter) ? "font-bold text-cyan-500 dark:text-cyan-500 hover:text-cyan-400 dark:hover:text-cyan-400" : "text-slate-700 dark:text-slate-300 hover:text-black dark:hover:text-white" }}"
|
||||||
role="menuitem" tabindex="-1">
|
role="menuitem" tabindex="-1">
|
||||||
{{ $slot }}
|
{{ $slot }}
|
||||||
</a>
|
</a>
|
||||||
|
@ -103,12 +103,20 @@
|
|||||||
{{-- Results Per Page Dropdown --}}
|
{{-- Results Per Page Dropdown --}}
|
||||||
<div class="relative inline-block" x-data="{ isResultsPerPageOpen: false }" @click.away="isResultsPerPageOpen = false">
|
<div class="relative inline-block" x-data="{ isResultsPerPageOpen: false }" @click.away="isResultsPerPageOpen = false">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true">
|
{{-- Large display can show full text --}}
|
||||||
|
<button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="hidden lg:flex group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true">
|
||||||
{{ __('Results Per Page') }}
|
{{ __('Results Per Page') }}
|
||||||
<svg class="-mr-1 ml-1 h-5 w-5 flex-shrink-0 text-gray-400 group-hover:text-gray-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
<svg class="-mr-1 ml-1 h-5 w-5 flex-shrink-0 text-gray-400 group-hover:text-gray-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||||
<path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
|
<path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
|
||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
|
{{-- Only show selected number on smaller screens --}}
|
||||||
|
<button type="button" @click="isResultsPerPageOpen = !isResultsPerPageOpen" class="lg:hidden group inline-flex justify-center text-sm font-medium text-gray-700 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100" id="menu-button" :aria-expanded="isResultsPerPageOpen.toString()" aria-haspopup="true">
|
||||||
|
{{ $resultsPerPage }}
|
||||||
|
<svg class="-mr-1 ml-1 h-5 w-5 flex-shrink-0 text-gray-400 group-hover:text-gray-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
||||||
|
<path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div x-cloak
|
<div x-cloak
|
||||||
x-show="isResultsPerPageOpen"
|
x-show="isResultsPerPageOpen"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user