カテゴリー別アーカイブ: 未分類

iTerm2のフォントをSource Han Code JPに変更する

イケてる日本語等幅フォント “Source Han Code JP” というものがリリースされたようなので、iTermのフォントをこれに変更してみた。

Source Han Code JP のダウンロード

下記からダウンロードできる。
Release Fonts version 1.002 (OTF, OTC) · adobe-fonts/source-han-code-jp

DL後はふつうにインストールすればOK。

iTermのフォント設定

Prefecences > Profiles > TextからChange Fontで表示フォントを変更。

ちなみにSublime Textで表示フォントをこれにする場合は、
cmd + , でsettingをひらき、

"font_face": "Source Han Code JP"

を追加する。

なんとなく僕は、STの場合はデフォルトの方が見やすいなあと思ったので、そのままにしておいた。

参考サイト

Source Han Code JP

Githubが作ったエディタATOMを試す

エディタはSublime Textを使ってるのですが、ATOMが良いという記事をいくつか見かけたので、試しに使ってみました。

Atom

git使うなら断然こっちの方が良さそうだった。

便利なこと

  • 今いるブランチが分かる
  • ファイルの状況(更新した・追加した など)が分かる
  • ファイルのどの部分を変更したか分かる

ヤバイね。
パッケージをインストールしたらさらに便利になりそう。

最初に設定したこと

フォントサイズを小さく

最初がデカすぎた。cmd + -でOK

不可視文字を表示

Setting > Show Invisiblesにチェック。
スペース・タブを表示してくれる

インデントを表示

Setting > Show Indentにチェック。
インデントが分かりやすく表示される

引き続き使ってみて、パッケージなどインストールしてカスタムしてみる。

counter-incrementプロパティを使ってcssだけで連番をつける

表の見出しを順序付きリストっぽく連番を振りたかったので、counter-incrementプロパティを使ってcssだけで連番をつけた。

See the Pen WvopgL by Hiroaki Takeuchi (@eturlt) on CodePen.

counter-increment: Num;

でNumが指定した数字をひとつ進める。

content: counter(Num);

で表示する。
具体的にはcssを参照。

counter-reset: Num;

で数字をリセットする

注意

たとえ数字をリセットしたくなくても、

counter-reset: Num;

の記述がどこかにないと全部1とかになっちゃう。

SublimeText 3 にインストールしたPackage一覧

Syntax Highlighting for Sass

.scssのシンタックスハイライトを追加。無いと困る。
いままで使ってた”Sass”よりも頻繁に更新されてるっぽかったので。
Syntax Highlighting for Sass – Packages – Package Control

SFTPSync

“SFTP”が使えなかったので。
(まだ使ってないので使用感分からないけど)
FTPSync – Packages – Package Control

Sidebar Enhancements

サイドバーの右クリックがすごく便利になる。必須。
SideBarEnhancements – Packages – Package Control

Emmet

Emmetです。
Emmet – Packages – Package Control

AutoFileName

<img /><a>でファイル名を自動で探してくれる。便利。
AutoFileName – Packages – Package Control

Packageを探すの楽しい。
他にもちょこちょこ追加していこう。