kavin/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-12-14 06:10:28 +05:30
Code Issues Projects Releases Wiki Activity

Remove whitepace for spacing, and reduce grid dom size.

Browse Source
This commit is contained in:
FireMasterK 2021-12-27 14:46:39 +00:00
parent 3a577a4dfa
commit 9b6e32683f
No known key found for this signature in database
GPG Key ID: 49451E4482CC5BCD
11 changed files with 50 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/App.vue
View File

@ -11,8 +11,7 @@
<a aria-label="GitHub" href="https://github.com/TeamPiped/Piped">
<font-awesome-icon :icon="['fab', 'github']"></font-awesome-icon>
</a>
&nbsp;
<a href="https://github.com/TeamPiped/Piped#donations">
<a class="ml-2" href="https://github.com/TeamPiped/Piped#donations">
<font-awesome-icon :icon="['fab', 'bitcoin']"></font-awesome-icon>
{{ $t("actions.donations") }}
</a>

11
src/components/Channel.vue
View File

@ -17,9 +17,14 @@
<hr />
<div class="video-grid">
<div v-for="video in channel.relatedStreams" :key="video.url">
<VideoItem :video="video" height="94" width="168" hide-channel />
</div>
<VideoItem
v-for="video in channel.relatedStreams"
:key="video.url"
:video="video"
height="94"
width="168"
hide-channel
/>
</div>
</div>
</template>

16
src/components/Comment.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="comment flex">
<div class="comment flex mt-1.5">
<img
:src="comment.thumbnail"
class="comment-avatar rounded-full w-12 h-12"
@ -12,14 +12,15 @@
<div class="comment-content pl-2">
<div class="comment-header">
<div v-if="comment.pinned" class="comment-pinned uk-text-meta">
<font-awesome-icon icon="thumbtack"></font-awesome-icon>&nbsp; {{ $t("comment.pinned_by") }}
<font-awesome-icon icon="thumbtack"></font-awesome-icon
><span class="ml-1.5">{{ $t("comment.pinned_by") }}</span>
{{ uploader }}
</div>
<div class="comment-author">
<router-link class="font-bold uk-text-small" :to="comment.commentorUrl">
{{ comment.author }} </router-link
>&thinsp;<font-awesome-icon v-if="comment.verified" icon="check"></font-awesome-icon>
><font-awesome-icon class="ml-1.5" v-if="comment.verified" icon="check"></font-awesome-icon>
</div>
<div class="comment-meta uk-text-meta uk-margin-small-bottom">
{{ comment.commentedTime }}
@ -36,15 +37,13 @@
<template v-if="comment.repliesPage && (!loadingReplies || !showingReplies)">
<div @click="loadReplies">
<a class="uk-link-text" v-t="'actions.show_replies'" />
&nbsp;
<font-awesome-icon icon="level-down-alt" />
<font-awesome-icon class="ml-1.5" icon="level-down-alt" />
</div>
</template>
<template v-if="showingReplies">
<div @click="hideReplies">
<a class="uk-link-text" v-t="'actions.hide_replies'" />
&nbsp;
<font-awesome-icon icon="level-up-alt" />
<font-awesome-icon class="ml-1.5" icon="level-up-alt" />
</div>
</template>
<div v-show="showingReplies" v-if="replies" class="replies">
@ -53,8 +52,7 @@
</div>
<div v-if="nextpage" @click="loadReplies">
<a class="uk-link-text" v-t="'actions.load_more_replies'" />
&nbsp;
<font-awesome-icon icon="level-down-alt" />
<font-awesome-icon class="ml-1.5" icon="level-down-alt" />
</div>
</div>
</div>

4
src/components/FeedPage.vue
View File

@ -22,9 +22,7 @@
<hr />
<div class="video-grid">
<div v-for="video in videos" :key="video.url">
<VideoItem :video="video" />
</div>
<VideoItem v-for="video in videos" :key="video.url" :video="video" />
</div>
</template>

4
src/components/HistoryPage.vue
View File

@ -18,9 +18,7 @@
<hr />
<div class="video-grid">
<div v-for="video in videos" :key="video.url">
<VideoItem :video="video" />
</div>
<VideoItem v-for="video in videos" :key="video.url" :video="video" />
</div>
<br />

10
src/components/Playlist.vue
View File

@ -27,9 +27,13 @@
<hr />
<div class="video-grid">
<div v-for="video in playlist.relatedStreams" :key="video.url">
<VideoItem :video="video" height="94" width="168" />
</div>
<VideoItem
v-for="video in playlist.relatedStreams"
:key="video.url"
:video="video"
height="94"
width="168"
/>
</div>
</div>
</template>

2
src/components/Preferences.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="uk-flex uk-flex-between uk-flex-middle">
<button class="uk-button uk-button-text" @click="$router.go(-1) || $router.push('/')">
<font-awesome-icon icon="chevron-left" /> &nbsp;{{ $t("actions.back") }}
<font-awesome-icon icon="chevron-left" /><span class="ml-1.5">{{ $t("actions.back") }}</span>
</button>
<span><h1 v-t="'titles.preferences'" class="font-bold text-center"/></span>
<span />

