react-terminal-viewer/dist/esm/TerminalViewerBody/index.less

<h1 align="center"> react-terminal-viewer </h1>

.terminal-viewer-body {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #24292e;

  .terminal.xterm {
    padding: 16px;
  }

  // canvas 模式
  .xterm-cursor-layer {
    display: none;
  }

  // dom 模式
  .xterm-cursor {
    color: inherit !important;
    background: transparent !important;
    outline: none !important;
    outline-offset: 0 !important;
  }

  .xterm-rows {
    will-change: contents;
  }

  // dom 模式下的搜索高亮
  .xterm-decoration-top {
    color: #000;
  }

  // 关键字渲染无法右键复制
  .xterm-decoration {
    pointer-events: none;
  }
}

.terminal-viewer-body-empty {
  position: absolute;
  z-index: 1600;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #b5bbc6;
}