aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/+my-account
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2020-06-09 09:33:28 +0200
committerGitHub <noreply@github.com>2020-06-09 09:33:28 +0200
commite66883b37ae0796256b3aba550670a2d76cfc98a (patch)
tree3cce3c78e9f9f327470f0370a1b4065fe7e0009e /client/src/app/+my-account
parent6ad971d5f5e9ea2adfc58bd83ba1790efa4a8d12 (diff)
downloadPeerTube-e66883b37ae0796256b3aba550670a2d76cfc98a.tar.gz
PeerTube-e66883b37ae0796256b3aba550670a2d76cfc98a.tar.zst
PeerTube-e66883b37ae0796256b3aba550670a2d76cfc98a.zip
`fitWidth` for `video-miniature`, fluid grid (#2830)
* Fluid abstract video list * normalize timestamp display on miniatures * use grid for abstract-video-list - refactor scss function var to pvar to avoid overriding css variables - move fluid-grid margins to adapt-margin-content-width mixin for maintainability - fix video-miniature-name margin-top on small screen * move sceenratio function in a mixin * display no miniature avatar in channel videos view
Diffstat (limited to 'client/src/app/+my-account')
-rw-r--r--client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss2
-rw-r--r--client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss2
-rw-r--r--client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss4
-rw-r--r--client/src/app/+my-account/my-account-videos/my-account-videos.component.scss6
4 files changed, 7 insertions, 7 deletions
diff --git a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss
index ba8d56689..dd990c42b 100644
--- a/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss
+++ b/client/src/app/+my-account/my-account-subscriptions/my-account-subscriptions.component.scss
@@ -19,7 +19,7 @@
19 width: fit-content; 19 width: fit-content;
20 display: flex; 20 display: flex;
21 align-items: baseline; 21 align-items: baseline;
22 color: var(--mainForegroundColor); 22 color: pvar(--mainForegroundColor);
23 23
24 .video-channel-display-name { 24 .video-channel-display-name {
25 font-weight: $font-semibold; 25 font-weight: $font-semibold;
diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss b/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss
index 144c2440b..76fb2cde0 100644
--- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss
+++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss
@@ -30,7 +30,7 @@
30 width: fit-content; 30 width: fit-content;
31 display: flex; 31 display: flex;
32 align-items: baseline; 32 align-items: baseline;
33 color: var(--mainForegroundColor); 33 color: pvar(--mainForegroundColor);
34 34
35 .video-channel-display-name { 35 .video-channel-display-name {
36 font-weight: $font-semibold; 36 font-weight: $font-semibold;
diff --git a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
index d47810566..3f2c345d2 100644
--- a/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
+++ b/client/src/app/+my-account/my-account-video-playlists/my-account-video-playlist-elements.component.scss
@@ -3,7 +3,7 @@
3@import '_miniature'; 3@import '_miniature';
4 4
5.playlist-info { 5.playlist-info {
6 background-color: var(--submenuColor); 6 background-color: pvar(--submenuColor);
7 margin-left: -15px; 7 margin-left: -15px;
8 margin-top: -$sub-menu-margin-bottom; 8 margin-top: -$sub-menu-margin-bottom;
9 9
@@ -14,7 +14,7 @@
14 14
15 /* fix ellipsis dots background color */ 15 /* fix ellipsis dots background color */
16 ::ng-deep .miniature-name::after { 16 ::ng-deep .miniature-name::after {
17 background-color: var(--submenuColor) !important; 17 background-color: pvar(--submenuColor) !important;
18 } 18 }
19} 19}
20 20
diff --git a/client/src/app/+my-account/my-account-videos/my-account-videos.component.scss b/client/src/app/+my-account/my-account-videos/my-account-videos.component.scss
index a3422c239..67a58d8d5 100644
--- a/client/src/app/+my-account/my-account-videos/my-account-videos.component.scss
+++ b/client/src/app/+my-account/my-account-videos/my-account-videos.component.scss
@@ -84,7 +84,7 @@ my-edit-button {
84 .video-bottom, 84 .video-bottom,
85 .video-bottom .video-miniature-information { 85 .video-bottom .video-miniature-information {
86 /* same width than a.video-thumbnail */ 86 /* same width than a.video-thumbnail */
87 max-width: 223px !important; 87 max-width: $video-thumbnail-width !important;
88 } 88 }
89 } 89 }
90 } 90 }
@@ -110,7 +110,7 @@ my-edit-button {
110 ::ng-deep { 110 ::ng-deep {
111 .action-button { 111 .action-button {
112 /* same width than a.video-thumbnail */ 112 /* same width than a.video-thumbnail */
113 width: 223px; 113 width: $video-thumbnail-width;
114 } 114 }
115 } 115 }
116 } 116 }
@@ -124,7 +124,7 @@ my-edit-button {
124 flex-direction: column; 124 flex-direction: column;
125 125
126 .video-miniature-name { 126 .video-miniature-name {
127 max-width: 223px; 127 max-width: $video-thumbnail-width;
128 } 128 }
129 } 129 }
130 } 130 }