forks
/
peertube
1
0
Fork 0
Code Releases Activity

2 rows per overview section

This commit is contained in:
Chocobozzz 2019-04-05 17:00:09 +02:00
parent 32157c0892
commit 0f4905e120
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 101 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

175
client/src/app/shared/video/video-miniature.component.scss
View File

@ -10,79 +10,84 @@
height: 195px;
vertical-align: top;
.video-miniature-information {
width: 200px;
line-height: normal;
.video-miniature-name {
@include miniature-name;
}
.video-miniature-created-at-views {
display: block;
font-size: 13px;
}
.video-miniature-account,
.video-miniature-channel {
@include disable-default-a-behaviour;
@include ellipsis;
display: block;
font-size: 13px;
color: $grey-foreground-color;
&:hover {
color: $grey-foreground-hover-color;
}
}
.video-info-privacy,
.video-info-blacklisted .blacklisted-label,
.video-info-nsfw {
font-weight: $font-semibold;
}
.video-info-blacklisted {
color: red;
.blacklisted-reason::before {
content: ' - ';
}
}
.video-info-nsfw {
color: red;
}
}
.video-bottom {
display: flex;
.video-miniature-information {
width: 200px;
line-height: normal;
.video-miniature-name {
@include miniature-name;
}
.video-miniature-created-at-views {
display: block;
font-size: 13px;
}
.video-miniature-account,
.video-miniature-channel {
@include disable-default-a-behaviour;
@include ellipsis;
display: block;
font-size: 13px;
color: $grey-foreground-color;
&:hover {
color: $grey-foreground-hover-color;
}
}
.video-info-privacy,
.video-info-blacklisted .blacklisted-label,
.video-info-nsfw {
font-weight: $font-semibold;
}
.video-info-blacklisted {
color: red;
.blacklisted-reason::before {
content: ' - ';
}
}
.video-info-nsfw {
color: red;
}
}
.video-actions {
margin-top: 3px;
margin-right: 10px;
/deep/ .dropdown-root:not(.show) {
display: none;
}
/deep/ .playlist-dropdown.show + my-action-dropdown .dropdown-root {
display: block;
}
}
/deep/ .dropdown-root:not(.show) {
display: none;
}
&:hover /deep/ .dropdown-root {
display: block;
}
/deep/ .playlist-dropdown.show + my-action-dropdown .dropdown-root {
&:hover .video-actions /deep/ .dropdown-root {
display: block;
}
@media screen and (max-width: $small-view) {
.video-actions {
margin-right: 0;
.video-miniature-information .video-miniature-name {
margin-top: 0;
}
/deep/ .dropdown-root {
display: block !important;
.video-actions {
margin: 0;
top: -3px;
/deep/ .dropdown-root {
display: block !important;
}
}
}
}
@ -97,36 +102,38 @@
margin-right: 10px;
}
.video-miniature-information {
width: auto;
min-width: 500px;
.video-bottom {
.video-miniature-information {
width: auto;
min-width: 500px;
.video-miniature-name {
@include ellipsis-multiline(1.3em, 2);
.video-miniature-name {
@include ellipsis-multiline(1.3em, 2);
margin-top: 2px;
margin-bottom: 5px;
margin-top: 2px;
margin-bottom: 5px;
}
.video-miniature-created-at-views,
.video-miniature-account,
.video-miniature-channel {
font-size: 14px;
width: fit-content;
}
.video-info-privacy {
margin-top: 5px;
}
.video-info-blacklisted {
margin-top: 3px;
}
}
.video-miniature-created-at-views,
.video-miniature-account,
.video-miniature-channel {
font-size: 14px;
width: fit-content;
.video-actions {
margin: 0;
top: -3px;
}
.video-info-privacy {
margin-top: 5px;
}
.video-info-blacklisted {
margin-top: 3px;
}
}
.video-bottom .video-actions {
margin: 0;
top: -3px;
}
@media screen and (max-width: $small-view) {

9
client/src/app/videos/video-list/video-overview.component.scss
View File

@ -3,6 +3,8 @@
@import '_miniature';
.section {
max-height: 500px; // 2 rows max
overflow: hidden;
padding-top: 10px;
&:first-child {
@ -44,11 +46,18 @@
}
@media screen and (max-width: 500px) {
.margin-content {
margin: 0 !important;
}
.section-title {
font-size: 17px;
}
.section {
max-height: initial;
overflow: initial;
@include video-miniature-small-screen;
}
}

2
server/controllers/api/overviews.ts
View File

@ -94,7 +94,7 @@ async function getVideos (
) {
const query = Object.assign({
start: 0,
count: 10,
count: 12,
sort: '-createdAt',
includeLocalVideos: true,
nsfw: buildNSFWFilter(res),