mirror of https://github.com/FreeTubeApp/FreeTube
Fixing up playlist UI
This commit is contained in:
parent
c18046406e
commit
8d54031ede
|
@ -74,7 +74,7 @@ function playVideo(videoId, playlistId = '') {
|
||||||
playerView.videoTitle = data.title;
|
playerView.videoTitle = data.title;
|
||||||
playerView.channelName = data.author;
|
playerView.channelName = data.author;
|
||||||
playerView.channelId = data.authorId;
|
playerView.channelId = data.authorId;
|
||||||
//playerView.channelIcon = data['author']['avatar'];
|
playerView.channelIcon = data.authorThumbnails[2].url;
|
||||||
|
|
||||||
let videoUrls = data.formatStreams;
|
let videoUrls = data.formatStreams;
|
||||||
|
|
||||||
|
|
|
@ -2,6 +2,8 @@
|
||||||
float: left;
|
float: left;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.playlistSideView img {
|
.playlistSideView img {
|
||||||
|
@ -28,6 +30,10 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.playlistChannel {
|
||||||
|
height: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
.playlistChannel img {
|
.playlistChannel img {
|
||||||
width: 70px;
|
width: 70px;
|
||||||
float: left;
|
float: left;
|
||||||
|
@ -40,8 +46,10 @@
|
||||||
float: left;
|
float: left;
|
||||||
position: relative;
|
position: relative;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
width: 200px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
top: 5px;
|
top: 5px;
|
||||||
|
font-size: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.playlistVideoSave {
|
.playlistVideoSave {
|
||||||
|
|
|
@ -85,6 +85,7 @@
|
||||||
<i id='miniPLLoop' v-on:click='playlistLoopToggle' class='fas fa-redo'></i>
|
<i id='miniPLLoop' v-on:click='playlistLoopToggle' class='fas fa-redo'></i>
|
||||||
<i id='miniPLShuffle' v-on:click='playlistShuffleToggle' class='fas fa-random'></i>
|
<i id='miniPLShuffle' v-on:click='playlistShuffleToggle' class='fas fa-random'></i>
|
||||||
<br /><br />
|
<br /><br />
|
||||||
|
<hr v-if='playlistShowList' style='width: 97%' />
|
||||||
<div v-if='playlistShowList' id='miniPLVideoList'>
|
<div v-if='playlistShowList' id='miniPLVideoList'>
|
||||||
<div v-for='video in playlistVideoList'>
|
<div v-for='video in playlistVideoList'>
|
||||||
<div v-on:click='play(video.videoId, playlistId)' class='miniPLVideo'>
|
<div v-on:click='play(video.videoId, playlistId)' class='miniPLVideo'>
|
||||||
|
|
|
@ -22,13 +22,14 @@
|
||||||
<img :src='thumbnail' />
|
<img :src='thumbnail' />
|
||||||
</div>
|
</div>
|
||||||
<h2>{{title}}</h2>
|
<h2>{{title}}</h2>
|
||||||
<p>{{videoCount}} videos - {{viewCount}} views - Last updated on {{lastUpdated}}</p>
|
<hr />
|
||||||
<p v-html='description'></p>
|
|
||||||
<br />
|
|
||||||
<div v-on:click='channel(channelId)' class='playlistChannel'>
|
<div v-on:click='channel(channelId)' class='playlistChannel'>
|
||||||
<img :src='channelThumbnail' />
|
<img :src='channelThumbnail' />
|
||||||
<h3>{{channelName}}</h3>
|
<h3>{{channelName}}</h3>
|
||||||
</div>
|
</div>
|
||||||
|
<p>{{videoCount}} videos - {{viewCount}} views - Last updated on {{lastUpdated}}</p>
|
||||||
|
<hr />
|
||||||
|
<p v-html='description'></p>
|
||||||
</div>
|
</div>
|
||||||
<div class='playlistVideoView'>
|
<div class='playlistVideoView'>
|
||||||
<div v-for="video in videoList">
|
<div v-for="video in videoList">
|
||||||
|
|
Loading…
Reference in New Issue