10
src/components/SearchResults.vue
View File

@ -39,16 +39,16 @@
<img style="width: 100%" :src="result.thumbnail" loading="lazy" />
</div>
<p>
{{ result.name }}&thinsp;<font-awesome-icon
v-if="result.verified"
icon="check"
></font-awesome-icon>
{{ result.name
}}<font-awesome-icon class="ml-1.5" v-if="result.verified" icon="check"></font-awesome-icon>
</p>
</router-link>
<p v-if="result.description">{{ result.description }}</p>
<router-link v-if="result.uploaderUrl" class="uk-link-muted" :to="result.uploaderUrl">
<p>
{{ result.uploader }}&thinsp;<font-awesome-icon
{{ result.uploader
}}<font-awesome-icon
class="ml-1.5"
v-if="result.uploaderVerified"
icon="check"
></font-awesome-icon>

4
src/components/TrendingPage.vue
View File

@ -4,9 +4,7 @@
<hr />
<div class="video-grid">
<div v-for="video in videos" :key="video.url">
<VideoItem :video="video" height="118" width="210" />
</div>
<VideoItem v-for="video in videos" :key="video.url" :video="video" height="118" width="210" />
</div>
</template>

6
src/components/VideoItem.vue
View File

@ -56,10 +56,8 @@
:to="video.uploaderUrl"
:title="video.uploaderName"
>
{{ video.uploaderName }}&thinsp;<font-awesome-icon
v-if="video.uploaderVerified"
icon="check"
></font-awesome-icon>
{{ video.uploaderName
}}<font-awesome-icon class="ml-1.5" v-if="video.uploaderVerified" icon="check"></font-awesome-icon>
</router-link>
<b v-if="video.views >= 0 || video.uploadedDate" class="uk-text-small">

47
src/components/WatchVideo.vue
View File

@ -45,22 +45,18 @@
<b v-t="'video.ratings_disabled'" />
</div>
</template>
<a :href="'https://youtu.be/' + getVideoId()" class="uk-margin-small-left btn">
<b>{{ $t("player.watch_on") }}&nbsp;</b>
<font-awesome-icon :icon="['fab', 'youtube']"></font-awesome-icon>
<a :href="'https://youtu.be/' + getVideoId()" class="btn">
<b>{{ $t("player.watch_on") }}</b>
<font-awesome-icon class="ml-1.5" :icon="['fab', 'youtube']"></font-awesome-icon>
</a>
<a
v-if="video.lbryId"
:href="'https://odysee.com/' + video.lbryId"
class="uk-margin-small-left btn"
>
<a v-if="video.lbryId" :href="'https://odysee.com/' + video.lbryId" class="btn">
<b>{{ $t("player.watch_on") }} LBRY</b>
</a>
<router-link
:to="toggleListenUrl"
:aria-label="(isListening ? 'Watch ' : 'Listen to ') + video.title"
:title="(isListening ? 'Watch ' : 'Listen to ') + video.title"
class="uk-margin-small-left btn"
class="btn"
>
<font-awesome-icon :icon="isListening ? 'tv' : 'headphones'"></font-awesome-icon>
</router-link>
@ -70,7 +66,7 @@
<div class="flex">
<div class="flex items-center">
<img :src="video.uploaderAvatar" alt="" loading="lazy" class="rounded-full" />
<router-link v-if="video.uploaderUrl" class="link" :to="video.uploaderUrl">
<router-link v-if="video.uploaderUrl" class="link ml-1.5" :to="video.uploaderUrl">
{{ video.uploader }} </router-link
><font-awesome-icon class="ml-1" v-if="video.uploaderVerified" icon="check"></font-awesome-icon>
</div>
@ -95,25 +91,13 @@
<label for="chkAutoLoop"
><b>{{ $t("actions.loop_this_video") }}:</b></label
>&nbsp;
<input
id="chkAutoLoop"
v-model="selectedAutoLoop"
class="uk-checkbox"
type="checkbox"
@change="onChange($event)"
/>
>
<input id="chkAutoLoop" v-model="selectedAutoLoop" class="ml-1.5" type="checkbox" @change="onChange($event)" />
<br />
<label for="chkAutoPlay"
><b>{{ $t("actions.auto_play_next_video") }}:</b></label
>&nbsp;
<input
id="chkAutoPlay"
v-model="selectedAutoPlay"
class="uk-checkbox"
type="checkbox"
@change="onChange($event)"
/>
>
<input id="chkAutoPlay" v-model="selectedAutoPlay" class="ml-1.5" type="checkbox" @change="onChange($event)" />
<hr />
@ -132,14 +116,15 @@
<a class="btn mb-2 sm:hidden" @click="showRecs = !showRecs">
{{ showRecs ? $t("actions.minimize_recommendations") : $t("actions.show_recommendations") }}
</a>
<div
<VideoItem
v-for="related in video.relatedStreams"
class="w-auto"
v-show="showRecs || !smallView"
:key="related.url"
class="uk-tile-default w-auto"
>
<VideoItem :video="related" height="94" width="168" />
</div>
:video="related"
height="94"
width="168"
/>
<hr class="sm:hidden" />
</div>
</div>