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 />
<div class="uk-grid-xl" uk-grid="parallax: 0">
<div class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div
v-for="video in channel.relatedStreams"
: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"
>
<VideoItem :video="video" height="94" width="168" hide-channel />

6
src/components/FeedPage.vue
View file

@ -29,12 +29,12 @@
<hr />
<div class="uk-grid-xl" uk-grid="parallax: 0">
<div class="uk-grid-xl" uk-grid="parallax: 0" style="padding-left: 25px;">
<div
v-for="video in videos"
:key="video.url"
:style="[{ background: backgroundColor }]"
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"
:style="[{ background: backgroundColor, paddingLeft: '15px' }]"
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" />
</div>

2
src/components/MenuDesktop.vue
View file

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

6
src/components/SearchResults.vue
View file

@ -30,12 +30,12 @@
</i>
</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
v-for="result in results.items"
:key="result.url"
:style="[{ background: backgroundColor }]"
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"
:style="[{ background: backgroundColor, paddingLeft: '15px' }]"
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" />
<div v-if="!shouldUseVideoItem(result)" class="uk-text-secondary">

8
src/components/TrendingPage.vue
View file

@ -52,14 +52,14 @@
</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
v-for="video in videos"
:key="video.url"
:style="[{ background: backgroundColor }]"
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"
:style="[{ background: backgroundColor, paddingLeft: '15px' }]"
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>
</template>

8
src/components/VideoItem.vue
View file

@ -19,7 +19,13 @@
<div>
<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"
>
{{ video.title }}