How to change Jquery terminal cursor shape? I want it to be '|' not a block

Question

How to change Jquery Terminal cursor shape ? I have tried messing with the CSS described here http://terminal.jcubic.pl/css/jquery.terminal.css But I could only change the color not the shape!

Answer 1

You can use border-left to simulate bar cursor like this:

.terminal .inverted, .cmd .inverted, .cmd .cursor.blink {
  color: #aaa;
  border-left: 1px solid #aaa;
  background-color: black;
  margin-left: -1px;
}
@keyframes terminal-blink {
  0%, 100% {
      border-left-color: #aaa;
  }
  50% {
      border-left-color: #000;
  }
}

here is demo with prefix animation for other browsers.

EDIT Right now you can use css variable --animation: terminal-bar; to enable bar cursor.