UI bug: “Run SQL” button shifts to the right when resizing the textarea

[catherineisonline]

When the textarea inside the sql-input-container is resized horizontally, the “Run SQL” button moves to the right instead of staying aligned at the bottom. This makes the layout unstable and breaks the expected vertical flow of the input area.

Steps to reproduce:

• Open the page containing the SQL input container.
• Grab the resize handle on the textarea.
• Drag to the left to make the textarea smaller.
• Observe the “Run SQL” button shifting to the right side.

Environment: Chrome 142.0.7444.60 and Safari 26.1 on macOS (desktop)

The textarea should resize without affecting the alignment of the “Run SQL” button. The button should remain positioned directly below the textarea.

Suggested fix:
Apply a vertical flex layout to the container so elements stack consistently:

.sql-input-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#sql-input {
  resize: vertical;
  min-height: 120px;
}

#sql-link {
  align-self: flex-start;
}

Before:

After: