diff --git a/src/assets/main.css b/src/assets/main.css index 363f441..0e97440 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -76,16 +76,16 @@ align-items: unset; } -.has-invalid-message { +.admonition-settings-modal .has-invalid-message { display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: 1fr auto; grid-template-rows: 1fr 1fr; grid-template-areas: "text image" "inv inv"; } -input.is-invalid { +.admonition-settings-modal input.is-invalid { border-color: #dc3545 !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; @@ -93,11 +93,11 @@ input.is-invalid { background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } -.admonition-type-setting input { +.admonition-settings-modal .admonition-type-setting input { grid-column: span 2; } -.invalid-feedback { +.admonition-settings-modal .invalid-feedback { display: block; grid-area: inv; width: 100%; diff --git a/src/settings.ts b/src/settings.ts index abb1b1d..5a640db 100644 --- a/src/settings.ts +++ b/src/settings.ts @@ -1037,9 +1037,11 @@ class SettingsModal extends Modal { admonitionPreview: HTMLElement; copy: boolean; originalType: string; + editing = false; constructor(public plugin: ObsidianAdmonition, admonition?: Admonition) { super(plugin.app); if (admonition) { + this.editing = true; this.color = admonition.color; this.icon = admonition.icon; this.type = admonition.type; @@ -1052,6 +1054,8 @@ class SettingsModal extends Modal { } async display() { + this.containerEl.addClass("admonition-settings-modal"); + this.titleEl.setText(`${this.editing ? "Edit" : "Add"} Admonition`); let { contentEl } = this; contentEl.empty();