forks/peertube
1
0
Fork 0
Code Releases Activity

Use ::ng-deep instead of /deep/

Browse source
This commit is contained in:
Chocobozzz 2019-07-24 16:12:35 +02:00
parent f36da21e40
commit 03652b3179
No known key found for this signature in database
GPG key ID: 583A612D890159BE
26 changed files with 44 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.scss
View file

@ -1,6 +1,6 @@
@import '_variables'; @import '_variables';
@import '_mixins'; @import '_mixins';
.update-button[disabled="true"] /deep/ .action-button { .update-button[disabled="true"] ::ng-deep .action-button {
cursor: default !important; cursor: default !important;
} }

2
client/src/app/+admin/plugins/shared/toggle-plugin-type.scss
View file

@ -7,7 +7,7 @@
margin-bottom: 30px; margin-bottom: 30px;
p-selectButton { p-selectButton {
/deep/ { ::ng-deep {
.ui-button-text { .ui-button-text {
font-size: 15px; font-size: 15px;
} }

2
client/src/app/+my-account/my-account-video-channels/my-account-video-channels.component.scss
View file

@ -5,7 +5,7 @@
@include create-button; @include create-button;
} }
/deep/ .action-button { ::ng-deep .action-button {
&.action-button-delete { &.action-button-delete {
margin-right: 10px; margin-right: 10px;
} }

4
client/src/app/+my-account/my-account-video-playlists/my-account-video-playlists.component.scss
View file

@ -5,7 +5,7 @@
@include create-button; @include create-button;
} }
/deep/ .action-button { ::ng-deep .action-button {
&.action-button-delete { &.action-button-delete {
margin-right: 10px; margin-right: 10px;
} }
@ -17,7 +17,7 @@
.miniature-wrapper { .miniature-wrapper {
flex-grow: 1; flex-grow: 1;
/deep/ .miniature { ::ng-deep .miniature {
display: flex; display: flex;
.miniature-info { .miniature-info {

2
client/src/app/+signup/+register/register.component.scss
View file

@ -70,7 +70,7 @@ button {
my-loader { my-loader {
margin-bottom: 20px; margin-bottom: 20px;
/deep/ .loader div { ::ng-deep .loader div {
border-color: var(--mainColor) transparent transparent transparent; border-color: var(--mainColor) transparent transparent transparent;
} }

4
client/src/app/menu/avatar-notification.component.scss
View file

@ -1,7 +1,7 @@
@import '_variables'; @import '_variables';
@import '_mixins'; @import '_mixins';
/deep/ { ::ng-deep {
.popover-notifications.popover { .popover-notifications.popover {
max-width: none; max-width: none;
@ -99,7 +99,7 @@
} }
@media screen and (max-width: $mobile-view) { @media screen and (max-width: $mobile-view) {
/deep/ { ::ng-deep {
.popover-notifications.popover .popover-body { .popover-notifications.popover .popover-body {
width: 400px; width: 400px;
} }

2
client/src/app/menu/menu.component.scss
View file

@ -82,7 +82,7 @@ menu {
border: none; border: none;
} }
/deep/ { ::ng-deep {
@include apply-svg-color(var(--menuForegroundColor)); @include apply-svg-color(var(--menuForegroundColor));
} }
} }

2
client/src/app/search/search.component.scss
View file

@ -115,7 +115,7 @@
my-video-thumbnail { my-video-thumbnail {
margin-right: 0 !important; margin-right: 0 !important;
/deep/ .video-thumbnail { ::ng-deep .video-thumbnail {
width: 100%; width: 100%;
height: auto; height: auto;

2
client/src/app/shared/buttons/action-dropdown.component.scss
View file

@ -33,7 +33,7 @@
.more-icon { .more-icon {
width: 21px; width: 21px;
/deep/ { ::ng-deep {
@include apply-svg-color(var(--mainForegroundColor)); @include apply-svg-color(var(--mainForegroundColor));
} }
} }

2
client/src/app/shared/buttons/button.component.scss
View file

@ -1,7 +1,7 @@
@import '_variables'; @import '_variables';
@import '_mixins'; @import '_mixins';
my-small-loader /deep/ .root { my-small-loader ::ng-deep .root {
display: inline-block; display: inline-block;
margin: 0 3px 0 0; margin: 0 3px 0 0;
width: 20px; width: 20px;

2
client/src/app/shared/forms/markdown-textarea.component.scss
View file

@ -16,7 +16,7 @@
flex-grow: 1; flex-grow: 1;
} }
/deep/ { ::ng-deep {
.nav-link { .nav-link {
display: flex !important; display: flex !important;
align-items: center; align-items: center;

2
client/src/app/shared/forms/timestamp-input.component.scss
View file

@ -1,5 +1,5 @@
p-inputmask { p-inputmask {
/deep/ input { ::ng-deep input {
width: 80px; width: 80px;
font-size: 15px; font-size: 15px;

2
client/src/app/shared/images/global-icon.component.scss
View file

@ -1,4 +1,4 @@
/deep/ svg { ::ng-deep svg {
width: inherit; width: inherit;
height: inherit; height: inherit;
} }

4
client/src/app/shared/menu/top-menu-dropdown.component.scss
View file

@ -11,12 +11,12 @@
} }
} }
/deep/ .dropdown-toggle::after { ::ng-deep .dropdown-toggle::after {
position: relative; position: relative;
top: 2px; top: 2px;
} }
/deep/ .dropdown-menu { ::ng-deep .dropdown-menu {
margin-top: 0 !important; margin-top: 0 !important;
} }

2
client/src/app/shared/misc/help.component.scss
View file

@ -15,7 +15,7 @@
} }
} }
/deep/ { ::ng-deep {
.help-popover { .help-popover {
max-width: 300px; max-width: 300px;

2
client/src/app/shared/user-subscription/subscribe-button.component.scss
View file

@ -61,7 +61,7 @@
padding-left: 1rem; padding-left: 1rem;
} }
/deep/ form { ::ng-deep form {
padding: 0.25rem 1rem; padding: 0.25rem 1rem;
} }

2
client/src/app/shared/video/video-actions-dropdown.component.scss
View file

@ -7,6 +7,6 @@
} }
} }
/deep/ .icon-playlist-add { ::ng-deep .icon-playlist-add {
left: 2px; left: 2px;
} }

8
client/src/app/shared/video/video-miniature.component.scss
View file

@ -68,16 +68,16 @@ $more-margin-right: 10px;
width: $more-button-width; width: $more-button-width;
height: 30px; height: 30px;
/deep/ .dropdown-root:not(.show) { ::ng-deep .dropdown-root:not(.show) {
opacity: 0; opacity: 0;
} }
/deep/ .playlist-dropdown.show + my-action-dropdown .dropdown-root { ::ng-deep .playlist-dropdown.show + my-action-dropdown .dropdown-root {
opacity: 1; opacity: 1;
} }
} }
&:hover .video-actions /deep/ .dropdown-root { &:hover .video-actions ::ng-deep .dropdown-root {
opacity: 1; opacity: 1;
} }
@ -90,7 +90,7 @@ $more-margin-right: 10px;
margin: 0; margin: 0;
top: -3px; top: -3px;
/deep/ .dropdown-root { ::ng-deep .dropdown-root {
opacity: 1 !important; opacity: 1 !important;
} }
} }

4
client/src/app/videos/+video-edit/shared/video-edit.component.scss
View file

@ -122,7 +122,7 @@ my-peertube-checkbox {
p-calendar { p-calendar {
display: block; display: block;
/deep/ { ::ng-deep {
input, input,
.ui-calendar { .ui-calendar {
width: 100%; width: 100%;
@ -135,7 +135,7 @@ p-calendar {
} }
} }
/deep/ { ::ng-deep {
.root-tabset > .nav { .root-tabset > .nav {
margin-bottom: 15px; margin-bottom: 15px;
} }

4
client/src/app/videos/+video-edit/video-add-components/video-upload.component.scss
View file

@ -25,7 +25,7 @@
p-progressBar { p-progressBar {
flex-grow: 1; flex-grow: 1;
/deep/ .ui-progressbar { ::ng-deep .ui-progressbar {
font-size: 15px !important; font-size: 15px !important;
height: 30px !important; height: 30px !important;
border-radius: 3px !important; border-radius: 3px !important;
@ -45,7 +45,7 @@
} }
&.processing { &.processing {
/deep/ .ui-progressbar-label { ::ng-deep .ui-progressbar-label {
// Same color as background to hide "100%" // Same color as background to hide "100%"
color: rgba(11, 204, 41, 0.16) !important; color: rgba(11, 204, 41, 0.16) !important;

4
client/src/app/videos/+video-edit/video-add.component.scss
View file

@ -5,7 +5,7 @@ $border-width: 3px;
$border-type: solid; $border-type: solid;
$border-color: #EAEAEA; $border-color: #EAEAEA;
/deep/ .root-tabset.video-add-tabset { ::ng-deep .root-tabset.video-add-tabset {
&.hide-nav > .nav { &.hide-nav > .nav {
display: none !important; display: none !important;
} }
@ -52,4 +52,4 @@ $border-color: #EAEAEA;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
} }

2
client/src/app/videos/+video-watch/comment/video-comment.component.scss
View file

@ -50,7 +50,7 @@
@include peertube-word-wrap; @include peertube-word-wrap;
// Mentions // Mentions
/deep/ a { ::ng-deep a {
&:not(.linkified-url) { &:not(.linkified-url) {
@include disable-default-a-behaviour; @include disable-default-a-behaviour;

2
client/src/app/videos/+video-watch/video-watch-playlist.component.scss
View file

@ -37,7 +37,7 @@
} }
my-video-playlist-element-miniature { my-video-playlist-element-miniature {
/deep/ { ::ng-deep {
.video { .video {
.position { .position {
margin-right: 0; margin-right: 0;

18
client/src/app/videos/+video-watch/video-watch.component.scss
View file

@ -31,14 +31,14 @@ $player-factor: 1.7; // 16/9
width: 100%; width: 100%;
} }
/deep/ .video-js { ::ng-deep .video-js {
$height: calc(100vh - #{$header-height} - #{$theater-bottom-space}); $height: calc(100vh - #{$header-height} - #{$theater-bottom-space});
height: $height; height: $height;
width: 100%; width: 100%;
} }
my-video-watch-playlist /deep/ .playlist { my-video-watch-playlist ::ng-deep .playlist {
@include playlist-below-player; @include playlist-below-player;
} }
} }
@ -81,7 +81,7 @@ $player-factor: 1.7; // 16/9
} }
} }
/deep/ .video-js { ::ng-deep .video-js {
width: getPlayerWidth(66vh); width: getPlayerWidth(66vh);
height: 66vh; height: 66vh;
@ -94,7 +94,7 @@ $player-factor: 1.7; // 16/9
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.remote-server-down, .remote-server-down,
/deep/ .video-js { ::ng-deep .video-js {
width: 100vw; width: 100vw;
height: getPlayerHeight(100vw) height: getPlayerHeight(100vw)
} }
@ -344,7 +344,7 @@ $player-factor: 1.7; // 16/9
} }
} }
/deep/ .other-videos { ::ng-deep .other-videos {
padding-left: 15px; padding-left: 15px;
flex-basis: $other-videos-width; flex-basis: $other-videos-width;
min-width: $other-videos-width; min-width: $other-videos-width;
@ -456,7 +456,7 @@ my-video-comments {
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
my-video-watch-playlist /deep/ .playlist { my-video-watch-playlist ::ng-deep .playlist {
@include playlist-below-player; @include playlist-below-player;
} }
} }
@ -464,10 +464,10 @@ my-video-comments {
.video-bottom { .video-bottom {
flex-direction: column; flex-direction: column;
/deep/ .other-videos { ::ng-deep .other-videos {
padding-left: 0 !important; padding-left: 0 !important;
/deep/ .video-miniature { ::ng-deep .video-miniature {
flex-direction: row; flex-direction: row;
width: auto; width: auto;
} }
@ -492,7 +492,7 @@ my-video-comments {
} }
} }
/deep/ .other-videos .video-miniature { ::ng-deep .other-videos .video-miniature {
flex-direction: column; flex-direction: column;
} }

4
client/src/sass/include/_miniature.scss
View file

@ -95,7 +95,7 @@ $play-overlay-width: 18px;
} }
@mixin thumbnail-size-component ($width, $height) { @mixin thumbnail-size-component ($width, $height) {
/deep/ .video-thumbnail { ::ng-deep .video-thumbnail {
width: $width; width: $width;
height: $height; height: $height;
} }
@ -110,7 +110,7 @@ $play-overlay-width: 18px;
@mixin video-miniature-small-screen { @mixin video-miniature-small-screen {
text-align: center; text-align: center;
/deep/ .video-miniature { ::ng-deep .video-miniature {
padding-right: 0; padding-right: 0;
height: auto; height: auto;
width: 100%; width: 100%;

2
client/src/sass/include/_mixins.scss
View file

@ -54,7 +54,7 @@
} }
@mixin apply-svg-color ($color) { @mixin apply-svg-color ($color) {
/deep/ svg { ::ng-deep svg {
path[fill="#000000"], path[fill="#000000"],
g[fill="#000000"], g[fill="#000000"],
rect[fill="#000000"], rect[fill="#000000"],