mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-12-14 22:30:28 +05:30
commit
3213029edc
src
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="flex flex-col w-full min-h-screen px-1vw py-5 reset" :class="[theme]">
|
||||
<div class="flex flex-col w-full min-h-screen px-1vw py-5 antialiased reset" :class="[theme]">
|
||||
<div class="flex-1">
|
||||
<NavBar />
|
||||
<router-view v-slot="{ Component }">
|
||||
@ -167,7 +167,7 @@ b {
|
||||
}
|
||||
|
||||
.video-grid {
|
||||
@apply grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 col-auto lt-md:gap-x-2.5 md:gap-x-1vw gap-y-1.5;
|
||||
@apply grid grid-cols-1 mx-2 sm:mx-0 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 col-auto lt-md:gap-x-3 md:gap-x-6 gap-y-5;
|
||||
}
|
||||
|
||||
.btn {
|
||||
|
@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div v-if="showVideo">
|
||||
<router-link
|
||||
class="focus:underline hover:underline inline-block w-full"
|
||||
:to="{
|
||||
path: '/watch',
|
||||
query: {
|
||||
@ -50,14 +51,48 @@
|
||||
<div>
|
||||
<p
|
||||
style="display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical"
|
||||
class="my-2 overflow-hidden flex link"
|
||||
class="pt-2 overflow-hidden flex link font-bold"
|
||||
:title="item.title"
|
||||
v-text="item.title"
|
||||
/>
|
||||
</div>
|
||||
</router-link>
|
||||
|
||||
<div class="float-right m-0 inline-block children:px-1">
|
||||
<div class="flex">
|
||||
<router-link :to="item.uploaderUrl">
|
||||
<img
|
||||
v-if="item.uploaderAvatar"
|
||||
:src="item.uploaderAvatar"
|
||||
loading="lazy"
|
||||
:alt="item.uploaderName"
|
||||
class="rounded-full mr-0.5 mt-0.5 w-32px h-32px"
|
||||
width="68"
|
||||
height="68"
|
||||
/>
|
||||
</router-link>
|
||||
|
||||
<div class="px-2 flex-1">
|
||||
<router-link
|
||||
v-if="item.uploaderUrl && item.uploaderName && !hideChannel"
|
||||
class="link-secondary overflow-hidden block text-sm"
|
||||
:to="item.uploaderUrl"
|
||||
:title="item.uploaderName"
|
||||
>
|
||||
<span v-text="item.uploaderName" />
|
||||
<font-awesome-icon class="ml-1.5" v-if="item.uploaderVerified" icon="check" />
|
||||
</router-link>
|
||||
|
||||
<div v-if="item.views >= 0 || item.uploadedDate" class="text-xs font-normal text-gray-300 mt-1">
|
||||
<span v-if="item.views >= 0">
|
||||
<font-awesome-icon icon="eye" />
|
||||
<span class="pl-1" v-text="`${numberFormat(item.views)} •`" />
|
||||
</span>
|
||||
<span v-if="item.uploaded > 0" class="pl-0.5" v-text="timeAgo(item.uploaded)" />
|
||||
<span v-else-if="item.uploadedDate" class="pl-0.5" v-text="item.uploadedDate" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<router-link
|
||||
:to="{
|
||||
path: '/watch',
|
||||
@ -86,40 +121,6 @@
|
||||
</button>
|
||||
<PlaylistAddModal v-if="showModal" :video-id="item.url.substr(-11)" @close="showModal = !showModal" />
|
||||
</div>
|
||||
|
||||
<div class="flex">
|
||||
<router-link :to="item.uploaderUrl">
|
||||
<img
|
||||
v-if="item.uploaderAvatar"
|
||||
:src="item.uploaderAvatar"
|
||||
loading="lazy"
|
||||
:alt="item.uploaderName"
|
||||
class="rounded-full mr-0.5 mt-0.5 w-32px h-32px"
|
||||
width="68"
|
||||
height="68"
|
||||
/>
|
||||
</router-link>
|
||||
|
||||
<div class="w-[calc(100%-32px-1rem)]">
|
||||
<router-link
|
||||
v-if="item.uploaderUrl && item.uploaderName && !hideChannel"
|
||||
class="link-secondary overflow-hidden block"
|
||||
:to="item.uploaderUrl"
|
||||
:title="item.uploaderName"
|
||||
>
|
||||
<span v-text="item.uploaderName" />
|
||||
<font-awesome-icon class="ml-1.5" v-if="item.uploaderVerified" icon="check" />
|
||||
</router-link>
|
||||
|
||||
<strong v-if="item.views >= 0 || item.uploadedDate" class="text-sm">
|
||||
<span v-if="item.views >= 0">
|
||||
<font-awesome-icon icon="eye" />
|
||||
<span class="pl-0.5" v-text="`${numberFormat(item.views)} •`" />
|
||||
</span>
|
||||
<span v-if="item.uploaded > 0" class="pl-0.5" v-text="timeAgo(item.uploaded)" />
|
||||
<span v-else-if="item.uploadedDate" class="pl-0.5" v-text="item.uploadedDate" />
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
Loading…
Reference in New Issue
Block a user