ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Remove legacy v-deep selector

Browse Source 
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2022-11-07 20:41:26 +01:00
parent 09e0d2e143
commit 0c59a85c9c
15 changed files with 70 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/CardCreateDialog.vue
View File

@@ -237,14 +237,14 @@ export default {
justify-content: flex-end; justify-content: flex-end;
} }
.card-selector::v-deep .modal-container { .card-selector:deep(.modal-container) {
overflow: visible !important; overflow: visible !important;
} }
.empty-content { .empty-content {
margin-top: 5vh !important; margin-top: 5vh !important;
&::v-deep h2 { &:deep(h2) {
margin-bottom: 5vh; margin-bottom: 5vh;
} }
} }

2
src/CardSelector.vue
View File

@@ -169,7 +169,7 @@ export default {
float: right; float: right;
} }
.card-selector::v-deep .modal-container { .card-selector:deep(.modal-container) {
overflow: visible !important; overflow: visible !important;
} }
</style> </style>

2
src/components/board/Board.vue
View File

@@ -209,7 +209,7 @@ export default {
align-items: stretch; align-items: stretch;
height: 100%; height: 100%;
.smooth-dnd-draggable-wrapper::v-deep { &:deep(.smooth-dnd-draggable-wrapper) {
display: flex; display: flex;
height: auto; height: auto;

2
src/components/board/TagsTabSidebar.vue
View File

@@ -189,7 +189,7 @@ export default {
} }
.color-picker-wrapper { .color-picker-wrapper {
&, &::v-deep > .trigger { &, &:deep > .trigger {
width: $clickable-area; width: $clickable-area;
padding: 3px; padding: 3px;
display: flex; display: flex;

85
src/components/card/CardSidebar.vue
View File

@@ -208,53 +208,54 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
section.app-sidebar__tab--active { section.app-sidebar__tab--active {
min-height: auto; min-height: auto;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
} }
// FIXME: Obivously we should at some point not randomly reuse the sidebar component // FIXME: Obivously we should at some point not randomly reuse the sidebar component
// since this is not oficially supported // since this is not oficially supported
.modal__card .app-sidebar { .modal__card .app-sidebar {
$modal-padding: 14px; $modal-padding: 14px;
border: 0; border: 0;
min-width: calc(100% - #{$modal-padding * 2}); min-width: calc(100% - #{$modal-padding * 2});
position: relative; position: relative;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
max-width: calc(100% - #{$modal-padding * 2}); max-width: calc(100% - #{$modal-padding * 2});
padding: 0 14px; padding: 0 14px;
max-height: 100%; max-height: 100%;
overflow: initial; overflow: initial;
user-select: text; user-select: text;
-webkit-user-select: text; -webkit-user-select: text;
&::v-deep { // FIXME: test
.app-sidebar-header { &:deep {
position: sticky; .app-sidebar-header {
top: 0; position: sticky;
z-index: 100; top: 0;
background-color: var(--color-main-background); z-index: 100;
} background-color: var(--color-main-background);
.app-sidebar-tabs__nav { }
position: sticky; .app-sidebar-tabs__nav {
top: 87px; position: sticky;
margin: 0; top: 87px;
z-index: 100; margin: 0;
background-color: var(--color-main-background); z-index: 100;
} background-color: var(--color-main-background);
}
.app-sidebar__tab { .app-sidebar__tab {
overflow: initial; overflow: initial;
} }
#emptycontent, .emptycontent { #emptycontent, .emptycontent {
margin-top: 88px; margin-top: 88px;
}
} }
} }
}
</style> </style>

10
src/components/card/CardSidebarTabDetails.vue
View File

@@ -368,11 +368,11 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.section-wrapper::v-deep .mx-datepicker-main.mx-datepicker-popup { .section-wrapper:deep(.mx-datepicker-main.mx-datepicker-popup) {
left: 0 !important; left: 0 !important;
} }
.section-wrapper::v-deep .mx-datepicker-main.mx-datepicker-popup.mx-datepicker-sidebar { .section-wrapper:deep(.mx-datepicker-main.mx-datepicker-popup.mx-datepicker-sidebar) {
padding: 0 !important; padding: 0 !important;
} }
@@ -413,7 +413,7 @@ export default {
padding: 6px padding: 6px
} }
.section-details::v-deep .multiselect__tags-wrap { .section-details:deep(.multiselect__tags-wrap) {
flex-wrap: wrap; flex-wrap: wrap;
} }
@@ -430,11 +430,11 @@ export default {
} }
} }
.multiselect::v-deep .multiselect__tags-wrap { .multiselect:deep(.multiselect__tags-wrap) {
z-index: 2; z-index: 2;
} }
.multiselect.multiselect--active::v-deep .multiselect__tags-wrap { .multiselect.multiselect--active:deep(.multiselect__tags-wrap) {
z-index: 0; z-index: 0;
} }

4
src/components/card/CommentForm.vue
View File

@@ -186,13 +186,13 @@ export default {
& > div[contenteditable] { & > div[contenteditable] {
width: 100%; width: 100%;
&::v-deep > span > div { &:deep > span > div {
vertical-align: middle; vertical-align: middle;
} }
} }
} }
.comment-form::v-deep .atwho-li { .comment-form:deep(.atwho-li) {
height: 32px; height: 32px;
} }

4
src/components/card/CommentItem.vue
View File

@@ -222,7 +222,7 @@ export default {
padding-left: 8px; padding-left: 8px;
} }
&::v-deep .rich-text--wrapper { &:deep(.rich-text--wrapper) {
margin-top: -3px; margin-top: -3px;
color: var(--color-text-lighter); color: var(--color-text-lighter);
} }
@@ -241,7 +241,7 @@ export default {
} }
} }
.comment--content::v-deep { .comment--content:deep {
a { a {
text-decoration: underline; text-decoration: underline;
} }

8
src/components/card/Description.vue
View File

@@ -277,7 +277,7 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
&::v-deep .attachment-list { &:deep(.attachment-list) {
flex-shrink: 1; flex-shrink: 1;
} }
} }
@@ -292,16 +292,16 @@ export default {
width: auto; width: auto;
overflow-x: auto; overflow-x: auto;
&::v-deep { &:deep {
/* stylelint-disable-next-line no-invalid-position-at-import-rule */ /* stylelint-disable-next-line no-invalid-position-at-import-rule */
@import './../../css/markdown'; @import './../../css/markdown';
} }
&::v-deep input { &:deep(input) {
min-height: auto; min-height: auto;
} }
&::v-deep a { &:deep(a) {
text-decoration: underline; text-decoration: underline;
} }
} }

