diff --git a/docs/releases/unreleased.md b/docs/releases/unreleased.md index 67d0144c..3e46a959 100644 --- a/docs/releases/unreleased.md +++ b/docs/releases/unreleased.md @@ -27,4 +27,5 @@ Example: ## Fixed - Made the markdown editor areas in task modals easier to click and focus. +- Strengthened local CSS linting to catch unscoped selectors, unknown CSS, and fixed-position overlays before review. - Reduced false-positive plugin review warnings by making background auto-export and auto-archive schedulers non-overlapping and tightening type/string conversion paths. diff --git a/src/modals/TaskCreationModal.ts b/src/modals/TaskCreationModal.ts index 358db602..47f00b0c 100644 --- a/src/modals/TaskCreationModal.ts +++ b/src/modals/TaskCreationModal.ts @@ -121,7 +121,9 @@ export class TaskCreationModal extends TaskModal { const nlContainer = container.createDiv("nl-input-container"); // Create markdown editor container - const editorContainer = nlContainer.createDiv("nl-markdown-editor"); + const editorContainer = nlContainer.createDiv( + "tn-task-modal__markdown-editor tn-task-modal__markdown-editor--nlp" + ); editorContainer.setAttribute("role", "textbox"); editorContainer.setAttribute("aria-label", this.t("modals.taskCreation.nlPlaceholder")); editorContainer.setAttribute("aria-multiline", "true"); @@ -310,7 +312,7 @@ export class TaskCreationModal extends TaskModal { } protected createActionBar(container: HTMLElement): void { - this.actionBar = container.createDiv("action-bar"); + this.actionBar = container.createDiv("tn-task-modal__action-bar"); // NLP-specific icons (only if NLP is enabled) if (this.plugin.settings.enableNaturalLanguageInput) { diff --git a/src/modals/TaskEditModal.ts b/src/modals/TaskEditModal.ts index b3036b27..199df85e 100644 --- a/src/modals/TaskEditModal.ts +++ b/src/modals/TaskEditModal.ts @@ -633,11 +633,13 @@ export class TaskEditModal extends TaskModal { } protected createActionButtons(container: HTMLElement): void { - const buttonContainer = container.createDiv("modal-button-container"); + const buttonContainer = container.createDiv( + "modal-button-container tn-task-modal__button-bar" + ); // Add "Open note" button const openNoteButton = buttonContainer.createEl("button", { - cls: "open-note-button", + cls: "tn-task-modal__open-note-button", text: this.t("modals.task.buttons.openNote"), }); @@ -647,7 +649,7 @@ export class TaskEditModal extends TaskModal { // Add "Archive" button const archiveButton = buttonContainer.createEl("button", { - cls: "mod-warning archive-button", + cls: "mod-warning tn-task-modal__archive-button", text: this.task.archived ? this.t("modals.taskEdit.buttons.unarchive") : this.t("modals.taskEdit.buttons.archive"), diff --git a/src/modals/TaskModal.ts b/src/modals/TaskModal.ts index 7f99bf4e..2f26b443 100644 --- a/src/modals/TaskModal.ts +++ b/src/modals/TaskModal.ts @@ -475,7 +475,7 @@ export abstract class TaskModal extends Modal { } protected createActionBar(container: HTMLElement): void { - this.actionBar = container.createDiv("action-bar"); + this.actionBar = container.createDiv("tn-task-modal__action-bar"); // Due date icon this.createActionIcon( @@ -669,7 +669,9 @@ export abstract class TaskModal extends Modal { detailsLabel.textContent = this.t("modals.task.detailsLabel"); // Create container for the markdown editor - const detailsEditorContainer = rightColumn.createDiv("details-markdown-editor"); + const detailsEditorContainer = rightColumn.createDiv( + "tn-task-modal__markdown-editor tn-task-modal__markdown-editor--details" + ); // Create embeddable markdown editor for details using shared method this.detailsMarkdownEditor = createTaskModalMarkdownEditor( @@ -949,10 +951,10 @@ export abstract class TaskModal extends Modal { // Add a section separator if there are user fields if (userFieldConfigs.length > 0) { - const separator = container.createDiv({ cls: "user-fields-separator" }); + const separator = container.createDiv({ cls: "tn-task-modal__user-fields" }); separator.createDiv({ text: this.t("modals.task.customFieldsLabel"), - cls: "detail-label-section", + cls: "tn-task-modal__section-label", }); } @@ -1073,12 +1075,14 @@ export abstract class TaskModal extends Modal { } protected createActionButtons(container: HTMLElement): void { - const buttonContainer = container.createDiv("modal-button-container"); + const buttonContainer = container.createDiv( + "modal-button-container tn-task-modal__button-bar" + ); // Add "Open note" button for edit modals only if (this.isEditMode()) { const openNoteButton = buttonContainer.createEl("button", { - cls: "open-note-button", + cls: "tn-task-modal__open-note-button", text: this.t("modals.task.buttons.openNote"), }); diff --git a/stylelint.config.mjs b/stylelint.config.mjs index 217f7755..6c2e3141 100644 --- a/stylelint.config.mjs +++ b/stylelint.config.mjs @@ -1,9 +1,12 @@ import stylelint from "stylelint"; +import selectorParser from "postcss-selector-parser"; const { createPlugin, utils } = stylelint; const noHasRuleName = "tasknotes/no-has"; const obsidianBrowserSupportRuleName = "tasknotes/obsidian-browser-support"; +const scopedSelectorsRuleName = "tasknotes/scoped-selectors"; +const noFixedPositionRuleName = "tasknotes/no-fixed-position"; const noHasRule = createPlugin(noHasRuleName, (enabled) => { return (root, result) => { @@ -96,10 +99,221 @@ const obsidianBrowserSupportRule = createPlugin( } ); +const ownedSelectorPatterns = [ + /^tasknotes(?:-|$)/u, + /^task-/u, + /^tn-/u, + /^nlp-/u, + /^advanced-calendar-view(?:__|$)/u, + /^agenda-view(?:__|$)/u, + /^calendar-view(?:__|$)/u, + /^mini-calendar-view(?:__|$)/u, + /^kanban-view(?:__|$)/u, + /^filter-(?:bar|heading|toggle)/u, + /^note-card(?:__|$)/u, + /^pomodoro(?:-|$)/u, + /^stats-view(?:__|$)/u, + /^status-bar$/u, + /^modal-form(?:__|$)/u, + /^date-picker(?:__|$)/u, + /^file-selector/u, + /^unscheduled-tasks-selector/u, + /^reminder-/u, + /^time-entry-editor/u, + /^webhook-/u, + /^ics-/u, + /^base-/u, + /^bases-/u, + /^fc-/u, + /^timeblock-/u, + /^attachment-/u, + /^settings-status-indicator$/u, + /^date-picker-/u, + /^mini-calendar-note-preview$/u, + /^preview-/u, + /^autocomplete-/u, + /^hide-today-highlight$/u, + /^filter-date-help-tooltip$/u, + /^no-reminders$/u, + /^default-projects-list-container$/u, + /^field-mapping-input$/u, + /^icon-suggestion-/u, + /^google-calendar-/u, + /^microsoft-calendar-/u, + /^cm-widget-cursor-fix$/u, + /^cm-content$/u, +]; + +const allowedGlobalContextClasses = new Set([ + "theme-dark", + "theme-light", + "is-mobile", + "is-readable-line-width", + "mod-tasknotes", + "minimalist-task-modal", + "suggestion-item", + "modal", +]); + +const scopedContextClasses = new Set(["mod-tasknotes"]); + +const allowedHostClassesInScopedContext = new Set([ + "modal", + "modal-button-container", + "mod-cta", +]); + +const ignoredSelectorFiles = new Set([ + "variables.css", + "static-style-utilities.css", + "index.css", +]); + +function isOwnedClassOrId(name) { + return ownedSelectorPatterns.some((pattern) => pattern.test(name)); +} + +function isScopedSelector(selectorNode) { + let hasOwnedSelector = false; + let hasOnlyAllowedGlobals = true; + let hasClassOrId = false; + let hasScopedContext = false; + let hasOnlyScopedContextHostClasses = true; + + selectorNode.walk((node) => { + if (node.type !== "class" && node.type !== "id") { + return; + } + + hasClassOrId = true; + + if (isOwnedClassOrId(node.value)) { + hasOwnedSelector = true; + return; + } + + if (scopedContextClasses.has(node.value)) { + hasScopedContext = true; + } + + if (!allowedGlobalContextClasses.has(node.value)) { + hasOnlyAllowedGlobals = false; + } + + if ( + !scopedContextClasses.has(node.value) && + !allowedHostClassesInScopedContext.has(node.value) && + !allowedGlobalContextClasses.has(node.value) + ) { + hasOnlyScopedContextHostClasses = false; + } + }); + + if (hasOwnedSelector) { + return true; + } + + if (hasScopedContext && hasOnlyScopedContextHostClasses) { + return true; + } + + return !hasClassOrId && hasOnlyAllowedGlobals; +} + +const scopedSelectorsRule = createPlugin(scopedSelectorsRuleName, (enabled) => { + return (root, result) => { + if (!enabled) { + return; + } + + const filePath = root.source?.input?.file ?? ""; + const fileName = filePath.split(/[\\/]/u).pop() ?? ""; + + if ( + !filePath.includes("/styles/") || + filePath.includes("/docs-builder/") || + ignoredSelectorFiles.has(fileName) + ) { + return; + } + + root.walkRules((ruleNode) => { + if (ruleNode.parent?.type === "atrule" && ruleNode.parent.name === "keyframes") { + return; + } + + let parsedSelector; + try { + parsedSelector = selectorParser().astSync(ruleNode.selector); + } catch { + return; + } + + parsedSelector.each((selectorNode) => { + if (isScopedSelector(selectorNode)) { + return; + } + + utils.report({ + message: + "Scope plugin CSS with a TaskNotes-owned selector or an explicit allowed global context.", + node: ruleNode, + result, + ruleName: scopedSelectorsRuleName, + }); + }); + }); + }; +}); + +const fixedPositionAllowSelectors = [ + /date-picker-modal/u, + /stats-view__modal-backdrop/u, + /tn-selection-indicator/u, + /tn-fixed/u, +]; + +const noFixedPositionRule = createPlugin(noFixedPositionRuleName, (enabled) => { + return (root, result) => { + if (!enabled) { + return; + } + + const filePath = root.source?.input?.file ?? ""; + if (filePath.includes("/docs-builder/")) { + return; + } + + root.walkDecls("position", (declaration) => { + if (declaration.value.toLowerCase() !== "fixed") { + return; + } + + const selector = declaration.parent?.selector ?? ""; + if (fixedPositionAllowSelectors.some((pattern) => pattern.test(selector))) { + return; + } + + utils.report({ + message: + "Avoid fixed positioning in plugin CSS unless there is a narrowly reviewed exception.", + node: declaration, + result, + ruleName: noFixedPositionRuleName, + }); + }); + }; +}); + const warning = { severity: "warning" }; export default { - plugins: [noHasRule, obsidianBrowserSupportRule], + plugins: [ + noHasRule, + obsidianBrowserSupportRule, + scopedSelectorsRule, + noFixedPositionRule, + ], rules: { "color-hex-length": [ "long", @@ -118,7 +332,24 @@ export default { }, ], "no-duplicate-selectors": [true, warning], + "property-no-unknown": [true, warning], + "selector-pseudo-class-no-unknown": [ + true, + { + ...warning, + ignorePseudoClasses: ["global"], + }, + ], + "selector-type-no-unknown": [ + true, + { + ...warning, + ignoreTypes: ["pro"], + }, + ], [noHasRuleName]: [true, warning], [obsidianBrowserSupportRuleName]: [true, warning], + [scopedSelectorsRuleName]: [true, warning], + [noFixedPositionRuleName]: [true, warning], }, }; diff --git a/styles/calendar-view.css b/styles/calendar-view.css index 7370df3c..170f90e8 100644 --- a/styles/calendar-view.css +++ b/styles/calendar-view.css @@ -168,7 +168,6 @@ border: 1px solid var(--tn-border-color); border-radius: var(--tn-radius-sm); overflow: hidden; - role: grid; } /* Calendar Grid Header Row */ @@ -178,7 +177,6 @@ grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--tn-bg-secondary); - role: row; } /* Calendar Week Row */ @@ -187,7 +185,6 @@ display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; - role: row; } /* Calendar Day Header (Sun, Mon, etc.) */ @@ -202,7 +199,6 @@ color: var(--tn-text-muted); background: var(--tn-bg-secondary); border: none; - role: columnheader; } /* Calendar Day Cell - consistent styling */ @@ -222,7 +218,6 @@ transition: all var(--tn-transition-fast); font-size: var(--tn-font-size-sm); font-weight: 500; - role: gridcell; } .tasknotes-plugin .calendar-view__day:hover, diff --git a/styles/note-card-bem.css b/styles/note-card-bem.css index c3fb1276..f1b0c0cf 100644 --- a/styles/note-card-bem.css +++ b/styles/note-card-bem.css @@ -25,8 +25,6 @@ cursor: var(--cursor, pointer); transition: background-color var(--tn-transition-fast); outline: none; - role: listitem; - tabindex: 0; } .tasknotes-plugin .note-card:hover { @@ -335,4 +333,3 @@ font-size: var(--tn-font-size-sm); } } - diff --git a/styles/reminder-modal.css b/styles/reminder-modal.css index 4aafaf7f..52f5d2bd 100644 --- a/styles/reminder-modal.css +++ b/styles/reminder-modal.css @@ -563,16 +563,6 @@ border: 1px solid var(--border-color); } -/* Modal button styling */ -.modal-button-container { - display: flex; - justify-content: flex-end; - gap: var(--size-4-2); - margin-top: var(--size-4-6); - padding-top: var(--size-4-4); - border-top: 1px solid var(--border-color); -} - /* ===================================================================== REMINDER DEFAULTS SECTION - Settings Tab Styling ===================================================================== */ @@ -831,4 +821,4 @@ .tasknotes-plugin .reminder-defaults-add-text { font-weight: 500; -} \ No newline at end of file +} diff --git a/styles/task-card-bem.css b/styles/task-card-bem.css index 96eb4e86..52a9a5a0 100644 --- a/styles/task-card-bem.css +++ b/styles/task-card-bem.css @@ -24,8 +24,6 @@ /* Interactions & Accessibility - Smooth transitions */ transition: all var(--tn-transition-fast); outline: none; - role: listitem; - tabindex: 0; } .tasknotes-plugin .task-card:hover { diff --git a/styles/task-modal.css b/styles/task-modal.css index fc468bc1..70056f84 100644 --- a/styles/task-modal.css +++ b/styles/task-modal.css @@ -15,7 +15,7 @@ EMBEDDABLE MARKDOWN EDITOR ===================================================================== */ -.details-markdown-editor { +.tn-task-modal__markdown-editor--details { margin-bottom: var(--size-4-3); border: 1px solid var(--background-modifier-border); border-radius: var(--radius-s); @@ -24,20 +24,20 @@ max-height: 400px; } -.details-markdown-editor .task-details-editor { +.tn-task-modal__markdown-editor--details .task-details-editor { min-height: 200px; max-height: 400px; overflow-y: auto; } /* Make the editor container scrollable */ -.details-markdown-editor .cm-editor { +.tn-task-modal__markdown-editor--details .cm-editor { height: 100%; min-height: 200px; max-height: 400px; } -.details-markdown-editor .cm-scroller { +.tn-task-modal__markdown-editor--details .cm-scroller { overflow: auto; min-height: inherit; height: 100%; @@ -45,22 +45,22 @@ cursor: text; } -.details-markdown-editor .cm-sizer, -.details-markdown-editor .cm-contentContainer, -.details-markdown-editor .cm-content { +.tn-task-modal__markdown-editor--details .cm-sizer, +.tn-task-modal__markdown-editor--details .cm-contentContainer, +.tn-task-modal__markdown-editor--details .cm-content { box-sizing: border-box; min-height: inherit; min-width: 100%; width: 100%; } -.details-markdown-editor .cm-sizer, -.details-markdown-editor .cm-contentContainer { +.tn-task-modal__markdown-editor--details .cm-sizer, +.tn-task-modal__markdown-editor--details .cm-contentContainer { flex: 1 1 auto; } /* Style the editor content */ -.details-markdown-editor .cm-content { +.tn-task-modal__markdown-editor--details .cm-content { padding-left: var(--size-4-2); padding-right: var(--size-4-2); padding-top: var(--size-4-2); @@ -71,18 +71,18 @@ caret-color: var(--text-normal); } -.details-markdown-editor .cm-cursor, -.details-markdown-editor .cm-dropCursor { +.tn-task-modal__markdown-editor--details .cm-cursor, +.tn-task-modal__markdown-editor--details .cm-dropCursor { border-left-color: var(--text-normal); } -.details-markdown-editor .cm-lineNumbers, -.details-markdown-editor .cm-gutters { +.tn-task-modal__markdown-editor--details .cm-lineNumbers, +.tn-task-modal__markdown-editor--details .cm-gutters { display: none; } /* Placeholder styling */ -.details-markdown-editor .cm-placeholder { +.tn-task-modal__markdown-editor--details .cm-placeholder { color: var(--text-faint); font-style: italic; } @@ -91,7 +91,7 @@ NLP MARKDOWN EDITOR ===================================================================== */ -.nl-markdown-editor { +.tn-task-modal__markdown-editor--nlp { margin-bottom: var(--size-4-2); border: 1px solid var(--background-modifier-border); border-radius: var(--radius-s); @@ -102,13 +102,13 @@ transition: all 0.2s ease; } -.nl-markdown-editor .nlp-editor { +.tn-task-modal__markdown-editor--nlp .nlp-editor { min-height: 80px; max-height: 200px; overflow-y: auto; } -.nl-markdown-editor .cm-editor { +.tn-task-modal__markdown-editor--nlp .cm-editor { height: 100%; min-height: 80px; max-height: 200px; @@ -117,17 +117,17 @@ } /* Focus state for NLP editor - match old nl-input styling */ -.nl-markdown-editor:focus-within { +.tn-task-modal__markdown-editor--nlp:focus-within { border-color: var(--interactive-accent); background: transparent; box-shadow: 0 0 0 2px rgba(var(--interactive-accent-rgb), 0.2); } -.nl-markdown-editor:focus-within .cm-editor { +.tn-task-modal__markdown-editor--nlp:focus-within .cm-editor { background: transparent; } -.nl-markdown-editor .cm-scroller { +.tn-task-modal__markdown-editor--nlp .cm-scroller { overflow: auto; min-height: inherit; height: 100%; @@ -135,21 +135,21 @@ cursor: text; } -.nl-markdown-editor .cm-sizer, -.nl-markdown-editor .cm-contentContainer, -.nl-markdown-editor .cm-content { +.tn-task-modal__markdown-editor--nlp .cm-sizer, +.tn-task-modal__markdown-editor--nlp .cm-contentContainer, +.tn-task-modal__markdown-editor--nlp .cm-content { box-sizing: border-box; min-height: inherit; min-width: 100%; width: 100%; } -.nl-markdown-editor .cm-sizer, -.nl-markdown-editor .cm-contentContainer { +.tn-task-modal__markdown-editor--nlp .cm-sizer, +.tn-task-modal__markdown-editor--nlp .cm-contentContainer { flex: 1 1 auto; } -.nl-markdown-editor .cm-content { +.tn-task-modal__markdown-editor--nlp .cm-content { padding-left: var(--size-4-2); padding-right: var(--size-4-2); padding-top: var(--size-4-3); @@ -160,18 +160,18 @@ caret-color: var(--text-normal); } -.nl-markdown-editor .cm-cursor, -.nl-markdown-editor .cm-dropCursor { +.tn-task-modal__markdown-editor--nlp .cm-cursor, +.tn-task-modal__markdown-editor--nlp .cm-dropCursor { border-left-color: var(--text-normal); } -.nl-markdown-editor .cm-lineNumbers, -.nl-markdown-editor .cm-gutters { +.tn-task-modal__markdown-editor--nlp .cm-lineNumbers, +.tn-task-modal__markdown-editor--nlp .cm-gutters { display: none; } -.nl-markdown-editor .cm-placeholder { +.tn-task-modal__markdown-editor--nlp .cm-placeholder { color: var(--text-muted); font-style: italic; } @@ -269,36 +269,14 @@ } /* Modal header with TaskNotes icon */ -.modal-header-container { - display: flex; - align-items: center; - gap: var(--size-4-2); - margin-bottom: var(--size-4-3); -} - -.modal-header-icon { - display: inline-block; - vertical-align: middle; - margin-right: 8px; - color: var(--color-accent); - width: 20px; - height: 20px; -} - -.modal-header-icon svg { - width: 20px; - height: 20px; - color: var(--color-accent); -} - /* User fields section styling */ -.user-fields-separator { +.tn-task-modal__user-fields { margin-top: var(--size-4-4); border-top: 0.5px solid var(--background-modifier-border); padding-top: var(--size-4-3); } -.detail-label-section { +.tn-task-modal__section-label { font-weight: 600; color: var(--text-muted); font-size: 0.9em; @@ -307,23 +285,6 @@ letter-spacing: 0.5px; } -.modal-header-icon .svg-icon { - width: 20px; - height: 20px; -} - -.modal-header-icon .tasknotes-simple { - width: 20px; - height: 20px; - color: var(--color-accent); -} - -.modal-header-title { - font-size: var(--font-ui-larger); - font-weight: var(--font-weight-bold); - color: var(--text-normal); -} - .tasknotes-plugin.minimalist-task-modal .modal-content { padding: 0; border-radius: var(--radius-l); @@ -390,7 +351,7 @@ ACTION BAR - ICON-BASED CONTROLS ===================================================================== */ -.tasknotes-plugin .action-bar { +.tasknotes-plugin .tn-task-modal__action-bar { display: flex; align-items: center; gap: var(--size-4-1); @@ -554,7 +515,7 @@ OPEN NOTE BUTTON (IN BUTTON BAR) ===================================================================== */ -.tasknotes-plugin .open-note-button { +.tasknotes-plugin .tn-task-modal__open-note-button { padding: var(--size-4-2) var(--size-4-3); font-weight: 500; border: 1px solid var(--interactive-accent); @@ -566,23 +527,23 @@ min-width: 80px; } -.tasknotes-plugin .open-note-button:hover { +.tasknotes-plugin .tn-task-modal__open-note-button:hover { background: var(--interactive-accent); color: var(--text-on-accent); border: 1px solid var(--interactive-accent); } -.tasknotes-plugin .open-note-button:active { +.tasknotes-plugin .tn-task-modal__open-note-button:active { background: var(--interactive-accent); color: var(--text-on-accent); border: 1px solid var(--interactive-accent); } -.tasknotes-plugin .open-note-button:focus-visible { +.tasknotes-plugin .tn-task-modal__open-note-button:focus-visible { box-shadow: 0 0 0 3px var(--background-modifier-border-focus); } -.tasknotes-plugin .archive-button:focus-visible { +.tasknotes-plugin .tn-task-modal__archive-button:focus-visible { box-shadow: 0 0 0 3px var(--background-modifier-border-focus); } @@ -651,7 +612,7 @@ body:not(.is-mobile) .modal.mod-tasknotes .modal-button-container .mod-cta { padding: var(--size-4-3); } - .tasknotes-plugin .action-bar { + .tasknotes-plugin .tn-task-modal__action-bar { flex-wrap: wrap; gap: var(--size-4-2); } @@ -726,12 +687,12 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co /* Title input container - first item */ .tasknotes-plugin.minimalist-task-modal .modal-split-left .title-input-container, -.tasknotes-plugin.minimalist-task-modal .modal-split-left .nl-markdown-editor { +.tasknotes-plugin.minimalist-task-modal .modal-split-left .tn-task-modal__markdown-editor--nlp { order: 1; } /* Action bar - second item */ -.tasknotes-plugin.minimalist-task-modal .modal-split-left .action-bar { +.tasknotes-plugin.minimalist-task-modal .modal-split-left .tn-task-modal__action-bar { order: 2; } @@ -805,8 +766,8 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co } .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .title-input-container, - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .nl-markdown-editor, - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .action-bar, + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .tn-task-modal__markdown-editor--nlp, + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .tn-task-modal__action-bar, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .details-container, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .completions-calendar-container, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-left .metadata-container { @@ -846,8 +807,8 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co } .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .title-input-container, - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .nl-markdown-editor, - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .action-bar, + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .tn-task-modal__markdown-editor--nlp, + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .tn-task-modal__action-bar, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .details-container, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .completions-calendar-container, .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-content--right-empty .modal-split-left .metadata-container { @@ -862,7 +823,7 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co } /* Make details editor fill the right column completely */ - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .details-markdown-editor { + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .tn-task-modal__markdown-editor--details { flex: 1; min-height: 0; height: 100%; @@ -875,7 +836,7 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co overflow: hidden; } - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .details-markdown-editor .cm-editor { + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .tn-task-modal__markdown-editor--details .cm-editor { flex: 1; height: 100%; max-height: none; @@ -883,13 +844,13 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co min-height: 320px; } - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .details-markdown-editor .cm-scroller { + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .tn-task-modal__markdown-editor--details .cm-scroller { flex: 1; max-height: none; overflow-y: auto; } - .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .details-markdown-editor .task-details-editor { + .tasknotes-plugin.minimalist-task-modal.split-layout-enabled.expanded .modal-split-right .tn-task-modal__markdown-editor--details .task-details-editor { max-height: none; flex: 1; min-height: 320px;