mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
Merge pull request #1397 from dragos-efy/redesign
Redesign - Fixed more stuff
This commit is contained in:
commit
3c6ddc48d7
3 changed files with 17 additions and 12 deletions
|
@ -17,7 +17,7 @@
|
|||
/*Body*/ body {max-width: 100vw; padding: 16rem;}
|
||||
|
||||
/*Radius*/ input, .btn, .shaka-video-container, .shaka-video-container video, .video-grid div, .pp-show-recs div, button, a.btn, .grid .comment, .shaka-scrim-container, .suggestion-selected, .pp-mobile-nav a, .shaka-text-container span>span>span {border-radius: var(--efy_radius)}
|
||||
/*Radius 0*/ .video-grid img, .thumbnail-left, .thumbnail-right {border-radius: var(--efy_radius0)}
|
||||
/*Radius 0*/ .video-grid img, .thumbnail-overlay, .thumbnail-left, .thumbnail-right {border-radius: var(--efy_radius0)}
|
||||
/*Radius 2*/ .suggestions-container, .modal-container {border-radius: var(--efy_radius2)}
|
||||
|
||||
/*BG: Transparent*/ .video-grid div div, .pp-show-recs div div {background: transparent}
|
||||
|
@ -74,15 +74,13 @@ tbody:nth-child(odd), .shaka-overflow-menu button:hover, .shaka-settings-menu bu
|
|||
|
||||
/*Top bar*/
|
||||
.pp-nav {margin-bottom: 15rem}
|
||||
|
||||
.pp-nav > div.flex-1.flex.justify-start > a {font-size: 25rem}
|
||||
|
||||
.pp-nav > div.flex-1.flex.justify-start > a img {margin-right: -5rem}
|
||||
|
||||
.pp-nav > div input {margin: 0!important; width: 300rem}
|
||||
|
||||
.pp-nav > ul {list-style: none; padding: 0}
|
||||
|
||||
.pp-logo img {width: auto}
|
||||
|
||||
/*Cards*/ .video-grid > div > .flex > a > img {width: 32rem; height: 32rem}
|
||||
|
||||
/*Player*/ .player-container {max-height: 75vh; background: #000} [efy_theme=dark_black] .player-container {box-shadow: 0 0 0 1.5rem var(--efy_color_border)}
|
||||
|
@ -107,8 +105,10 @@ tbody:nth-child(odd), .shaka-overflow-menu button:hover, .shaka-settings-menu bu
|
|||
.suggestions-container li {padding: 3rem 10rem}
|
||||
.suggestion-selected {box-shadow: 0 0 0 1.5rem var(--efy_color_border), 0 0 0 1.5rem var(--efy_color_border)}
|
||||
|
||||
/*Thumbnail Overlay*/ .thumbnail-right {bottom: 15px; right: 8px; background: var(--efy_text2); padding: 12rem 6rem}
|
||||
.thumbnail-left {bottom: 16rem; left: 8rem; padding: 11rem 7rem; background: var(--efy_text2); text-transform: uppercase}
|
||||
/*Thumbnail Overlay*/ .thumbnail-overlay, .thumbnail-left , .thumbnail-right {background: var(--efy_text2)!important; padding: 12rem 6rem!important}
|
||||
.thumbnail-right {bottom: 15px; right: 8px}
|
||||
.thumbnail-left {bottom: 16rem; left: 8rem}
|
||||
.live-badge {padding: 6rem 7rem!important}
|
||||
|
||||
/*Recommended Videos*/ .pp-rec-vids {display: grid; grid-template-columns: 1fr 300rem}
|
||||
.order-first {-webkit-box-ordinal-group: -9998; -webkit-order: -9999; order: -9999}
|
||||
|
@ -180,4 +180,4 @@ html .shaka-range-element, html .shaka-range-element:focus {
|
|||
}
|
||||
@media (min-width: 768px) {
|
||||
.md\:hidden {display: none}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -91,7 +91,12 @@
|
|||
<p v-t="'info.preferences_note'" />
|
||||
<button class="btn" v-t="'actions.reset_preferences'" @click="resetPreferences()" />
|
||||
<button class="btn mx-4" v-t="'actions.backup_preferences'" @click="backupPreferences()" />
|
||||
<label for="fileSelector" class="btn" v-t="'actions.restore_preferences'" @click="restorePreferences()" />
|
||||
<label
|
||||
for="fileSelector"
|
||||
class="btn text-center"
|
||||
v-t="'actions.restore_preferences'"
|
||||
@click="restorePreferences()"
|
||||
/>
|
||||
<input class="hidden" id="fileSelector" ref="fileSelector" type="file" @change="restorePreferences()" />
|
||||
|
||||
<!-- options that are visible only when logged in -->
|
||||
|
|
|
@ -30,10 +30,10 @@
|
|||
v-else-if="video.duration >= 60"
|
||||
v-text="timeFormat(video.duration)"
|
||||
/>
|
||||
<i18n-t v-else keypath="video.live" class="thumbnail-overlay thumbnail-right !bg-red-600" tag="div">
|
||||
<font-awesome-icon class="w-3" :icon="['fas', 'broadcast-tower']" />
|
||||
<i18n-t v-else keypath="video.live" class="thumbnail-overlay thumbnail-right live-badge" tag="div">
|
||||
<font-awesome-icon :icon="['fas', 'broadcast-tower']" />
|
||||
</i18n-t>
|
||||
<span v-if="video.watched" class="thumbnail-overlay bottom-5px left-5px" v-t="'video.watched'" />
|
||||
<span v-if="video.watched" class="thumbnail-overlay thumbnail-left" v-t="'video.watched'" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
|
Loading…
Reference in a new issue