Lightningで見栄えの良いターミナル風画面

Lightningで見栄えの良いターミナル風画面†

CSSのカスタマイズで見栄えの良いターミナル風画面を作ってみる。
いろいろ方法はあるが、今回は、ExUnit > CSSカスタマイズ で追加する。

表示したい箇所は「コード<>」を選択して、追加CSSクラスに「TerminalBox」を指定する。
プレビュー画面での確認になるがまぁまぁ見た目は良いはず

/* ターミナル画面 */
.TerminalBox {
  padding: 0.5em;
  margin: 15px 0;
  color: white;
  background:#24292e;/*背景色*/
  font-family: “SFMono-Regular”,Consolas,”Liberation Mono”,Menlo,Courier,monospace
}
.TerminalBox p {
  padding: 0;
  margin: 0;
}

出来上がりはこんな感じ

おまけで、ラズパイのようにプロンプトに色がついていれば、

で着色するとさらにいい感じかな？

TeraTerm の画面加工†

TeraTermのコンソール画面だけを切り出す方法

$ convert -crop 798x538+1+67 hogehoge_original.png hogehoge_custom.png

みたいにすると良い

最近10件

人気の10件

3963

昨日の10件

お問い合わせはこちら

このサイトはアフィリエイト広告（Amazonアソシエイト含む）を掲載しています。

edit