6
src/components/cards/AvatarList.vue
View File

@@ -154,7 +154,7 @@ export default {
margin-top: 5px; margin-top: 5px;
position: relative; position: relative;
flex-grow: 1; flex-grow: 1;
::v-deep .popovermenu { :deep(.popovermenu) {
margin-right: -4px; margin-right: -4px;
img { img {
padding: 0; padding: 0;
@@ -174,7 +174,7 @@ export default {
padding-right: $avatar-offset; padding-right: $avatar-offset;
flex-direction: row-reverse; flex-direction: row-reverse;
.avatardiv, .avatardiv,
::v-deep .avatardiv { :deep(.avatardiv) {
width: 36px; width: 36px;
height: 36px; height: 36px;
box-sizing: content-box !important; box-sizing: content-box !important;
@@ -189,7 +189,7 @@ export default {
cursor: pointer; cursor: pointer;
} }
} }
&:hover div:nth-child(n+2) ::v-deep .avatardiv { &:hover div:nth-child(n+2) :deep(.avatardiv) {
margin-right: 1px; margin-right: 1px;
} }
} }

2
src/components/cards/CardBadges.vue
View File

@@ -109,7 +109,7 @@ export default {
margin-right: 2px; margin-right: 2px;
span, span,
&::v-deep span { &:deep(span) {
padding: 10px 2px; padding: 10px 2px;
} }
} }

2
src/components/cards/CardItem.vue
View File

@@ -208,7 +208,7 @@ export default {
background-color: var(--color-main-background); background-color: var(--color-main-background);
margin-bottom: $card-spacing; margin-bottom: $card-spacing;
&::v-deep * { &:deep(*) {
cursor: pointer; cursor: pointer;
} }

4
src/components/search/GlobalSearchResults.vue
View File

@@ -207,7 +207,7 @@ export default {
margin-right: 20px; margin-right: 20px;
} }
} }
h2::v-deep span { h2:deep(span) {
background-color: var(--color-background-dark); background-color: var(--color-background-dark);
padding: 3px; padding: 3px;
border-radius: var(--border-radius); border-radius: var(--border-radius);
@@ -221,7 +221,7 @@ export default {
flex-grow: 0; flex-grow: 0;
} }
} }
&::v-deep .card { &:deep(.card) {
width: $stack-width; width: $stack-width;
margin-right: $stack-spacing; margin-right: $stack-spacing;
} }

2
src/css/comments.scss
View File

@@ -3,7 +3,7 @@
flex-grow: 1; flex-grow: 1;
position: relative; position: relative;
.editor__content::v-deep { .editor__content:deep {
flex-grow: 1; flex-grow: 1;
margin-left: 44px; margin-left: 44px;

2
src/views/Dashboard.vue
View File

@@ -164,7 +164,7 @@ export default {
margin-top: 3px; margin-top: 3px;
} }
.duedate::v-deep { .duedate:deep {
.due { .due {
margin: 0 0 0 10px; margin: 0 0 0 10px;
padding: 2px 4px; padding: 2px 4px;