Skip to content

Column inside section ignores text-align #194

Description

@bernaferrari

when a column is inside a section, text-align from section doesn't seem to be apply to it. I asked gemini 2.5 pro to fix, and seems to work. Not sure it would work on column inside column or whatever, but basic usage seems to work well.

I fixed by

    const [newNode, totalWidth] = this.adjustColumnsContent(node, options);

in columns, then

  private adjustColumnsContent(
    node: JSONContent,
    options?: NodeOptions
  ): [JSONContent, number] {
    const { content = [] } = node;
    const parentAlign = options?.parent?.attrs?.align || DEFAULT_SECTION_ALIGN; // Get align from parent (section)

...

          return {
            ...c,
            attrs: {
              ...c.attrs,
              width: isAutoWidthColumn ? measuredWidth : c.attrs?.width,
              align: parentAlign,

then

  private column(node: JSONContent, options?: NodeOptions): JSX.Element {
    const { attrs } = node;
    const {
      width,
      paddingLeft = 0,
      paddingRight = 0,
      align: textAlign,
    } = attrs || {};
...

        className="tab-col-full"
      >
        <Section
          style={{
            margin: 0,
            paddingLeft,
            paddingRight,
            textAlign: textAlign,
          }}

Editor:
Image

Export:
Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions