TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

4 videos per row(5 for biggest screens) for all pages with video list in it, refuce left nav width

Browse source
This commit is contained in:
Karlis Cudars 2021-10-22 23:41:38 +03:00
parent f1ca33f6d0
commit e53ff46482
6 changed files with 20 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/components/Channel.vue
View file

@ -21,10 +21,11 @@
<hr /> <hr />
<div class="uk-grid-xl" uk-grid="parallax: 0"> <div class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div <div
v-for="video in channel.relatedStreams" v-for="video in channel.relatedStreams"
:key="video.url" :key="video.url"
style="padding-left: 15px;"
class="uk-width-1-2 uk-width-1-3@m uk-width-1-4@l uk-width-1-5@xl" class="uk-width-1-2 uk-width-1-3@m uk-width-1-4@l uk-width-1-5@xl"
> >
<VideoItem :video="video" height="94" width="168" hide-channel /> <VideoItem :video="video" height="94" width="168" hide-channel />

6
src/components/FeedPage.vue
View file

@ -29,12 +29,12 @@
<hr /> <hr />
<div class="uk-grid-xl" uk-grid="parallax: 0"> <div class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div <div
v-for="video in videos" v-for="video in videos"
:key="video.url" :key="video.url"
:style="[{ background: backgroundColor }]" :style="[{ background: backgroundColor, paddingLeft: '15px' }]"
class="uk-width-1-1 uk-width-1-3@s uk-width-1-4@m uk-width-1-5@l uk-width-1-6@xl" class="uk-width-1-1 uk-width-1-3@s uk-width-1-4@m uk-width-1-4@l uk-width-1-5@xl"
> >
<VideoItem :video="video" /> <VideoItem :video="video" />
</div> </div>

2
src/components/MenuDesktop.vue
View file

@ -5,7 +5,7 @@
:class="{ 'collapse-text': collapseText, 'enable-animations': enableAnimations }" :class="{ 'collapse-text': collapseText, 'enable-animations': enableAnimations }"
style="padding: 32px 24px; height: 100vh;" style="padding: 32px 24px; height: 100vh;"
:style="{ :style="{
width: collapsed ? '78px' : '291px', width: collapsed ? '78px' : '270px',
backgroundColor: secondaryBackgroundColor, backgroundColor: secondaryBackgroundColor,
transition: enableAnimations ? 'width 400ms' : 'none', transition: enableAnimations ? 'width 400ms' : 'none',
}" }"

6
src/components/SearchResults.vue
View file

@ -30,12 +30,12 @@
</i> </i>
</div> </div>
<div v-if="results" class="uk-grid-xl" uk-grid="parallax: 0"> <div v-if="results" class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div <div
v-for="result in results.items" v-for="result in results.items"
:key="result.url" :key="result.url"
:style="[{ background: backgroundColor }]" :style="[{ background: backgroundColor, paddingLeft: '15px' }]"
class="uk-width-1-2 uk-width-1-3@s uk-width-1-4@m uk-width-1-5@l uk-width-1-6@xl" class="uk-width-1-2 uk-width-1-3@s uk-width-1-4@m uk-width-1-4@l uk-width-1-5@xl"
> >
<VideoItem v-if="shouldUseVideoItem(result)" :video="result" height="94" width="168" /> <VideoItem v-if="shouldUseVideoItem(result)" :video="result" height="94" width="168" />
<div v-if="!shouldUseVideoItem(result)" class="uk-text-secondary"> <div v-if="!shouldUseVideoItem(result)" class="uk-text-secondary">

8
src/components/TrendingPage.vue
View file

@ -52,14 +52,14 @@
</div> </div>
</div> </div>
<div class="uk-grid-xl" uk-grid="parallax: 0"> <div class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div <div
v-for="video in videos" v-for="video in videos"
:key="video.url" :key="video.url"
:style="[{ background: backgroundColor }]" :style="[{ background: backgroundColor, paddingLeft: '15px' }]"
class="uk-width-1-1 uk-width-1-2@s uk-width-1-4@m uk-width-1-5@l uk-width-1-6@xl" class="uk-width-1-1 uk-width-1-2@s uk-width-1-4@m uk-width-1-4@l uk-width-1-5@xl"
> >
<VideoItem :video="video" height="118" width="210" /> <VideoItem :video="video" height="118" width="10" />
</div> </div>
</div> </div>
</template> </template>

8
src/components/VideoItem.vue
View file

@ -19,7 +19,13 @@
<div> <div>
<p <p
style="padding-top: 0.5rem; margin-bottom: 0.5rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;" style="padding-top: 0.5rem;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
font-weight: bold;"
:title="video.title" :title="video.title"
> >
{{ video.title }} {{ video.title }}