vercel / vercel/hyper

Can Extensions or CSS modify line spacing?

Open
#4,724 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
44.7k
Forks
3.6k
Avg merge
21m
Merged PRs (30d)
1

Description

  • I am on the latest Hyper.app version
  • I have searched the issues of this repo and believe that this is not a duplicate
  • OS version and name: Windows 10 + WSL 1
  • Hyper.app version: 3.0.2
  • The issue is reproducible in vanilla Hyper.app:

Issue

I would like to add a few pixels of visual space between the last line of every terminal output and the first line of the next user input command.

To illustrate this visually, my goal is roughly:

image

To be clear: I do not want to add a carriage return before every user input. I want to add bottom-padding to the last line of each shell output to console.

Xterm.js renders shell text entirely in a canvas object, so I presume it cannot be modified easily with CSS in the .hyper.js file. Is that correct?

I have also seen that I can use TermCSS to modify the layout, but I can't find any documentation explaining what TermCSS is. I also looked at xterm's documentation and I couldn't easily see an affordance for making this happen.

How would you suggest adding a bit of spacing after shell return statements?

Thank you for building Hyper.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by tracing Hyper's TermCSS and .hyper.js extension handling, then inspect how xterm.js renders terminal rows in its canvas. Determine whether row spacing can be exposed through the existing extension or CSS mechanisms, and document or implement the smallest supported approach with a reproducible example.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, typescript
Domain
desktop, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.