Mirrored_Repos/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-09-19 17:11:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Implement theming in a better manner.

Browse Source
This commit is contained in:
FireMasterK 2021-12-27 14:46:34 +00:00
parent d9283b2762
commit 43e69ff284
No known key found for this signature in database
GPG Key ID: 49451E4482CC5BCD
9 changed files with 17 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/index.html
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html style="background: #0b0e0f" lang="en"> <html style="background: #0F0F0F" lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />

12
src/App.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="w-full" :style="[{ background: backgroundColor, colour: foregroundColor }]" :class="{ dark: darkMode }"> <div class="w-full min-h-screen h-full" :class="{ dark: darkMode, reset: !darkMode }">
<Navigation /> <Navigation />
<router-view v-slot="{ Component }"> <router-view v-slot="{ Component }">
<keep-alive :max="5"> <keep-alive :max="5">
@ -120,8 +120,12 @@ b {
@apply py-2 px-4 rounded; @apply py-2 px-4 rounded;
} }
.reset {
@apply text-black bg-white;
}
.dark { .dark {
@apply text-white bg-dark-800 bg-opacity-70; @apply text-white bg-dark-900;
} }
.dark .input, .dark .input,
@ -147,6 +151,10 @@ hr {
} }
.link { .link {
@apply hover:(text-dark-300 underline underline-dark-300);
}
.dark .link {
@apply hover:(text-gray-300 underline underline-gray-300); @apply hover:(text-gray-300 underline underline-gray-300);
} }
</style> </style>

1
src/components/Comment.vue
View File

@ -54,7 +54,6 @@
v-for="reply in replies" v-for="reply in replies"
:key="reply.commentId" :key="reply.commentId"
class="uk-tile-default uk-align-left uk-width-expand" class="uk-tile-default uk-align-left uk-width-expand"
:style="[{ background: backgroundColor }]"
> >
<Comment :comment="reply" :uploader="uploader" :video-id="videoId" /> <Comment :comment="reply" :uploader="uploader" :video-id="videoId" />
</div> </div>

2
src/components/FeedPage.vue
View File

@ -22,7 +22,7 @@
<hr /> <hr />
<div class="video-grid"> <div class="video-grid">
<div v-for="video in videos" :key="video.url" :style="[{ background: backgroundColor }]"> <div v-for="video in videos" :key="video.url">
<VideoItem :video="video" /> <VideoItem :video="video" />
</div> </div>
</div> </div>

2
src/components/HistoryPage.vue
View File

@ -18,7 +18,7 @@
<hr /> <hr />
<div class="video-grid"> <div class="video-grid">
<div v-for="video in videos" :key="video.url" :style="[{ background: backgroundColor }]"> <div v-for="video in videos" :key="video.url">
<VideoItem :video="video" /> <VideoItem :video="video" />
</div> </div>
</div> </div>

5
src/components/Navigation.vue
View File

@ -1,10 +1,7 @@
<template> <template>
<nav class="grid grid-cols-3 px-2 sm:px-4 py-2.5 w-full relative"> <nav class="grid grid-cols-3 px-2 sm:px-4 py-2.5 w-full relative">
<div> <div>
<router-link <router-link class="flex font-bold text-3xl items-center font-sans font-bold" to="/"
class="flex font-bold text-3xl items-center font-sans font-bold"
:style="[{ colour: foregroundColor }]"
to="/"
><img ><img
alt="logo" alt="logo"
src="/img/icons/logo.svg" src="/img/icons/logo.svg"

2
src/components/SearchResults.vue
View File

@ -31,7 +31,7 @@
</div> </div>
<div v-if="results" class="video-grid"> <div v-if="results" class="video-grid">
<div v-for="result in results.items" :key="result.url" :style="[{ background: backgroundColor }]"> <div v-for="result in results.items" :key="result.url">
<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">
<router-link class="uk-text-emphasis" :to="result.url"> <router-link class="uk-text-emphasis" :to="result.url">

2
src/components/TrendingPage.vue
View File

@ -4,7 +4,7 @@
<hr /> <hr />
<div class="video-grid"> <div class="video-grid">
<div v-for="video in videos" :key="video.url" :style="[{ background: backgroundColor }]"> <div v-for="video in videos" :key="video.url">
<VideoItem :video="video" height="118" width="210" /> <VideoItem :video="video" height="118" width="210" />
</div> </div>
</div> </div>

8
src/components/WatchVideo.vue
View File

@ -85,12 +85,7 @@
{{ showDesc ? $t("actions.minimize_description") : $t("actions.show_description") }} {{ showDesc ? $t("actions.minimize_description") : $t("actions.show_description") }}
</button> </button>
<!-- eslint-disable-next-line vue/no-v-html --> <!-- eslint-disable-next-line vue/no-v-html -->
<p <p v-show="showDesc" class="break-words" v-html="purifyHTML(video.description)"></p>
v-show="showDesc"
class="break-words"
:style="[{ colour: foregroundColor }]"
v-html="purifyHTML(video.description)"
></p>
<div v-if="showDesc && sponsors && sponsors.segments"> <div v-if="showDesc && sponsors && sponsors.segments">
{{ $t("video.sponsor_segments") }}: {{ sponsors.segments.length }} {{ $t("video.sponsor_segments") }}: {{ sponsors.segments.length }}
</div> </div>
@ -142,7 +137,6 @@
v-show="showRecs || !smallView" v-show="showRecs || !smallView"
:key="related.url" :key="related.url"
class="uk-tile-default w-auto" class="uk-tile-default w-auto"
:style="[{ background: backgroundColor }]"
> >
<VideoItem :video="related" height="94" width="168" /> <VideoItem :video="related" height="94" width="168" />
</div> </div>