From 1449a36ff0634b3d02bb4fc4ffbd8e5bcdb73ea9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Raimund=20Schl=C3=BC=C3=9Fler?= Date: Thu, 13 Oct 2022 21:29:33 +0200 Subject: Fix TaskCreateDialog and Multiselect appearance MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Raimund Schlüßler --- src/components/AppSidebar/CalendarPickerItem.vue | 2 ++ src/components/AppSidebar/MultiselectItem.vue | 1 + src/components/AppSidebar/TagsItem.vue | 2 ++ src/components/TaskCreateDialog.vue | 23 ++++++++++------------- 4 files changed, 15 insertions(+), 13 deletions(-) diff --git a/src/components/AppSidebar/CalendarPickerItem.vue b/src/components/AppSidebar/CalendarPickerItem.vue index 711c328d..e49135f0 100644 --- a/src/components/AppSidebar/CalendarPickerItem.vue +++ b/src/components/AppSidebar/CalendarPickerItem.vue @@ -121,6 +121,7 @@ export default { .multiselect__tags { border: 1px solid transparent; height: 44px; + padding: 0 !important; .multiselect__single { padding: 0; @@ -133,6 +134,7 @@ export default { position: absolute !important; font-weight: bold; font-size: var(--default-font-size); + line-height: 44px; } } diff --git a/src/components/AppSidebar/MultiselectItem.vue b/src/components/AppSidebar/MultiselectItem.vue index 35847876..6f3633a1 100644 --- a/src/components/AppSidebar/MultiselectItem.vue +++ b/src/components/AppSidebar/MultiselectItem.vue @@ -131,6 +131,7 @@ export default { .multiselect__tags { border: 1px solid transparent; height: 44px; + padding: 0 !important; .multiselect__single { padding: 0; diff --git a/src/components/AppSidebar/TagsItem.vue b/src/components/AppSidebar/TagsItem.vue index 18251fa9..0b190fe8 100644 --- a/src/components/AppSidebar/TagsItem.vue +++ b/src/components/AppSidebar/TagsItem.vue @@ -148,6 +148,7 @@ export default { .multiselect__tags { border: 1px solid transparent; height: 44px; + padding: 0 !important; flex-grow: 1; .multiselect__single { @@ -166,6 +167,7 @@ export default { position: absolute !important; font-weight: bold; font-size: var(--default-font-size); + line-height: 44px; } .multiselect__tags-wrap { diff --git a/src/components/TaskCreateDialog.vue b/src/components/TaskCreateDialog.vue index e56c1409..f5a5ad36 100644 --- a/src/components/TaskCreateDialog.vue +++ b/src/components/TaskCreateDialog.vue @@ -219,9 +219,8 @@ export default { .empty-content { margin: 10vh 0; - ::v-deep p { + :deep(.empty-content__action) { display: flex; - justify-content: flex-end; } } } @@ -230,9 +229,8 @@ export default { border-bottom: none; margin-bottom: 3px; - :deep(.multiselect) { - border: 1px solid var(--color-border-dark); - border-radius: var(--border-radius); + :deep(.multiselect .multiselect__tags) { + border: 2px solid var(--color-border-dark); } } @@ -241,15 +239,14 @@ export default { .material-design-icon { position: absolute; - top: 12px; - left: 12px; + top: 14px; + left: 14px; } input, textarea { width: 100%; - font-size: var(--default-font-size); - padding-left: 44px; + padding-left: 44px !important; } input { @@ -264,10 +261,10 @@ export default { } } - .modal-buttons { - display: flex; - justify-content: flex-end; - } +.modal-buttons { + display: flex; + justify-content: flex-end; +} :deep(.calendar-picker-option__label), :deep(.property__item .multiselect__tags) input.multiselect__input { -- cgit v1.2.3