Move to sass module

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / shared-abuse-list / abuse-list-table.component.scss

diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
index 7ed7c9e878e8fde08bf9bd1c7d68d3feb1ecbe03..2d8acae582b72db28bf590531507d5f4e2ae37ce 100644 (file)
--- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
+++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
@@ -1,29 +1,5 @@
-@import 'variables';
-@import 'mixins';
-@import 'miniature';
-
-.table-video-link {
-  @include disable-outline;
-
-  position: relative;
-  top: 3px;
-}
-
-.table-comment-link,
-.table-account-link {
-  @include disable-outline;
-
-  color: var(--mainForegroundColor);
-
-  ::ng-deep p:last-child {
-    margin: 0;
-  }
-}
-
-.table-account-link {
-  display: flex;
-  flex-direction: column;
-}
+@use '_mixins' as *;
+@use '_variables' as *;
 
 .comment-flagged-account,
 .account-flagged-handle {
@@ -31,76 +7,15 @@
   color: var(--greyForegroundColor);
 }
 
-.table-video {
-  display: inline-flex;
-
-  .table-video-image {
-    @include miniature-thumbnail;
-
-    $image-height: 45px;
-
-    height: $image-height;
-    width: #{(16/9) * $image-height};
-    margin-right: 0.5rem;
-    border-radius: 2px;
-    border: none;
-    background: transparent;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    position: relative;
-
-    img {
-      height: 100%;
-      width: 100%;
-      border-radius: 2px;
-    }
-
-    span {
-      color: pvar(--inputPlaceholderColor);
-    }
-
-    .table-video-image-label {
-      @include static-thumbnail-overlay;
-      position: absolute;
-      border-radius: 3px;
-      font-size: 10px;
-      padding: 0 3px;
-      line-height: 1.3;
-      bottom: 2px;
-      right: 2px;
-    }
-  }
-
-  .table-video-text {
-    display: inline-flex;
-    flex-direction: column;
-    justify-content: center;
-    font-size: 90%;
-    color: pvar(--mainForegroundColor);
-    line-height: 1rem;
-
-    div .glyphicon {
-      font-size: 80%;
-      color: gray;
-      margin-left: 0.1rem;
-    }
-
-    div + div {
-      color: var(--greyForegroundColor);
-      font-size: 11px;
-    }
-  }
-}
-
 .abuse-states .glyphicon-comment {
-  margin-left: 0.5rem;
+  @include margin-left(0.5rem);
 }
 
 .abuse-messages {
   my-global-icon {
+    @include margin-left(3px);
+
     width: 22px;
-    margin-left: 3px;
     position: relative;
     top: -2px;
   }