]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
Remove unused class in playlists elements
[github/Chocobozzz/PeerTube.git] / client / src / app / +my-account / my-account-video-playlists / my-account-video-playlist-elements.component.scss
CommitLineData
f0a39880
C
1@import '_variables';
2@import '_mixins';
c5a1ae50
C
3@import '_miniature';
4
bce47964 5.playlist-info {
e66883b3 6 background-color: pvar(--submenuColor);
10846ef6 7 margin-left: -$not-expanded-horizontal-margins;
bce47964
C
8 margin-top: -$sub-menu-margin-bottom;
9
10846ef6 10 padding: 10px;
bce47964
C
11
12 display: flex;
82f443de 13 flex-direction: column;
c9ea405f 14 justify-content: flex-start;
82f443de 15 align-items: center;
4682468d
K
16
17 /* fix ellipsis dots background color */
18 ::ng-deep .miniature-name::after {
e66883b3 19 background-color: pvar(--submenuColor) !important;
4682468d 20 }
bce47964
C
21}
22
82f443de
C
23.playlist-buttons {
24 display:flex;
25 margin: 30px 0 10px 0;
26
27 .share-button {
28 @include peertube-button;
29 @include button-with-icon(17px, 3px, -1px);
30 @include grey-button;
31 @include apply-svg-color(pvar(--actionButtonColor));
32
33 margin-right: 10px;
34 }
35}
36
15e9d5ca
C
37// Thanks Angular CDK <3 https://material.angular.io/cdk/drag-drop/examples
38.cdk-drag-preview {
39 box-sizing: border-box;
40 border-radius: 4px;
41 box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
42 0 8px 10px 1px rgba(0, 0, 0, 0.14),
43 0 3px 14px 2px rgba(0, 0, 0, 0.12);
44}
c5a1ae50 45
15e9d5ca
C
46.cdk-drag-placeholder {
47 opacity: 0;
48}
c5a1ae50 49
15e9d5ca
C
50.cdk-drag-animating {
51 transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
52}
c5a1ae50 53
15e9d5ca
C
54.video:last-child {
55 border: none;
56}
c5a1ae50 57
15e9d5ca
C
58.videos.cdk-drop-list-dragging .video:not(.cdk-drag-placeholder) {
59 transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
c5a1ae50 60}
4682468d
K
61
62@media screen and (max-width: $small-view) {
63 .playlist-info {
10846ef6
C
64 width: 100vw;
65 padding-top: 20px;
66 margin-left: calc(#{var(--expanded-horizontal-margin-content)} * -1);
4682468d
K
67 }
68}