obsidian-meta-bind-plugin icon indicating copy to clipboard operation
obsidian-meta-bind-plugin copied to clipboard

Auto Resizing of `textArea` and `editor` Input Fields.

Open GudBoiNero opened this issue 11 months ago • 2 comments

Is your Feature Request Related to a Problem?

I am not exactly happy with the styling of the textArea or editor due to their scaling behaviors. They're less visually customizable than I would like, but the functionality is great.

Describe the Feature you'd Like

I wish that the textArea and editor input fields allowed for an option that would keep the height at the minimum height, so if there was no text it would look like an empty input box, then once you put a bunch of text in it would auto resize to fit the content.

I'm attempting to make a CSS snippet to do this right now, but it's really frustrating. Having this built-in would be amazing and I'm confident others would benefit from it.

Additional Context

No response

GudBoiNero avatar Mar 23 '24 18:03 GudBoiNero

Using this little CSS snippet I made you can do auto resizing with ONLY the markdown rendered version. Unfortunately the actual editing mode is made with a textarea element and resizing those automatically requires JS.

INPUT[editor(class(mb-editor-scaling))]
body {
    --mb-editor-min-height: 5rem;
}

.mb-editor-scaling {
    > .editor-input {
        // Removes strange bottom and right padding.
        overflow: hidden !important;
        // Settings change this
        min-height: var(--mb-editor-min-height) !important;
    }

    // `textarea` is the editable element, only shown when being interacted with
    // `div` is the markdown rendered element, it automatically resizes with this snippet.
    > div:has(textarea + div) {
        div {
            position: relative !important;
        }
    }
}

/* @settings

name: Meta Bind Editor Scaling
id: mb-editor-scaling
settings:
- id: mb-editor-min-height
  title: Editor Min Height
  type: variable-text
  default: 5rem

*/

GudBoiNero avatar Mar 23 '24 19:03 GudBoiNero

I might consider adding this as an argument in a future release.

mProjectsCode avatar Mar 25 '24 15:03 mProjectsCode