]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame_incremental - client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.scss
Fix isIOS function
[github/Chocobozzz/PeerTube.git] / client / src / app / +my-account / my-account-video-playlists / my-account-video-playlists.component.scss
... / ...
CommitLineData
1@import '_variables';
2@import '_mixins';
3
4.create-button {
5 @include create-button;
6}
7
8input[type=text] {
9 @include peertube-input-text(300px);
10}
11
12::ng-deep .action-button {
13 &.action-button-delete {
14 margin-right: 10px;
15 }
16}
17
18.video-playlist {
19 @include row-blocks;
20
21 .miniature-wrapper {
22 flex-grow: 1;
23
24 ::ng-deep .miniature {
25 display: flex;
26
27 .miniature-info {
28 margin-left: 10px;
29 width: auto;
30 }
31 }
32 }
33
34 .video-playlist-buttons {
35 min-width: 190px;
36 height: max-content;
37 }
38}
39
40@media screen and (max-width: $small-view) {
41 .video-playlists-header {
42 text-align: center;
43 }
44
45 .video-playlist {
46
47 .video-playlist-buttons {
48 margin-top: 10px;
49 }
50 }
51
52 my-video-playlist-miniature ::ng-deep .miniature {
53 flex-direction: column;
54
55 .miniature-info {
56 margin-left: 0 !important;
57 }
58
59 .miniature-name {
60 max-width: $video-thumbnail-width;
61 }
62 }
63}
64
65@media only screen and (min-width: $mobile-view) and (max-width: $small-view) {
66 .video-playlists-header {
67 input[type=text] {
68 width: 42% !important;
69 }
70 }
71}
72
73@media screen and (max-width: $mobile-view) {
74 .video-playlists-header {
75 flex-direction: column;
76
77 input[type=text] {
78 width: 100% !important;
79 margin-bottom: 12px;
80 }
81 }
82}