From 205e4f56f3da1f787f1bc2cdfcc39948a99a16b1 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 15 Apr 2021 15:31:03 +0200 Subject: Refactor feed component --- .../video-comment-list.component.scss | 16 ++++----------- .../comment/video-comments.component.scss | 4 ++++ .../+video-watch/video-watch.component.scss | 5 ----- .../shared/shared-main/feeds/feed.component.scss | 14 ++++++------- .../abstract-video-list.html | 1 + .../abstract-video-list.scss | 24 +++------------------- 6 files changed, 18 insertions(+), 46 deletions(-) (limited to 'client/src/app') diff --git a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss index d208944fe..c9262da09 100644 --- a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss +++ b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.scss @@ -1,17 +1,9 @@ @import 'mixins'; -h1 { - my-feed { - margin-left: 5px; - display: inline-block; - - ::ng-deep { - my-global-icon { - width: 15px !important; - top: 0 !important; - } - } - } +my-feed { + margin-left: 5px; + display: inline-block; + width: 15px; } my-global-icon { diff --git a/client/src/app/+videos/+video-watch/comment/video-comments.component.scss b/client/src/app/+videos/+video-watch/comment/video-comments.component.scss index df42fae73..e6778e1a9 100644 --- a/client/src/app/+videos/+video-watch/comment/video-comments.component.scss +++ b/client/src/app/+videos/+video-watch/comment/video-comments.component.scss @@ -27,7 +27,11 @@ margin-left: 5px; opacity: 0; transition: ease-in .2s opacity; + width: 12px; + position: relative; + top: -3px; } + &:hover my-feed { opacity: 1; } diff --git a/client/src/app/+videos/+video-watch/video-watch.component.scss b/client/src/app/+videos/+video-watch/video-watch.component.scss index 8f70652ee..e8ad10a11 100644 --- a/client/src/app/+videos/+video-watch/video-watch.component.scss +++ b/client/src/app/+videos/+video-watch/video-watch.component.scss @@ -206,11 +206,6 @@ $video-info-margin-left: 44px; } } - my-feed { - margin-left: 5px; - margin-top: 1px; - } - .video-actions-rates { margin: 0 0 10px 0; align-items: start; diff --git a/client/src/app/shared/shared-main/feeds/feed.component.scss b/client/src/app/shared/shared-main/feeds/feed.component.scss index 333d59440..b655ee708 100644 --- a/client/src/app/shared/shared-main/feeds/feed.component.scss +++ b/client/src/app/shared/shared-main/feeds/feed.component.scss @@ -2,19 +2,17 @@ @import '_mixins'; .feed { - width: min-content; + width: 100%; a { color: black; display: block; } +} - my-global-icon { - cursor: pointer; - width: 12px; - position: relative; - top: -2px; +my-global-icon { + cursor: pointer; + width: 100%; - @include apply-svg-color(pvar(--mainForegroundColor)) - } + @include apply-svg-color(pvar(--mainForegroundColor)) } diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.html b/client/src/app/shared/shared-video-miniature/abstract-video-list.html index ee5df28be..9ffeac5e8 100644 --- a/client/src/app/shared/shared-video-miniature/abstract-video-list.html +++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.html @@ -4,6 +4,7 @@
+ diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss index 6570b63d0..467ca1d2c 100644 --- a/client/src/app/shared/shared-video-miniature/abstract-video-list.scss +++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.scss @@ -15,18 +15,9 @@ $iconSize: 16px; justify-content: space-between; align-items: center; - .action-block { - ::ng-deep my-feed { - my-global-icon { - width: calc(#{$iconSize} - 2px); - } - } - - a button { - @include peertube-button; - @include grey-button; - @include button-with-icon($iconSize, 3px, -1px); - } + my-feed { + display: inline-block; + width: calc(#{$iconSize} - 2px); } .moderation-block { @@ -34,21 +25,12 @@ $iconSize: 16px; my-global-icon { position: relative; width: $iconSize; - top: -2px; } margin-left: .4rem; display: flex; justify-content: flex-end; align-items: center; - - .dropdown-item { - padding: 0; - - ::ng-deep my-peertube-checkbox label { - padding: 3px 15px; - } - } } } -- cgit v1.2.3