X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Bmy-account%2Fmy-account-video-playlists%2Fmy-account-video-playlist-elements.component.scss;h=9657ac11dced0afdc933c8b9c82358aa2fcfa81d;hb=9181bc0c802bb84aeae9f07b08b59dcd90f486bc;hp=4ac89d08f4ebb74d18c1e1090c1fc8aaf410ab1a;hpb=15e9d5ca39e0b792f61453fbf3885a0fc446afa7;p=github%2FChocobozzz%2FPeerTube.git 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 4ac89d08f..9657ac11d 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 @@ -2,98 +2,15 @@ @import '_mixins'; @import '_miniature'; -.video, .cdk-drag-preview { - display: flex; - align-items: center; - background-color: var(--mainBackgroundColor); - cursor: pointer; - padding: 10px; - border-bottom: 1px solid $separator-border-color; - - &:hover { - background-color: rgba(0, 0, 0, 0.05); - - .more { - display: block; - } - } - - .position { - font-weight: $font-semibold; - margin-right: 10px; - color: $grey-foreground-color; - min-width: 20px; - } - - my-video-thumbnail { - display: flex; // Avoids an issue with line-height that adds space below the element - margin-right: 10px; - - /deep/ .video-thumbnail { - @include miniature-thumbnail(130px, 72px); - } - } - - .video-info { - display: flex; - flex-direction: column; - - a { - @include disable-default-a-behaviour; - - color: var(--mainForegroundColor); - } - - .video-info-name { - font-size: 18px; - font-weight: $font-semibold; - } +.playlist-info { + background-color: var(--submenuColor); + margin-left: -15px; + margin-top: -$sub-menu-margin-bottom; - .video-info-account, .video-info-timestamp { - color: $grey-foreground-color; - } - } + padding: $sub-menu-margin-bottom 0 -15px 0; - .more { - justify-self: flex-end; - margin-left: auto; - cursor: pointer; - display: none; - - &.show { - display: block; - } - - .icon-more { - @include apply-svg-color($grey-foreground-color); - - &::after { - border: none; - } - } - - .dropdown-item { - @include dropdown-with-icon-item; - } - - .timestamp-options { - padding-top: 0; - padding-left: 35px; - margin-bottom: 15px; - - > div { - display: flex; - align-items: center; - } - - input { - @include peertube-button; - @include orange-button; - - margin-top: 10px; - } - } - } + display: flex; + justify-content: center; } // Thanks Angular CDK <3 https://material.angular.io/cdk/drag-drop/examples