From 61f0f814dfdca5d2b3cd9e01e61e658f4bd3a39a Mon Sep 17 00:00:00 2001 From: Jalad Date: Tue, 12 May 2026 19:35:49 -0500 Subject: [PATCH] Added fixes to remove using important and has in styles.css. --- src/ContactCard.ts | 6 ++++-- src/views/ContactsBasesView.ts | 26 +++++++++++++++++++++----- styles.css | 24 ++++++++++++------------ 3 files changed, 37 insertions(+), 19 deletions(-) diff --git a/src/ContactCard.ts b/src/ContactCard.ts index e41c5ae..c6544c8 100644 --- a/src/ContactCard.ts +++ b/src/ContactCard.ts @@ -100,12 +100,14 @@ export function buildContactCard( img.src = app.vault.getResourcePath(photoFile); img.alt = displayName || "Contact photo"; } else { - setIcon(photoContainer, "user-round"); - photoContainer.children[0].classList.add(`${pluginId}-card-photo-default`); + setIcon(photoContainer, "user-round"); + photoContainer.children[0].classList.add(`${pluginId}-card-photo-default`); + photoContainer.children[0].classList.remove("svg-icon"); } } else { setIcon(photoContainer, "user-round"); photoContainer.children[0].classList.add(`${pluginId}-card-photo-default`); + photoContainer.children[0].classList.remove("svg-icon"); } /* Name, Company, and Title */ diff --git a/src/views/ContactsBasesView.ts b/src/views/ContactsBasesView.ts index 3eb7ce4..2b68727 100644 --- a/src/views/ContactsBasesView.ts +++ b/src/views/ContactsBasesView.ts @@ -39,6 +39,9 @@ export class ContactsBasesView extends BasesView { // Hide obsidian bases + New and show plugin version instead this.injectNewButton(); + // Tag the bases header sibling so styles can target it + this.tagHeader(); + // Empty container this.containerEl.empty(); @@ -127,6 +130,13 @@ export class ContactsBasesView extends BasesView { onunload(): void { this.containerEl.remove(); + + // Remove the injected new button and the header tag so other Bases views + // in this leaf get the native chrome back. + const leaf = this.scrollEl.closest(".workspace-leaf"); + leaf?.querySelector(`.${this.plugin.manifest.id}-bases-view-new-btn`)?.remove(); + leaf?.querySelector(`.${this.plugin.manifest.id}-bases-view-header`) + ?.removeClass(`${this.plugin.manifest.id}-bases-view-header`); } /* Bases' native New button creates a file using the visible columns' @@ -135,15 +145,12 @@ export class ContactsBasesView extends BasesView { to call, not a hook Bases calls on us), so the native button is hidden via CSS (scoped to leaves containing the plugin's bases' view) and the plugin injects its own */ - private newButtonInjected = false; - private injectNewButton(): void { - if (this.newButtonInjected) return; - const native = activeDocument.querySelector( `.workspace-leaf:has(.${this.plugin.manifest.id}-bases-view) .bases-toolbar-new-item-menu`, ); if (!native) return; + if (native.querySelector(`:scope > .${this.plugin.manifest.id}-bases-view-new-btn`)) return; const ourBtn = native.createEl("button", { cls: `${this.plugin.manifest.id}-bases-view-new-btn clickable-icon`, @@ -152,8 +159,17 @@ export class ContactsBasesView extends BasesView { setIcon(ourBtn, "lucide-plus"); ourBtn.createSpan({ cls: "text-button-label", text: "New"}); ourBtn.addEventListener("click", () => new NewContactNoteModal(this.plugin).open()); + } - this.newButtonInjected = true; + private tagHeader(): void { + const cls = `${this.plugin.manifest.id}-bases-view-header`; + let prev = this.scrollEl.previousElementSibling; + while (prev && !(prev instanceof HTMLElement && prev.matches("div.bases-header"))) { + prev = prev.previousElementSibling; + } + if (!(prev instanceof HTMLElement)) return; + if (prev.classList.contains(cls)) return; + prev.addClass(cls); } // Bases Options diff --git a/styles.css b/styles.css index 7a3668d..c8dc09d 100644 --- a/styles.css +++ b/styles.css @@ -38,16 +38,16 @@ .contact-note-card-photo-img, .contact-note-card-photo-default { - width: 150px !important; - height: 150px !important; + width: 150px; + height: 150px; border-radius: 50%; object-fit: cover; border: 2px solid var(--background-modifier-border); display: block; } -.contact-note-card-photo-default.svg-icon { - stroke-width: 1px !important; +.contact-note-card-photo-default { + stroke-width: 1px; } /* Info */ @@ -153,8 +153,8 @@ .contact-note-view .contact-note-card-photo-default, .contact-note-bases-view .contact-note-card-photo-img, .contact-note-bases-view .contact-note-card-photo-default { - width: 108px !important; - height: 108px !important; + width: 108px; + height: 108px; } .contact-note-view .contact-note-card-name, @@ -178,8 +178,8 @@ .contact-note-cards-condensed .contact-note-card-photo-img, .contact-note-cards-condensed .contact-note-card-photo-default { - width: 40px !important; - height: 40px !important; + width: 40px; + height: 40px; } .contact-note-cards-condensed .contact-note-card-name { @@ -194,7 +194,7 @@ The class is applied directly to the .mod-frontmatter element by the post-processor. */ .contact-note .mod-header { - display: none !important; + display: none; } /* #endregion */ @@ -203,7 +203,7 @@ /* Horizontal Lines */ .contact-note-view hr { - margin: 15px 0 15px 0 !important; + margin: 15px 0 15px 0; } /* Header */ @@ -276,9 +276,9 @@ } /* Hide the native Bases New button (but not the injected replacement) */ -.workspace-leaf:has(.contact-note-bases-view) +.contact-note-bases-view-header .bases-toolbar-new-item-menu .text-icon-button { - display: none !important; + display: none; } .contact-note-bases-view-new-btn {