Fix videos list margin with hidden menu

This commit is contained in:
Chocobozzz 2019-04-11 10:21:45 +02:00
parent 2c22613c2f
commit 2b3f1919fd
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
4 changed files with 23 additions and 22 deletions

View File

@ -26,7 +26,7 @@
.margin-content { .margin-content {
width: $video-miniature-width * 6; width: $video-miniature-width * 6;
margin: auto; margin: auto !important;
@media screen and (max-width: 1800px) { @media screen and (max-width: 1800px) {
width: $video-miniature-width * 5; width: $video-miniature-width * 5;

View File

@ -64,16 +64,16 @@
margin-right: 10px; margin-right: 10px;
/deep/ .dropdown-root:not(.show) { /deep/ .dropdown-root:not(.show) {
display: none; opacity: 0;
} }
/deep/ .playlist-dropdown.show + my-action-dropdown .dropdown-root { /deep/ .playlist-dropdown.show + my-action-dropdown .dropdown-root {
display: block; opacity: 1;
} }
} }
&:hover .video-actions /deep/ .dropdown-root { &:hover .video-actions /deep/ .dropdown-root {
display: block; opacity: 1;
} }
@media screen and (max-width: $small-view) { @media screen and (max-width: $small-view) {

View File

@ -36,25 +36,27 @@
</div> </div>
</div> </div>
<div i18n class="alert alert-warning" *ngIf="isVideoToImport()"> <div class="row">
The video is being imported, it will be available when the import is finished. <div i18n class="col-md-12 alert alert-warning" *ngIf="isVideoToImport()">
</div> The video is being imported, it will be available when the import is finished.
</div>
<div i18n class="alert alert-warning" *ngIf="isVideoToTranscode()"> <div i18n class="col-md-12 alert alert-warning" *ngIf="isVideoToTranscode()">
The video is being transcoded, it may not work properly. The video is being transcoded, it may not work properly.
</div> </div>
<div i18n class="alert alert-info" *ngIf="hasVideoScheduledPublication()"> <div i18n class="col-md-12 alert alert-info" *ngIf="hasVideoScheduledPublication()">
This video will be published on {{ video.scheduledUpdate.updateAt | date: 'full' }}. This video will be published on {{ video.scheduledUpdate.updateAt | date: 'full' }}.
</div> </div>
<div i18n class="alert alert-info" *ngIf="noPlaylistVideos"> <div i18n class="col-md-12 alert alert-info" *ngIf="noPlaylistVideos">
This playlist does not have videos. This playlist does not have videos.
</div> </div>
<div class="alert alert-danger" *ngIf="video?.blacklisted"> <div class="col-md-12 alert alert-danger" *ngIf="video?.blacklisted">
<div class="blacklisted-label" i18n>This video is blacklisted.</div> <div class="blacklisted-label" i18n>This video is blacklisted.</div>
{{ video.blacklistedReason }} {{ video.blacklistedReason }}
</div>
</div> </div>
<!-- Video information --> <!-- Video information -->
@ -225,7 +227,7 @@
<my-recommended-videos [inputRecommendation]="{ uuid: video.uuid, tags: video.tags }" [user]="user"></my-recommended-videos> <my-recommended-videos [inputRecommendation]="{ uuid: video.uuid, tags: video.tags }" [user]="user"></my-recommended-videos>
</div> </div>
<div class="privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false"> <div class="row privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false">
<div class="privacy-concerns-text"> <div class="privacy-concerns-text">
<strong i18n>Friendly Reminder: </strong> <strong i18n>Friendly Reminder: </strong>
<ng-container i18n> <ng-container i18n>

View File

@ -156,6 +156,7 @@ $player-factor: 1.7; // 16/9
.alert { .alert {
text-align: center; text-align: center;
border-radius: 0;
} }
#video-not-found { #video-not-found {
@ -427,7 +428,6 @@ my-video-comments {
// If the view is not expanded, take into account the menu // If the view is not expanded, take into account the menu
.privacy-concerns { .privacy-concerns {
width: calc(100% - #{$menu-width}); width: calc(100% - #{$menu-width});
margin-left: -15px;
} }
@media screen and (max-width: $small-view) { @media screen and (max-width: $small-view) {
@ -439,7 +439,6 @@ my-video-comments {
:host-context(.expanded) { :host-context(.expanded) {
.privacy-concerns { .privacy-concerns {
width: 100%; width: 100%;
margin-left: 0;
} }
} }