-@import '_variables';
-@import '_mixins';
-@import '_miniature';
+@use '_variables' as *;
+@use '_mixins' as *;
+@use '_miniature' as *;
.root {
display: grid;
}
.playlist-info {
+ @include margin-left(calc(#{pvar(--horizontalMarginContent)} * -1));
+
grid-column: 1;
background-color: pvar(--submenuBackgroundColor);
- margin-left: calc(#{pvar(--horizontalMarginContent)} * -1);
margin-top: -$sub-menu-margin-bottom;
padding: 15px;
}
.playlist-buttons {
- display:flex;
- margin: 30px 0 10px 0;
+ display: flex;
+ margin: 30px 0 10px;
.share-button {
@include peertube-button;
@include grey-button;
@include apply-svg-color(pvar(--actionButtonColor));
- margin-right: 10px;
+ @include margin-right(10px);
}
}
.cdk-drag-preview {
box-sizing: border-box;
border-radius: 4px;
- box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
- 0 8px 10px 1px rgba(0, 0, 0, 0.14),
- 0 3px 14px 2px rgba(0, 0, 0, 0.12);
+ box-shadow:
+ 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+ 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+ 0 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.cdk-drag-placeholder {
}
.video:last-child {
- border: none;
+ border: 0;
}
.videos.cdk-drop-list-dragging .video:not(.cdk-drag-placeholder) {
my-video-playlist-miniature,
.playlist-buttons {
- margin-left: auto;
- margin-right: auto;
+ @include margin-left(auto);
+ @include margin-right(auto);
}
::ng-deep my-video-playlist-element-miniature {
}
.position {
- margin-right: 5px !important;
+ @include margin-right(5px !important);
}
}
}