ATOMのターミナルを笑い男に乗っ取られたい #ATOM

I thought what I'd do was, I'd pretend I was one of those deaf-mutes（僕は耳と目を閉じ、口をつぐんだ人間になろうと考えた）

ここ一年くらい私のAtomのターミナルはこんな感じである。
Term2からTerm3に移行したことはあったものの背景は変えていない。
最近はTerminal Plusとやらが主流なんですか？

説明

全ての情報は共有し並列化した時点で、単一性を喪失し動機なき他者の無意識に、あるいは動機ある他者の意思に内包される

コードは次の通り。

styles.less

.terminal {
  margin: -180px 0 0 -300px;
  padding: 120px 0 0 380px !important;
  height: 150%;
  width: 150%;
  background:url('https://cloud.githubusercontent.com/assets/8326452/9350606/361e7742-468d-11e5-82c8-2b642282f1e6.png');
  background-size: 4%;
  background-color: rgb(34, 38, 53)!important;
  transform: rotate(-9deg);
}

AtomのSettings - Themes - your stylesheetsを押して、これを記述する。
説明が必要なものを後述する。

コードについて

単純にbackgroundで画像を指定しただけでは、なにかちょっと随分と規則正しく笑い男が並んでしまったので、transform: rotate(-9deg);といった具合に角度を付けた。引数の数字を変えれば角度は変わる。

角度を変えたことで、背景が埋めきれない。ぴったりサイズが同じ四角形Aと四角形Bが上下に重なりあっているとして、AがBを覆えるのは角度が一致しているときだけであるとか言えばわかるだろうか。
要するに、100%の量ではダメなので、width: 150%; height: 150%;としてある。別にこの数値じゃないといけないわけではない。
またサイズを変更したことにより、傾いた四角形の左上の位置が変わってくる。
そのため、marginとpaddingで雑に調整した。
paddingの方だけ、パッケージ側でネストされているので、仕方なく!importantを使用。
background-size: 4%;はあんまり気付いていなかったが、予想以上にかなり大きい画像を用意してしまったというだけで、画像自体のサイズを変えてもよい。ただ、大きくする分にはジャギるが小さくする分には（見栄え上の）被害はすくないので気にしていない。これを大きく表示したいと思うことも視野に入れておいている。
残る説明はbackground-colorについて。これは笑い男の周辺色のことである。Term3の設定画面上からもこの色は変更できるのだが、Term3の設定自体を変更してしまうと、この画像を取り除いたときに面倒だと思ったので、いつでもコードを取っ払えばデフォルトの状態に戻るようにキープしてある。
当然、このコードもTerm3の設定を上書かなければならないので、!importantを使用。

画像について

背景の笑い男は、どこかから入手してPhotoshopで色味を好みの具合にするために加工した。
背景画像としてセットしたい。そのためには、画像をどこかに配置しないといけない。

ローカルに置いてパス指定する場合
ローカルに画像を置いてセットすると複数のPCで同じようにしようとすると、複数のPCで配置しないといけない。2度手間が嫌なので却下。
Dropboxなどのオンラインストレージに置く場合
これもひとつの手だと思います。
ただ、Dropboxのどこに置くかで私は迷いました。
結構ディレクトリの整理をする人間で、1年後に同じディレクトリ構成を保っているかの自信がなく、なおかつ整理整頓する場合にAtomで使っているからこれは動かせないというのが非常に嫌でした。
要するに好みの問題で却下。
テキトーにどっかにホスティングする
すごく雑な表現をしているが、これがベストだと考えている。
やり方は次のgifアニ見てください。

私の場合はGitHubのページで、画像をドラッグ＆ドロップできるところを利用して、URL生成させてます。gifの例でいうと、Issueのところですな。ちなみに、Qiitaでもできます。
これの最高のコードは、自分が一切の管理をしていないにも関わらず保管され続けるという点。最高だ。明日自分のMacを初期化したとしてもこの画像は残り続けるのだ。もちろん、消せもしない。
デメリットは、URLさえわかれば誰でもアクセスできる点とアクセスするためのURLをきちんと知らないといけない点。
しかし、前者はURLが複雑（上記のgifのURLはhttps://qiita-image-store.s3.amazonaws.com/0/58800/4a03ac82-e4a9-c68a-5e0b-a58f3e6b962b.gif）なので問題ないと思う。
後者は、別にこんなURLは使い捨て感覚で再度作ればよいだけという考え方で解決できる。
あとサーバーぶっ飛んだら終了、そんなこと言ったら世の中のWebサービスすべて使えないですね。

動機

覗きが趣味ですから

一応、Atomでターミナルできるようにって入れている人も多いと思うのですけど、私の場合はそれで長時間の作業はせず、ちょっとしたことの対応だけしかしないので、頭おかしい感じにしようと思ってこうしました。

正直、見にくいです。
ですが、この見にくさがちゃんとターミナルで作業しようというモチベーションを与えてくれるので、すばらしいです。
「だがそれがいい」って感じです。（作品違う）

実際に、何度かかなり神経使う作業をAtomのターミナルでしてしまい、その途中でAtomが耐えられなくなり落ちてしまったということを何度か発生させてしまったからです。

もちろんこんな理由は後付けで、ある日突然思いついたように笑い男の画像を編集しはじめて、スタイルを調整してただけである。

発展

だがならざるべきか

要素を重ねられるのでできる表現が広がります。
雑に素子の上にかぶせてみました。

当然、重ねたら見にくくなるので、上にかぶせた笑い男マークもまっすぐに変更したり微妙にサイズ変えたりしました。
文字の可読性をある程度まで担保するのがめんどうなので私は普段こうはしていません。（斜めになっている時点で可読性などお察しである）

styles.less

.term3 {
  background: url('https://cloud.githubusercontent.com/assets/8326452/16000296/88315a42-3186-11e6-8b0c-82a88ba70e20.png');
  background-position: right 0;
  background-size: cover;
  background-repeat: no-repeat;
}
.terminal {
  background:url('https://cloud.githubusercontent.com/assets/8326452/9350606/361e7742-468d-11e5-82c8-2b642282f1e6.png');
  background-size: 8%;
  background-color: rgba(40, 40, 70, .4)!important;
}

ベースの画像はcoverして、上の画像の周辺色をアルファ値セットして透過した。

笑い男について

イエス

笑い男がなんだかわからない人は、攻殻機動隊見てください。そのためにHuluと契約しても損ではありません。
というか攻殻機動隊を知らないのはヤバすぎてバイヤーなので、Qiita見てないで攻殻機動隊を見てください。
なお、プライムビデオでは配信されておりません。

プライムビデオさん、なにとぞご配信のほどよろしくお願いいたします。