iptv-org-mirror/iptv-org.github.io
1
0
Fork 0
mirror of https://github.com/iptv-org/iptv-org.github.io.git synced 2025-05-14 02:50:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update src/

Browse source
This commit is contained in:
freearhey 2025-04-14 21:53:33 +03:00
parent 09b07e9b24
commit 86743c74f5
132 changed files with 4418 additions and 1907 deletions
Download patch file Download diff file Expand all files Collapse all files

51
src/components/ChannelGrid.svelte
View file

@ -1,51 +1,36 @@
<script>
<script lang="ts">
import type { Collection } from '@freearhey/core/browser'
import ChannelItem from './ChannelItem.svelte'
import { query } from '~/store'
export let channels = []
export let channels: Collection
let limit = 100
$: channelsDisplay = channels.slice(0, limit)
query.subscribe(() => {
limit = 100
})
function showMore() {
limit += 100
}
</script>
<div class="flex flex-col bg-white dark:bg-gray-800">
<div class="overflow-y-auto scrollbar-hide">
<div class="inline-block min-w-full align-middle">
<div class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<div class="bg-gray-50 dark:bg-gray-700">
<div class="flex">
<div class="w-36 sm:w-[200px] shrink-0"></div>
<div
class="w-[216px] sm:w-80 py-3 px-2 text-xs font-semibold tracking-wider text-left text-gray-400 uppercase dark:text-gray-400 shrink-0"
>
Name
</div>
<div
class="w-52 sm:w-[280px] py-3 px-2 text-xs font-semibold tracking-wider text-left text-gray-400 uppercase dark:text-gray-400"
>
ID
</div>
<div>
<span class="sr-only">Actions</span>
</div>
</div>
</div>
<div>
{#each channelsDisplay as channel, idx (channel)}
<ChannelItem bind:channel />
{/each}
</div>
<div class="flex flex-col bg-white dark:bg-primary-810 rounded-b-md">
<div>
<div class="w-full inline-block min-w-full align-middle">
<div class="min-w-full w-full">
{#each channelsDisplay.all() as channel, index (channel.id)}
<ChannelItem bind:channel />
{/each}
</div>
</div>
</div>
{#if channelsDisplay.length < channels.length}
{#if channelsDisplay.count() < channels.count()}
<button
class="flex border-t border-gray-200 dark:border-gray-700 items-center justify-center h-12 w-full text-blue-500 dark:text-blue-400 hover:bg-gray-50 hover:dark:bg-gray-700 focus-visible:outline-0"
on:click={showMore}>Show More</button
class="flex border-t border-gray-200 dark:border-primary-700 items-center justify-center h-12 w-full text-blue-500 dark:text-blue-400 hover:bg-gray-50 hover:dark:bg-primary-750 focus-visible:outline-0 cursor-pointer"
onclick={showMore}>Show More</button
>
{/if}
</div>